React — Advanced Patterns

For state management (Zustand/Redux), TanStack Query, React Hook Form, React Router, and component testing, see the frontend skill.

When to Activate

• Designing or debugging custom hooks
• Choosing between Context, Zustand, or prop drilling
• Using Suspense, error boundaries, or concurrent features (useTransition, useDeferredValue)
• Building compound components or headless/renderless components
• Working in Next.js App Router (Server Components, Server Actions, streaming)
• TypeScript generics, event types, or forwardRef patterns
• useRef, useImperativeHandle, portals, or advanced DOM integration

Hooks Deep Dive

useReducer — when useState gets complex