state-management
Installation
Summary
State management patterns for React applications with Context, Redux, Zustand, and React Query.
- Choose Context API for simple global state, Zustand for medium complexity, Redux Toolkit for large-scale apps with complex logic, and React Query for server data fetching and caching
- Covers local vs. global state decisions, immutability constraints, and the minimal state principle to avoid redundant derived values
- Includes complete working examples for authentication contexts, shopping carts, todo management, and async data fetching with proper TypeScript typing
- Emphasizes selective subscriptions, single source of truth, and avoiding props drilling across 5+ component levels
SKILL.md
State Management
When to use this skill
- Global State Required: Multiple components share the same data
- Props Drilling Problem: Passing props through 5+ levels
- Complex State Logic: Authentication, shopping cart, themes, etc.
- State Synchronization: Sync server data with client state
Instructions
Step 1: Determine State Scope
Distinguish between local and global state.