Week-05 ideas

[royemosby]

Objective 1: Local State and Controlled Components

• Describe the advantages of isolating working values from application state
• Use useState to implement local state
• Explain controlled components and their importance in managing state

Objective 2: Forms

• Recognize the form's role in collecting and validating user input
• Explain the management of form data in React
• Use a controlled form to handle form events, validate user input, and commit user input back to the application
• Managing inputs on larger forms

---

Share below...

[royemosby]

Idea

Student refactors an uncontrolled form into a controlled form and introduce basic field validation

We could re-use the snap rating app for the scenario from week 2.

Starting condition

• Parent component maintains state and contains instances of form and list components
• Form component contains uncontrolled form that passes submissions back to parent
• Each item in the list should be editable or deletable

Tasks

• Have the students refactor it into a controlled form.
• Introduce validation:
  • each item's name must be alphanumeric
  • each item's rating value has to be unique integer