{"enrichment":{"faq":[{"a":"Zustand-5 teaches you to create lightweight state stores with a simple API. Define a store using `create()`, specify your state and actions, then use the hook in components. Zustand-5 covers basic patterns like managing UI state, form data, and application state without the boilerplate of Redux. The skill emphasizes keeping stores focused and composable using the slices pattern for larger applications.","q":"How do I use Zustand 5 for state management in React?"},{"a":"Zustand-5 explains how the persist middleware automatically saves your store state to localStorage. Wrap your store with the persist middleware, specify a storage key, and your state syncs across browser sessions. Zustand-5 covers configuration options like version control, migrations, and selective field persistence. This is essential for preserving user preferences, cart contents, and other data that should survive page reloads.","q":"What is the Zustand persist middleware and how does it work?"},{"a":"Zustand-5 demonstrates using selectors to subscribe only to specific state slices, avoiding full store updates. Use selector functions to extract only the data your component needs, combined with `useShallow` for shallow equality checks. Zustand-5 shows how proper selector patterns dramatically reduce re-renders in large applications, improving performance without extra complexity.","q":"How can Zustand selectors prevent unnecessary re-renders?"},{"a":"Zustand-5 covers essential patterns: keep stores small and focused, use selectors for granular subscriptions, leverage Immer middleware for immutable updates, integrate DevTools for debugging, and compose stores using the slices pattern. The skill emphasizes avoiding deeply nested state, using TypeScript for type safety, and handling async operations with clear action patterns for fetching data reliably.","q":"What are Zustand 5 best practices for state management?"},{"a":"Zustand-5 teaches async patterns where actions manage loading, error, and data states. Create async functions that update state at each stage\u2014pending, success, failure. The skill covers best practices like cancellation tokens, retry logic, and integrating with libraries like React Query. Examples include fetching user data, paginated lists, and handling race conditions in concurrent requests.","q":"How do I handle async data fetching in a Zustand store?"},{"a":"Zustand-5 explains how `getState()` retrieves current state outside components, and `subscribe()` listens for changes. This enables integration with event handlers, timers, WebSocket listeners, and non-React code. The skill shows practical examples like triggering analytics, syncing with external APIs, and coordinating state across multiple frameworks or contexts.","q":"Can I access and subscribe to Zustand stores outside React components?"}],"shadow_tags":["state-container","react-hooks","client-side-storage","middleware-architecture","immutable-updates","devtools-debugging","typescript-patterns","performance-optimization"],"summary_rewrite":"Zustand-5 provides practical patterns for building React state management with Zustand 5, including basic stores, persistence middleware, selector optimization, and async data handling. Learn the slices pattern for composing complex stores, Immer integration for immutable updates, and DevTools debugging. Includes examples for accessing stores outside components and subscribing to state changes."},"files":[{"bytes":4751,"path":"curated/zustand-5/SKILL.md","sha256":"a69b26a0384977f0342a1cb92fc96f80b3e31094b3b6d08650683ba8ebc087e6","url":"https://skillfed.io/files/Gentleman-Programming/Gentleman-Skills/zustand-5/941561af/SKILL.md"}],"id":"Gentleman-Programming/Gentleman-Skills/zustand-5","links":{"html":"https://skillfed.io/Gentleman-Programming/Gentleman-Skills/zustand-5","md":"https://skillfed.io/Gentleman-Programming/Gentleman-Skills/zustand-5.md","repo":"https://github.com/Gentleman-Programming/Gentleman-Skills"},"meta":{"agents_supported":[],"first_seen":"2026-07-28","forks":88,"language":null,"last_updated":"2026-03-28","license":"MIT","name":"zustand-5","publisher":"Gentleman-Programming","stars":604},"relations":{"similar":[{"id":"prowler-cloud/prowler/zustand-5"},{"id":"emanueleielo/deepagents-open-lovable/state-management"},{"id":"bobmatnyc/claude-mpm-skills/zustand"},{"id":"patricio0312rev/skills/zustand-state-builder"},{"id":"secondsky/claude-skills/zustand-state-management"},{"id":"AsyrafHussin/agent-skills/state-management"},{"id":"jmsktm/claude-settings/state-management"},{"id":"duck4nh/antigravity-kit/state-management-expert"},{"id":"yonatangross/orchestkit/zustand-patterns"},{"id":"oakoss/agent-skills/zustand"}]},"slug":{"owner":"Gentleman-Programming","repo":"Gentleman-Skills","skill":"zustand-5"},"version":"941561af"}