React State & Events

What you'll learn

• How useState turns a value into something React watches
• Why state updates feel delayed and when to use the callback form
• Why a snapshot mental model fixes most state confusion
• How synthetic events work and when to call preventDefault
• How to wire up controlled inputs of every shape
• How to update objects and arrays without mutating them
• When to lift state up and what it actually costs
• When you can compute during render instead of storing state

1. 01
   useState in one lesson

   Declaring state, the setter, and the rules every hook quietly relies on.
   15 min
2. 02
   Updates are scheduled

   Why state changes feel delayed, and the callback form that fixes the edge cases.
   15 min
3. 03
   State is a snapshot

   Why your render sees an older value than the one you just set.
   14 min
4. 04
   Event handlers

   onClick, onChange, the synthetic event, and the right time to call preventDefault.
   14 min
5. 05
   Controlled inputs

   Text, checkbox, radio, select — and the controlled-versus-uncontrolled split in plain English.
   15 min
6. 06
   Updating objects and arrays

   Why mutation breaks React, and the spread, map, and filter patterns that replace it.
   15 min
7. 07
   Lifting state up

   When two siblings need the same data, and the cost of moving it upward.
   16 min
8. 08
   Derived state vs state

   The you-didn't-need-state pattern. Compute during render instead of syncing later.
   16 min