ReactAdvanced#state#data

What is the difference between server state and client state?

Server state lives elsewhere, can go stale and needs caching, retries and invalidation. Client state is owned by the UI (open menus, form drafts) and is synchronous. Mixing them in one store causes most data bugs.

Example
// server state -> TanStack Query
useQuery({ queryKey: ['todos'], queryFn: fetchTodos });
// client state -> useState
const [drawerOpen, setDrawerOpen] = useState(false);

Related Questions

1
ReactIntermediate#state

Why should you not mutate state directly?

Open
2
ReactIntermediate#routing

How do you handle routing in React?

Open
3
ReactBeginner#props

What are default props and prop validation today?

Open