Free course

Web Forms Course

Learn to build accessible forms, validate input, submit data and files, use FormData, and handle user input safely on the server.

7 modules · 34 lessons · No signup

Prerequisites: HTML, JavaScript and HTTP

~~~

Your progress

of lessons completed.

Course completed.

What you'll learn

Build accessible forms and understand the complete browser-to-server submission path.

Course contents

  1. What a form does

    Controls, name-value pairs, methods, and browser submission.

    1. ✓ What a form does
    2. ✓ Form action and method
    3. ✓ Which controls are submitted
    4. ✓ Submit buttons

  2. Text and choice controls

    Choose and combine the native controls users need.

    1. ✓ Text controls
    2. ✓ Numbers, dates, and ranges
    3. ✓ Checkboxes and radio buttons
    4. ✓ Select menus
    5. ✓ File inputs
    6. ✓ Check your understanding: native form controls

  3. Accessible form structure

    Labels, instructions, focus, and useful error messages.

    1. ✓ Label every control
    2. ✓ Group related controls
    3. ✓ Write useful instructions
    4. ✓ Keyboard and focus behavior
    5. ✓ Write accessible error messages

  4. Browser validation

    Declare input constraints and explain validation errors.

    1. ✓ Required values and length constraints
    2. ✓ Patterns and formats
    3. ✓ The Constraint Validation API
    4. ✓ Validate on both client and server

  5. Submission formats

    URL encoding, multipart data, FormData, and file uploads.

    1. ✓ URL-encoded form data
    2. ✓ Multipart form data
    3. ✓ The FormData object
    4. ✓ Redirect after a successful POST
    5. ✓ Check your understanding: forms over HTTP

  6. JavaScript and forms

    Handle events and submit data with fetch.

    1. ✓ Handle the submit event
    2. ✓ Submit a form with fetch
    3. ✓ Pending, success, and error states
    4. ✓ Reset after success
    5. ✓ Check your understanding: asynchronous form code

  7. Server-side safety

    Validate input and protect form endpoints from abuse.

    1. ✓ Never trust submitted input
    2. ✓ Protect cookie-authenticated forms from CSRF
    3. ✓ Limit abuse and automated submissions
    4. ✓ Handle file uploads safely
    5. ✓ Build a complete feedback form