New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Official agent skill

Zustand Store TS

by microsoft in microsoft/skills

Create Zustand stores with TypeScript, subscribeWithSelector middleware, and proper state/action separation.

OfficialMITAuto-check passedFrontend & Design

Install Zustand Store TS

skills CLI
$ npx skills add microsoft/skills --skill zustand-store-ts -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install microsoft/skills zustand-store-ts --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/microsoft/skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.github/plugins/azure-sdk-typescript/skills/zustand-store-ts .claude/skills/zustand-store-ts && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
zustand-store-ts
GitHub stars
3.1k
Used in
7 other repos
Token cost
~440 tokens
SKILL.md length
64 words
Files
2 (incl. assets)
Skills in repo
150
Repo updated
First seen
Licence
MIT

At a glance

Create Zustand stores with TypeScript, subscribeWithSelector middleware, and proper state/action separation.

  • Works in 3 steps: Create store in src/frontend/src/store/ → Export from… → Add tests in…
  • Building React state management
  • SKILL.md covers Quick Start, Always Use subscribeWithSelector, Separate State and Actions and Use Individual Selectors, plus 2 more sections
  • Runs TypeScript scripts from its folder

What it does

Zustand Store TS is an agent skill from microsoft/skills, published by the product's own GitHub organization. Create Zustand stores with TypeScript, subscribeWithSelector middleware, and proper state/action separation. Use when building React state management, creating global stores, or implementing reactive state patterns with Zustand.

Its SKILL.md is about 440 tokens, which your agent loads only when the skill is triggered. The skill folder holds 2 other files, including assets (for example `assets/template.ts`).

It sits in Frontend & Design, covering State management. It works with Zustand and TypeScript. The repository describes itself as: Skills, MCP servers, Custom Agents, Agents.md for SDKs to ground Coding Agents. The licence is MIT.

When your agent uses it

  • Building React state management
  • Creating global stores
  • Implementing reactive state patterns with Zustand

Example prompts

  • “/zustand-store-ts”

Requirements

  • Node.js

Workflow steps

