Services Work Learn About Contact
0/10
Lesson 9 of 10

Forms in React

In React, form inputs are controlled components — React manages their values through state. Use onChange to update state and value to display it. Handle submission with onSubmit.

REACT
function ContactForm() {
  const [name, setName] = useState("");

  function handleSubmit(e) {
    e.preventDefault();
    alert("Hello, " + name);
  }

  return (
    <form onSubmit={handleSubmit}>
      <input
        type="text"
        value={name}
        onChange={e => setName(e.target.value)}
      />
      <button type="submit">Submit</button>
    </form>
  );
}
🧠

Quick Quiz

Answer correctly to unlock the next lesson.

Support the mission

This learning platform is 100% free: no ads, no tracking, no paywalls. If it helped you learn something useful, you can support future lessons or donate to Doctors Without Borders, which provides emergency medical care in crisis zones worldwide.

🎉

You completed React!

You finished all 10 lessons and quizzes. You now know the basics of React.