The answer
Because duplication causes sync bugs. Copying props into state, or storing the same data in multiple places, leads to drift when one updates and another does not. Each piece of data should have one owner.
How to Manage State Across Screens in a React UI App
Why keep one source of truth for state in React?
More FAQs in How to Manage State Across Screens in a React UI App
Categorize state into local UI, shared user, and server. Use useState for local, Context for shared state like auth and theme, and React Query for server state. Lift state to a common parent only when siblings genuinely need it.
In Context. Shared state like the logged-in user and theme is read by many distant components but changes rarely, so Context is sufficient and built into React. Do not put this in local state, which causes prop drilling.
As server state with React Query or RTK Query, which handle caching, invalidation, and loading states. Treating fetched data like local state means you lose these features and write more boilerplate.
Still have questions?
Browse all our FAQs or reach out to our support team
Want to upskill yourself?
Your learning library
Small steps. Big possibilities.
Find your next course. Build something great.