NexusStore is a lightweight state management solution built specifically for React. It keeps stores entirely outside your component tree, wires them into components through a single hook, and lets you update state imperatively — all without the boilerplate of Redux or the performance pitfalls of deeply nested Context providers.Documentation Index
Fetch the complete documentation index at: https://mintlify.com/iDevRanjan/nexus-store/llms.txt
Use this file to discover all available pages before exploring further.
Why NexusStore?
Most React state management tools force a trade-off: either you adopt a large framework with significant boilerplate (Redux, Zustand with middleware), or you lean on React Context and accept re-renders whenever anything in the context tree changes. NexusStore was built to avoid both problems. Under the hood,useStore uses React 18’s useSyncExternalStore hook, which means subscriptions are concurrent-mode safe without any extra configuration. Stores live as plain JavaScript objects outside the React tree, so React never needs to re-render a component unless the specific slice of state it subscribes to has actually changed.
The Three Core Exports
NexusStore ships as three source files that you copy directly into your project. Each file has a single responsibility:-
createStore(NexusStore/core.js) — Creates a store from an initial state object. ReturnsgetState,subscribe,setState, andsetMultiple. Stores are plain objects that live outside any component. -
useStore(NexusStore/useStore.js) — A React hook that subscribes a component to a store. Accepts an optional selector function to subscribe only to a specific slice, preventing unnecessary re-renders when unrelated state changes. -
immer(NexusStore/immer.js) — An optional wrapper around any store that enables Immer-powered mutations. Wrap your store withimmer(createStore(...))and write mutating draft functions instead of spreading nested objects by hand.
Architecture Overview
NexusStore follows a straightforward unidirectional data flow:Key Features
Fine-Grained Subscriptions
Pass a selector to
useStore and the component re-renders only when that specific slice of state changes. Unrelated updates to the same store are ignored.Immer Integration
Wrap any store with
immer() to enable draft-style mutations on nested objects and arrays — no manual spreading required.Batch Updates with setMultiple
Update several keys in one store at once with
setMultiple. All subscribers are notified in a single update cycle, avoiding multiple re-renders.Custom Hooks Pattern
Encapsulate each store behind its own custom hook (e.g.,
useThemeStore, useAuthStore) so components never import store references directly.Next Steps
Quickstart
Build a working counter in five minutes. See
createStore, useStore, and setState in action with real code.Installation
Copy the three source files into your project and optionally install Immer for nested state updates.