The Scenario
An insurance company has a massive 20-field quote request form on a single page, and nobody is filling it out. They want you to break it down into a friendly 3-step wizard: 1) Personal Info, 2) Vehicle Details, 3) Review & Submit.
The Brief
Build a React (or vanilla JS) multi-step form. You must manage the state to track which step the user is currently on. Do not allow the user to click "Next" until all required fields on the current step are filled out. Provide a "Back" button to return to previous steps without losing data.
Deliverables
- The component structure managing the steps (e.g., a switch statement or an array of components)
- The state management object holding the unified form data across all steps
- The simple validation logic preventing the user from advancing prematurely
Submission Guidance
Focus on state preservation. If a user goes from Step 2 back to Step 1, their data in Step 1 must still be there.
Submit Your Work
Your submission is graded against the rubric on the right. If you pass, you get a public Badge URL you can share on LinkedIn. There is no draft save, so work offline first and paste your finished response here.