Zustand is a deliberately minimalist state manager for React that does without awkward ceremony and deeply nested providers. You create a store as a plain function and read from it with a hook, and that is essentially it. It stays small and easy to follow, even as an application's state grows. We use it for local UI state that several components need to share, without bringing in a heavy solution just for that.
More in the documentationWhen a piece of UI state needs to be shared across several components, like an open panel or a filter, we reach for Zustand. It is quick to set up and stays readable, without wrapping the app in providers. For server data we deliberately use TanStack Query, leaving Zustand to local state.
import { create } from "zustand";
export const useStore = create((set) => ({
count: 0,
increment: () => set((s) => ({ count: s.count + 1 })),
}));Good to know
In the hook always select only the individual fields a component needs, rather than the whole store. Otherwise the component re-renders on every change, even for fields it never uses.
More tools we work with in the same area.
React
Our preferred UI framework for interactive, component-based interfaces.
Next.js
The React meta-framework for SSR, routing and top-tier performance.
Angular
A structured framework for large, long-lived enterprise applications.
Vue
A lean, approachable framework for fast, reactive UIs.
Svelte & SvelteKit
A compiled framework for especially lean, fast interfaces.
Astro
Content-focused sites with minimal JavaScript and top performance.
You don't have to decide that, it's our job. Tell us about your plans.