Props & state
Try code in the playgroundUnderstand the concept
Props are values a parent supplies to a component, while state is data React remembers for a component across renders. Both influence the UI, but a component should not change its received props directly. State updates request a new render so the screen can reflect the new data.
Important ideas
-
Props are inputs from a parent; treat them as read-only.
-
State is component data that can change over time.
-
Lift shared state to the nearest common parent when needed.
-
Use one clear owner for shared data; copying the same prop into local state without a synchronization rule often creates stale values.
Can you explain it without the notes?
Props vs state: what is the difference?
Use your own words. Explain an example and one limitation before checking the explanation.
Check your explanation
Props are values a parent supplies to a component, while state is data React remembers for a component across renders. Both influence the UI, but a component should not change its received props directly. State updates request a new render so the screen can reflect the new data.
Turn this concept into a clear answer.
- Explain who owns the data and who is allowed to request a change, rather than only saying props are external and state is internal.
Keep connecting the ideas.
Next lesson: What causes a re-render? Does it always change the DOM?Adapted from 06_REACT_NEXTJS.md · “Props vs state: what is the difference?”. Examples are study fragments; framework behavior can depend on your version.