React State Pattern
Welcome to a guide on React state patterns. How data flows, where state lives, and how components talk to each other — from useState to XState, Redux to Signals.
What you’ll learn
Section titled “What you’ll learn”Foundations
Section titled “Foundations”What is state, how React turns changes into DOM updates, and the classic JS patterns that power state tools.
Every Pattern
Section titled “Every Pattern”Unidirectional, bidirectional, atomic, signals, event-driven, FSM — and how to choose.
Interactive Visualizers
Section titled “Interactive Visualizers”See data flow in action with diagrams you can click and explore.
Trade-offs
Section titled “Trade-offs”When to use a pattern, when to skip it, and how to combine them in real apps.
References
Section titled “References”- React docs: Managing State by React Team — official guide on state in React
- React docs: Thinking in React by React Team — process for building UIs with React
- Robin Wieruch: React State Management 2025 by Robin Wieruch — practical state management guide