zustand-5

What problem does it solve?

This Skill consolidates Zustand 5 state management patterns for React applications, enabling scalable and predictable state with minimal boilerplate.

Core Features & Use Cases

• Basic Store: Create strongly typed stores for simple state with predictable updates.
• Persist Middleware: Persist store state across sessions.
• Selectors (Zustand 5): Select specific fields to minimize re-renders.
• Async Actions: Manage asynchronous data flows within stores.
• Slices Pattern: Compose multiple small slices into a single store.
• Immer Middleware: Mutate state immutably with Immer integration.
• DevTools: Use browser DevTools for time-travel debugging of stores.
• Outside React: Access and subscribe to stores outside React components.

Quick Start

Install Zustand in your project and begin integrating the store patterns described here; then create a sample page that uses useCounterStore and useSettingsStore for illustration.