Skip to content

Latest commit

 

History

History
32 lines (16 loc) · 1.87 KB

9-now-with-validated-forms.md

File metadata and controls

32 lines (16 loc) · 1.87 KB

MEC TTP 2021 Winter Assignment 9: Now with Validated Forms!

Purpose

Primarily to practice using Material UI Input elements to create form skeletons in React, within the framing of a mock informational website.

Secondarily to practice implementing form validation in React.

Task and requirements

Create a copy your previous assignment (8 Now with Pages!) as a separate repo. Create at least 2 forms with at least 3 input components each. This can take the shape of a contact form, a newsletter sign up form, a sign up form, etc.

Try to use other input components in addition to <TextField /> such as <Checkbox />, <Date / Time />, and <Slider />. You can also try using different props of <TextField />, such as select, multiline, password, and required to generate variety.

Creating forms that meet this requirement will earn you a grade of 2. To receive a 3 or 4 grade, you must implement form validation checks. This can include a minimum length, maximum length, character check, etc.

Reference Materials

W3 Schools has a quick tutorial on form validation in React. They do not use Material UI but the general idea is the same. You can use this as a general guideline, then extend it to use Material UI components.

https://www.w3schools.com/react/react_forms.asp

Additionally, you have access to the form-validation sample React app in this repo.

https://github.com/jonathan-chin/mec-ttp-2021-winter/tree/master/examples/form-validation

Submission

Submit a single github link before 11:59pm EST on Jan 15, 2021 using the following form. Only one student on your team needs to submit and be sure to tag all the team members when submitting.

https://airtable.com/shrdhk3TgUWZ6pFO5