Exercise 2 of 3: Client Homework Form
Now you're connecting two systems: a form your clients fill out, and a Google backend that emails the answers to you. This is the bridge between "static page" and "real software." Estimated time: 45 minutes.
You're building two things that talk to each other:
- The front end: An HTML form your clients open in their browser. It has questions, text fields, and a "Submit" button.
- The back end: A tiny script running on Google's servers that receives the form data and sends you an email with the answers.
What the client experiences:
- They open a link you send them
- They see a professional-looking form with questions
- They type their answers
- Their work auto-saves in their browser (so they can close and come back)
- They click "Submit" and see a confirmation
- You get an email with all their answers, neatly formatted
Google Apps Script is Google's free automation tool. It runs JavaScript on Google's servers and can send emails, read spreadsheets, and respond to web requests. You're going to create a tiny script that does one thing: receive data from your form and email it to you.
You'll see a code editor with some default text (function myFunction() { }). Delete all of it and replace it with the code below:
YOUR_EMAIL@gmail.com to your actual Gmail address. This is where the homework submissions will be sent.
Now deploy it as a web app:
Google will ask you to authorize the script. This is Google making sure YOU approve the script to send emails on your behalf.
You should now see a deployment confirmation with a Web app URL. It looks something like https://script.google.com/macros/s/ABC123.../exec.
Before building the form, let's make sure the backend works.
You should see the message: "This endpoint receives homework submissions. Use the form to submit." That's the doGet() function responding — it means the script is deployed and reachable.
Now you'll use Claude Code to build the front end — the HTML form your clients will see and fill out.
Now give Claude the big prompt. Replace the placeholder URL with your actual Google Apps Script Web app URL:
Content-Type: application/json header, the browser fires a CORS
preflight that Google Apps Script can't answer — and the submit fails with
no visible error. The prompt above tells Claude to avoid this by posting a
plain-text body. If your first test email doesn't show up, this is the first
thing to check.
This is the moment of truth. You're going to fill out the form and check if the email arrives.
Now test the backup feature:
And test the auto-save:
The questions above are generic. Customize them for YOUR practice. Go back to Claude Code and try:
Google Apps Script — free serverless backend for email, spreadsheets, and automation
Front-to-back communication — HTML form sends data to a backend via
fetch()Deployment — you deployed a live web endpoint that anyone can send data to
Error handling — fallback download button in case the email fails
This is the exact same pattern used to talk to any API. Google Apps Script today, QuickBooks tomorrow.