What is the difference between state and props?
Both hold data that drives what a component renders, but they differ in ownership and mutability.
props — read-only data passed from a parent component. The parent owns and updates them; the child only reads. Used to configure and customize children.
state — private, mutable data managed inside the component (via
useStateorthis.state). Changes to state trigger a re-render. Used for data the component itself controls.
Lift state up — if multiple components need the same state, hoist it to the closest common parent and pass it down via props.
Treat both as immutable — never mutate
props; never mutate state directly — always call the setter.Re-renders — both prop changes (from parent) and state changes trigger re-renders.
Controlled vs uncontrolled — form inputs whose value lives in state are “controlled”; uncontrolled inputs hold their own DOM state.
Key distinction: props are external inputs (read-only), state is internal data (mutable). Mention that data can be state in a parent and props in a child.
The 'lifting state up' pattern shows practical understanding.