← React.js learning pathReact.js · Module 4 of 10
State with useState
State is data a component owns; changing it re-renders the component.
📖 Key ideas
- const [count, setCount] = useState(0); creates state.
- Calling setCount(newValue) updates state and re-renders.
- Never change state directly (count++ does not re-render).
- Use the updater form when based on old value: setCount(c => c + 1).
- Copy objects and arrays when updating: setUser({ ...user, age: 21 }).
💡 Real-life example: State is a scoreboard: when the score changes, the board updates for everyone to see.
useStateHook that adds state
SetterFunction that updates state
Re-renderReact redraws the component
Updater functionsetX(prev => ...)