Skip to main content
skill CX Codex

zustand · pedronauck — Claude Code skill: Zustand store patterns

A skill that feeds your coding agent Zustand patterns: domain stores, selector hooks, middleware and persistence.

Install into Claude Code · Skills CLI (Vercel) All methods and platforms ↓
npx skills add pedronauck/skills --skill zustand -a claude-code
Open on GitHub

What zustand does

The skill hands the agent a set of rules for Zustand in your project. Stores stay domain-specific, large ones get split into slices, and selector hooks are exported for each state slice instead of subscribing to the whole store. A template shows the state interface with actions grouped in an actions object.

For production stores it recommends stacking middleware in one order: devtools, then persist, then immer. Persistence is narrowed with partialize so only the fields you pick end up in storage. The skill also draws a line between client state and server state, pointing the latter at TanStack Query.

The agent can only Read, Grep and Glob — it inspects your code and suggests changes, but never edits files itself. So don't expect it to rewrite your stores on its own. Deeper examples and anti-patterns live in references/patterns.md, and the checklist ends with pnpm run typecheck and pnpm run test.

What it helps with

  • split shared client state into domain-specific stores
  • wire devtools, persist and immer in the right order
  • replace whole-store subscriptions with selector hooks
  • persist only selected fields via partialize
  • update nested state immer-style without mutating it

Example prompts for the agent

  • Create a new cart store following the zustand skill patterns
  • Check my stores against the zustand skill rules
  • Help me add selector hooks to the auth store

How to install zustand

1Skills CLI (Vercel)

npx skills add pedronauck/skills --skill zustand -a claude-code

2Manually: put the files in place

~/.claude/skills/zustand/SKILL.md

Copy the whole skill folder; for one project use .claude/skills/zustand/

Step by step, with commands for each platform: How to install skills in Claude Code: five ways

Questions about zustand

How do I install the zustand skill in Claude?

Run npx skills add pedronauck/skills --skill zustand -a claude-code. The skill file lands at ~/.claude/skills/zustand/SKILL.md.

What does the zustand skill do?

It gives the agent Zustand guidelines: store organization, middleware, selector hooks and nested state updates. The agent applies them whenever you build client state with Zustand.

Which tools can the zustand skill use?

Only Read, Grep and Glob. It reads and searches your code but does not edit files.

Similar skills

Everything for Frontend and UI →

zustand by other authors comes first.

zustand vercel-labs This skill integrates Zustand into json-render to sync application state. Use it when your project already relies on Zustand and you need to connect it with components rendered by json-render. CX Codex +1 1,900installs zustand pproenca A skill with 43 rules for Zustand in React: store architecture, selectors, re-render fixes. Useful when you write or refactor a store. CX Codex +1 446installs zustand bobmatnyc A skill that teaches your agent zustand: a small hook-based state manager for React with no providers. Handy when you need global state but not Redux. CX Codex +1 485installs zustand-patterns OrchestKit A reference for Zustand 5.x state management: slices, middleware, Immer, useShallow, persistence and devtools. Useful when you want to drop Redux without the boilerplate. CX Codex +1 1,400installs zustand-state-management Mindrally Enforces Zustand store best practices in React and TypeScript apps, covering store slices, SSR, and testing. It helps eliminate selector re-renders and hydration bugs. CX Codex +1 959installs zustand-5 prowler-cloud Zustand 5 state management patterns for Claude Code: basic stores, selectors, persist middleware, and slice composition. Prevents unnecessary re-renders and keeps state logic clean. CX Codex +1 911installs zustand-store-ts Microsoft A skill that sets the pattern for Zustand stores in TypeScript: separate state and action types, subscribeWithSelector, individual selectors. 3installs state-management agent-skills A skill that hands your agent ready patterns for TanStack Query v5 and Zustand v5: fetching, caching, mutations, optimistic updates and client stores. CX Codex +1 783installs frontend-state-management aj-geddes A skill that guides your agent through frontend state management: Redux, MobX, Zustand or the Context API. CX Codex +1 480installs

From the same set6

Project sponsors

Companies that keep this analytics open
Gold sponsor

Impressions, clicks and code copies — open statistics. We keep the numbers public for the same reason NeBlask itself is public. Become a sponsor