https://www.freecodecamp.org/learn/full-stack-developer/lab-survey-form/build-a-survey-form
Build an app that is functionally similar to this example project. Try not to copy the example project, give it your own personal style. Fulfill the user stories below and get all the tests to pass to complete the lab.
-
You should have a page title in an
h1element with anidoftitle. -
You should have a short explanation in a
pelement with anidofdescription. -
You should have a
formelement with anidofsurvey-form. -
Inside the form element you should have a required
inputfield to enter your name that has anidofnameand atypeoftext. -
Inside the form element you should have a required
inputfield to enter your email that has anidofemail. -
If you enter an email that is not formatted correctly, you should see an HTML5 validation error.
-
Inside the form element you should have an
inputfield to enter a number that has anidofnumber. -
The number input should not accept non-numbers, either by preventing you from typing them or by showing an HTML5 validation error (depending on your browser).
-
If you enter numbers outside the range of the number input, which are defined by the
minandmaxattributes, you should see an HTML5 validation error. -
For the name, email, and number input fields, you should have corresponding
labelelements in the form, that describe the purpose of each field with the following ids:name-label,email-label, andnumber-label. -
For the name, email, and number input fields, you should have a placeholder text that gives a description or instructions for each field.
-
Inside the form element, you should have a
selectdropdown element with anidofdropdownand at least two options to choose from. -
Inside the form element, you can select an option from a group of at least two radio buttons that are grouped using the
nameattribute. -
Inside the form element, you can select several fields from a series of checkboxes, each of which must have a
valueattribute. -
Inside the form element, you should have a
textareafor additional comments. -
Inside the form element, you should have a button with
idofsubmitto submit all the inputs.