State and data flow: identify the state, keep local state local, lift shared state to a common parent, use Context for widely-shared data, handle server state with React Query, pass data between screens appropriately, and keep one source of truth.

Because categorizing tells you which tool suits each. Local UI flags use useState, widely-shared state uses Context, and fetched data uses React Query. Without categorizing, you risk putting everything in one tool and creating re-renders or sync bugs.

To handle server state properly: caching, invalidation, and loading states. Treating fetched data like local state means you write more boilerplate and miss these features. React Query removes most of that work.