22 / 31

Build a multi-step form with stepper

MediumP2Build

Build a multi-step form in React with a stepper, validation on each step, and a final review step before submission.

Time box: 60 minutes.

Requirements

0 / 6

At least three steps (for example account, address, preferences) followed by a review step; a stepper shows completed, current and upcoming steps
Next is blocked until the current step is valid; errors appear next to the offending fields, with focus moved to the first invalid field
Back keeps all entered data, and moving forward and back never clears a step
A progress indicator shows the step number and percentage, with aria-current="step" on the active step
The review step lists all answers with an Edit link to jump back to the relevant step
Submit shows a loading state, handles a simulated failure, and shows a success screen on completion

0 / 3

Only after every requirement works.

Your files are saved in this browser as you type.

When every requirement works, mark it complete to count it as solved.

How a strong candidate structures it, and what interviewers check.

Your notesSaved automatically