How does React handle forms, and what are controlled inputs?

React treats form elements as controlled inputs that sync with component state.

⚙️ Example

function LoginForm() {
  const [email, setEmail] = useState('');

  const handleSubmit = (e) => {
    e.preventDefault();
    alert(`Email: ${email}`);
  };

  return (
    <form onSubmit={handleSubmit}>
      <input value={email} onChange={(e) => setEmail(e.target.value)} />
      <button type='submit'>Submit</button>
    </form>
  );
}

✅ Keeps your UI and data in sync.