3 steps, taken from the first numbered list in SKILL.md.

  1. Create store in src/frontend/src/store/
  2. Export from src/frontend/src/store/index.ts
  3. Add tests in src/frontend/src/store/*.test.ts

What it can do on your machine

Read from SKILL.md and the folder at commit 354361d. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Ships script files (TypeScript), which the agent can run.

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Zustand Store TS loads about 440 tokens when it runs. Until then it costs about 61 tokens; SKILL.md has 64 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~61
When it runs · the whole SKILL.md, loaded when a task matches
~440

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from microsoft/skills at commit 354361d, republished under its MIT licence (© microsoft). 64 words, ~440 tokens.

Download SKILL.mdSave it as .claude/skills/zustand-store-ts/SKILL.md (or your agent's skills folder). This skill also uses 1 other file; get the full folder from GitHub.
name
zustand-store-ts
description
Create Zustand stores with TypeScript, subscribeWithSelector middleware, and proper state/action separation. Use when building React state management, creating global stores, or implementing reactive state patterns with Zustand.
license
MIT
metadata.author
Microsoft
metadata.version
1.0.0

Zustand Store

Create Zustand stores following established patterns with proper TypeScript types and middleware.

Quick Start

Copy the template from assets/template.ts and replace placeholders:

  • {{StoreName}} → PascalCase store name (e.g., Project)
  • {{description}} → Brief description for JSDoc

Always Use subscribeWithSelector

typescript
import { create } from 'zustand';
import { subscribeWithSelector } from 'zustand/middleware';

export const useMyStore = create<MyStore>()(
  subscribeWithSelector((set, get) => ({
    // state and actions
  }))
);

Separate State and Actions

typescript
export interface MyState {
  items: Item[];
  isLoading: boolean;
}

export interface MyActions {
  addItem: (item: Item) => void;
  loadItems: () => Promise<void>;
}

export type MyStore = MyState & MyActions;

Use Individual Selectors

typescript
// Good - only re-renders when `items` changes
const items = useMyStore((state) => state.items);

// Avoid - re-renders on any state change
const { items, isLoading } = useMyStore();

Subscribe Outside React

typescript
useMyStore.subscribe(
  (state) => state.selectedId,
  (selectedId) => console.log('Selected:', selectedId)
);

Integration Steps

  1. Create store in src/frontend/src/store/
  2. Export from src/frontend/src/store/index.ts
  3. Add tests in src/frontend/src/store/*.test.ts

© microsoft, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 1 other file (assets) in .github/plugins/azure-sdk-typescript/skills/zustand-store-ts of microsoft/skills.

  • SKILL.md
  • assets/template.ts

Open the folder on GitHubat commit 354361d

Used in 7 other repositories

We found 16 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 7 other GitHub owners. This page covers the copy in microsoft/skills, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Zustand Store TS next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Zustand Store TS compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Zustand Store TS this skillmicrosoft/skills3.1k7 repos~440Automated safety check: PassMIT
LobeHub Data Fetching Layerslobehub/lobehub83k—~1.7kAutomated safety check: PassCustom licence
Nextjs15 Initbear2u/my-skills933—~2.4kAutomated safety check: PassNone
React ExpertJeffallan/claude-skills12k—~1.4kAutomated safety check: PassMIT
React Generate Skilljiushiwon/wg-skills112—~2.8kAutomated safety check: PassApache-2.0
Zustandpedronauck/skills634—~1.1kAutomated safety check: PassNone

Similar skills

  • LobeHub Data Fetching Layers

    lobehub/lobehub

    Explains how LobeHub client code fetches data through services, SWR store hooks and cache keys, and when to avoid useEffect fetching or duplicated state.

    83k GitHub stars~1.7k tokensUpdated today
    Frontend & DesignAuto-check passed

  • Nextjs15 Init

    bear2u/my-skills

    A skill your agent uses when user wants to create a new Next.js 15 project (Todo/Blog/Dashboard/E-commerce/Custom domain) with App Router, ShadCN, Zustand, Tanstack Query, and modern Next.js stack

    933 GitHub stars~2.4k tokensUpdated 3 mo ago
    Frontend & DesignAuto-check passed

  • React Expert

    Jeffallan/claude-skills

    Builds React 19 components in TypeScript with Server Components, useActionState forms, custom hooks and state libraries, checked with tsc and React Testing Library.

    12k GitHub stars~1.4k tokensUpdated 5 days ago
    Frontend & DesignAuto-check passed

  • React Generate Skill

    jiushiwon/wg-skills

    This skill should be used when the user wants to create a standardized React 18 + TypeScript + Vite + Zustand project from scratch.

    112 GitHub stars~2.8k tokensUpdated yesterday
    Frontend & DesignAuto-check passed

  • Zustand

    pedronauck/skills

    Expert guide for Zustand state management patterns, store organization, and best practices.

    634 GitHub stars~1.1k tokensUpdated 24 days ago
    Frontend & DesignAuto-check passed

  • Zustand Patterns

    yonatangross/orchestkit

    Reference for Zustand 5.x state management including slices, middleware, Immer, useShallow, persistence, selectors, and devtools integration.

    289 GitHub stars~1.6k tokensUpdated yesterday
    Frontend & DesignAuto-check passed

More from microsoft/skills

All 150 skills in this repo

  • Azure AI Projects Python SDK

    microsoft/skills

    Official

    Reference for building on Microsoft Foundry with the azure-ai-projects Python SDK: project clients, versioned agents, evaluations, connections, datasets and indexes.

    3.1k GitHub starsUsed in 6 repos~2.8k tokens
    Auto-check passed

  • Azure AI Search Python SDK

    microsoft/skills

    Official

    Python guidance for the Azure AI Search SDK covering vector, hybrid and semantic search, index management and indexers, with Entra ID authentication preferred over keys.

    3.1k GitHub starsUsed in 6 repos~4.4k tokens
    Auto-check passed

  • Azure Event Hubs Python SDK Guide

    microsoft/skills

    Official

    Covers producer, consumer, and checkpoint-store setup for Azure Event Hubs streaming in Python, with Entra ID auth and partition targeting.

    3.1k GitHub starsUsed in 1 repo~2.3k tokens
    Auto-check passed

  • Pydantic Models Py

    microsoft/skills

    Official

    Create Pydantic models following the multi-model pattern with Base, Create, Update, Response, and InDB variants.

    3.1k GitHub starsUsed in 6 repos~496 tokens
    Auto-check passed

  • DebugView CLI

    microsoft/skills

    Official

    Captures and filters Windows user-mode and kernel debug output from the command line with the Sysinternals DebugView CLI, including bounded runs suited to agents.

    3.1k GitHub starsUsed in 1 repo~2.7k tokens
    Auto-check passed

  • Frontend UI Dark TS

    microsoft/skills

    Official

    Build dark-themed React applications using Tailwind CSS with custom theming, glassmorphism effects, and Framer Motion animations.

    3.1k GitHub starsUsed in 5 repos~3.6k tokens
    Auto-check passed

Works with

Categories

Questions about Zustand Store TS

What does Zustand Store TS do?

Create Zustand stores with TypeScript, subscribeWithSelector middleware, and proper state/action separation. Zustand Store TS is an agent skill from microsoft/skills, published by the product's own GitHub organization. Create Zustand stores with TypeScript, subscribeWithSelector middleware, and proper state/action separation.

When should I use Zustand Store TS?

Zustand Store TS fits situations like: building React state management; creating global stores; implementing reactive state patterns with Zustand.

How do I install Zustand Store TS in Claude Code?

Run `npx skills add microsoft/skills --skill zustand-store-ts -a claude-code`. Or copy the skill folder (.github/plugins/azure-sdk-typescript/skills/zustand-store-ts in microsoft/skills) into .claude/skills/zustand-store-ts in your project. Claude Code loads it when a task matches its description.

How do I install Zustand Store TS in Codex?

Run `npx skills add microsoft/skills --skill zustand-store-ts -a codex`. Or copy the skill folder (.github/plugins/azure-sdk-typescript/skills/zustand-store-ts in microsoft/skills) into .agents/skills/zustand-store-ts in your project. Codex loads it when a task matches its description.

Can I use Zustand Store TS in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add microsoft/skills --skill zustand-store-ts -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/zustand-store-ts, .gemini/skills/zustand-store-ts, .github/skills/zustand-store-ts and .opencode/skills/zustand-store-ts in your project.

What does Zustand Store TS need to run?

Going by SKILL.md and its folder, Zustand Store TS needs TypeScript for the scripts in its folder. Our summary lists: Node.js.

Does Zustand Store TS access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Zustand Store TS safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Zustand Store TS use?

Zustand Store TS is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Zustand Store TS use?

About 440 tokens (SKILL.md is roughly 1.8k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Zustand Store TS?

Skills that share tags, products or a category with Zustand Store TS: LobeHub Data Fetching Layers (lobehub/lobehub, 83k stars), Nextjs15 Init (bear2u/my-skills, 933 stars), React Expert (Jeffallan/claude-skills, 12k stars) and React Generate Skill (jiushiwon/wg-skills, 112 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Zustand Store TS?

microsoft (a GitHub organization, an official publisher) maintains it in microsoft/skills, which has 3,091 GitHub stars. The repository holds 150 skills in this directory. The repository was last updated on October 6, 2026.

Source: microsoft/skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.