Lesson 24 — Form validation

Validate before submit

Good forms check input while the user types: show an error as soon as the value is wrong, and keep the submit button disabled until it is right. The check is a derived value — computed from state on every render, not stored separately.

const strong = pw.length >= 8 && /\d/.test(pw);
<button disabled={!strong}>Save</button>

Note: Next.js pages are React components, so this preview runs your code with plain React in the browser. Next.js-only features (the file router, server rendering, data fetching on the server) are not running here — where a lesson needs them, it shows a small simulation instead.

Why it matters: instant feedback stops bad data and saves users from a confusing failed submit.