Redux dominated React state management for years. But the landscape has shifted dramatically. Server Components handle data fetching differently. React Query elegantly manages server state. Zustand offers Redux patterns with minimal boilerplate.
Server State vs Client State
The key insight: server state and client state are fundamentally different problems. Server state needs caching and revalidation. Client state is authoritative by definition. Using Redux for both conflates these problems.
Zustand: The Minimal Alternative
import { create } from 'zustand';
const useCart = create((set) => ({
items: [],
addItem: (item) => set((s) => ({ items: [...s.items, item] })),
clearCart: () => set({ items: [] })
}));No providers, minimal boilerplate, TypeScript inference just works, ~1KB bundle.
React Query: Server State Solved
const { data, isLoading } = useQuery({
queryKey: ['user', userId],
queryFn: () => fetchUser(userId),
staleTime: 5 * 60 * 1000
});Handles caching, deduplication, background refetching, optimistic updates, and error handling.
When Redux Still Makes Sense
Complex client state with interdependencies, time-travel debugging, large teams with established patterns, offline-first applications.
Decision Framework
Server state? → React Query. Local component state? → useState. Shared across distant components? → Zustand or Redux. URL state? → URL params. Form state? → React Hook Form.
Modern Stack
// Server state: React Query
const { data } = useQuery({ queryKey: ['users'], queryFn: fetchUsers });
// Global client state: Zustand
const theme = useStore((s) => s.theme);
// Local state: useState
const [isOpen, setIsOpen] = useState(false);The best state management is the least state management. Use specialized tools for specialized problems, and add complexity only when proven necessary.