fe-zustand

Plan Zustand v5 stores with typed slices and combined stores.

Updated Apr 27, 2026
One-click install
npx skills add https://github.com/Conradmaker/copilot-cockpit --skill fe-zustand
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: fe-zustand
Source: https://github.com/Conradmaker/copilot-cockpit/tree/main/.github/skills/fe-zustand
Command: npx skills add https://github.com/Conradmaker/copilot-cockpit --skill fe-zustand

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Zustand patterns help React apps manage client-side state with performance-conscious patterns, reducing unnecessary re-renders and enabling scalable architecture for slices and vanilla stores.

Core Features & Use Cases

  • Prefer small, typed slices that compose into a combined store
  • Use per-slice middleware at the combined store level, with stable selector outputs
  • Guide for Next.js SSR hydration and server/client boundaries in Zustand

Quick Start

Implement a scalable Zustand store using typed slices, a combined store, and selector-based reads.

Frequently Asked Questions about fe-zustand

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I structure a Zustand store with typed slices in React?▼

Structure a Zustand store by defining small, typed slices that compose into a combined store, applying per-slice middleware at the combined store level to ensure scalable client-state management with stable selector outputs.

How does Zustand handle Next.js SSR hydration and server/client boundaries?▼

Zustand handles Next.js SSR hydration by applying specific patterns for server/client boundaries, ensuring state hydration aligns correctly during server-side rendering without leaking server state into the client store.

What is the best way to avoid broad subscriptions and unnecessary re-renders in Zustand?▼

Avoid broad subscriptions in Zustand by using stable selector outputs to read specific state slices, ensuring components only re-render when the selected client-state data actually changes.

Can I create both hook and vanilla stores using Zustand v5?▼

Yes, you can create both hook and vanilla stores in Zustand v5, applying middleware at the combined store level and utilizing testing and reset patterns to manage client-state architecture effectively.

When should I use a combined store instead of separate Zustand stores?▼

Use a combined store when you need to compose multiple typed slices under per-slice middleware, allowing you to manage complex client-state dependencies while maintaining selector-based reads and scalable architecture.