zustand-state-management

SKILL.md

Last Updated: 2026-01-21 Latest Version: zustand@5.0.10 (released 2026-01-12) Dependencies: React 18-19, TypeScript 5+

✅ Use create ()() (double parentheses) in TypeScript for middleware compatibility ✅ Define separate interfaces for state and actions ✅ Use selector functions to extract specific state slices ✅ Use set with updater functions for derived state: set((state) => ({ count: state.count + 1 })) ✅ Use unique names for persist middleware storage keys

✅ Handle Next.js hydration with hasHydrated flag pattern ✅ Use useShallow hook for selecting multiple values ✅ Keep actions pure (no side effects except state updates)

Zustand를 사용하여 React에서 유형이 안전한 전역 상태를 구축하세요. TypeScript, 지속 미들웨어, devtools, 슬라이스 패턴 및 하이드레이션 처리 기능이 있는 Next.js SSR을 지원합니다. 6가지 문서화된 오류를 방지합니다. React 상태를 설정하거나 Redux/Context에서 마이그레이션하거나 하이드레이션 오류, TypeScript 추론, 무한 렌더링 루프 또는 지속적인 경쟁 조건 문제를 해결할 때 사용합니다. 출처: jezweb/claude-skills.

원본 보기