Assignment: Pizza Order Form

Estimated Time: 0.5 - 1 hour
Objectives:
  • To focus on important-to-know form tags
  • To check if the code conforms to standards using the validator
  • To apply indentation

Assignment:

Now that we've learned about the common types of form tags let's create an order form using only HTML. Whether you're ordering food online, reserving a flight ticket, or even registering in this bootcamp, you are submitting a form! You will be using lots and lots of forms over the next few months to send data to your backend, so let's get comfortable creating some forms.

Based on the wireframe above, recreate all the HTML elements! As we're learning HTML as the skeleton of our web page, don't worry about how your registration form looks for now since you haven't yet learned how to use CSS -- to make the form look nice.

Your HTML should contain the following tags:

  • <input> with these values in the "type" attribute:
    • text
    • password
    • date
    • radio
    • submit
  • <textarea>
  • <select>

You'll get to use forms in one way or another in almost every assignment for the rest of the Bootcamp! So don't feel the need to memorize all of the different form tags and attributes today. You can always come back to this chapter for reference! In the next assignment, we'll use forms again using only HTML tags.

NOTE: Remember to validate your code before submitting it. HTML validation services such as the free W3C Markup Validation Service or here are useful debuggers that help you identify rendering errors.


Again, kindly attach your file here and comment on the estimated time duration you finished this. You will do an estimation for each assignment you will go through in the whole training. This is an important practice to be aware of time because, in a real job, you are expected by the seniors to know how to estimate tasks. It's also a reflection on what made you struggle, if ever. You will get better, good luck!

Note: You can compress the files into a zip file.

Please submit your assignment before moving to the next lesson. chevron_left Prev Nextchevron_right