MUI Forms and Validation

Controlled vs Uncontrolled Patterns

Controlled (recommended for most cases)

State lives in React. Every keystroke triggers a re-render; use for small-to-medium forms.

function ControlledForm() {
  const [name, setName] = React.useState('');
  const [email, setEmail] = React.useState('');
  const [error, setError] = React.useState<string | null>(null);