5 hands-on exercises and 5 find-the-bug challenges for the Controlled Inputs lesson. Every one is checked automatically in the browser — write the code, run it, and the tests tell you what still fails.
Give the input its value from state.
Show the current text in a paragraph as well.
Reset the input to empty, and report that it is cleared.
Bind a dropdown to state and change it from a button.
Bind a checkbox with checked and show its state.
Without a value prop the input is not controlled.
The paragraph shows a fixed string instead of the state.
Ready to write the code?
The editor, the automatic checks and the worked solutions open up with an account.
Open the workspaceClearing should set an empty string, not the word cleared.
A checkbox is controlled with checked, not value.
The dropdown is pinned to one value.