User Profile & Registration Form (HTML Only)

1. Overview

In this assignment, you will create a User Profile & Registration Form using pure HTML (no CSS, no JavaScript).
You will use Git Flow to manage your project development.

You will:

1. Build the HTML form in your Git repository

2. Use Git Flow branches:

   • development in dev branch

   • testing/staging in beta branch

   • final production in main branch

3. Publish your form using GitHub Pages, which must be served from the main branch

4. Submit only the GitHub repository URL on Moodle

2. Learning Objectives

You will learn to:

• Create structured HTML forms

• Use common HTML5 input types

• Apply semantic form architecture (fieldset, legend, label)

• Organize work using a simple Git Flow workflow

• Publish static HTML from the main branch using GitHub Pages

3. Task Description

Create a single HTML file that contains a User Profile & Registration Form.

Your file must be named:

This file must exist in the main branch at the end.

4. Form Requirements

Your form must include the following elements and sections:

🔹 A. User Information

Use <fieldset> + <legend> for this group.

Required fields:

• Full name — <input type="text" required>

• Email — <input type="email" required>

• Password — <input type="password" required>

• Phone — <input type="tel">

• Birthdate — <input type="date">

Each input must:

• Have a <label for="">

• Use a proper id=""

• Include appropriate validation (e.g., required, maxlength, pattern if needed)

🔹 B. Preferences Section

Use another <fieldset> + <legend>.

Include:

• Gender — radio buttons (Male / Female / Other)

• Hobbies — at least 3 checkboxes

• Country — a <select> with at least 5 options

🔹 C. Profile Setup

Include:

• Profile picture — <input type="file">

• Bio — <textarea rows="3">

• Favorite number — <input type="number" min="1" max="100">

🔹 D. Form Buttons

At the bottom of the form:

• Submit — <input type="submit">

• Reset — <input type="reset">

• Regular button — <button type="button">

No JavaScript required or allowed.

5. Technical Requirements

• ✔ HTML only (no CSS, no JS)

• ✔ At least 2 <fieldset> groups

• ✔ At least 10 total inputs

• ✔ Every input must have a valid <label>

• ✔ Clean indentation and readable structure

• ✔ Must render correctly in a browser

6. Git Flow Requirement (Important)

You must follow simple Git Flow branching:

1. dev branch

• All development work happens here

• All new code is written in dev

• Frequent commits are expected

2. beta branch

• Merge dev → beta when development is feature-complete

• This branch represents “testing/staging”

3. main branch

• Merge beta → main only when the work is fully ready

• This is the production branch

4. GitHub Pages

• Must be published from the main branch

• Ensure index.html is located in the root of main

7. What to Submit on Moodle

Submit only the GitHub repository URL, e.g.:

The instructor will check:

• Branch structure

• Commit history

• Git Flow usage (dev → beta → main merges)

• GitHub Pages working from main

• HTML file correctness

8. Grading Rubric