nextjs with zustand
Answered
JJSenpai posted this in #help-forum
JJSenpaiOP
If anyone has experience with this, please let me know when you use zustand with context provider and when not to.
Answered by Donskoy
ah, ok, you want to isolate stores between users, that's another pair of boots. In that case, on every [name] change, you need to rehydrate it, see the docs: https://docs.pmnd.rs/zustand/integrations/persisting-store-data#rehydrate
6 Replies
American black bear
### When to Use Zustand Without a Context Provider
- Simplicity: Suitable for straightforward applications or components with simple state management needs.
- Direct Access: Allows direct interaction with the store using hooks, making it easy to manage state without extra layers.
- Decoupled State: Ideal for parts of an application needing independent state management.
### When to Use Zustand With a Context Provider
- Scoped State: Useful for creating isolated state instances for specific parts of your component tree.
- Dependency Injection: Enables injecting dependencies or initial state into the store.
- Controlled Access: Provides clearer APIs and more control over state access and modifications.
- Complex Applications: Helps structure state management effectively in larger, more complex applications.
- Simplicity: Suitable for straightforward applications or components with simple state management needs.
- Direct Access: Allows direct interaction with the store using hooks, making it easy to manage state without extra layers.
- Decoupled State: Ideal for parts of an application needing independent state management.
### When to Use Zustand With a Context Provider
- Scoped State: Useful for creating isolated state instances for specific parts of your component tree.
- Dependency Injection: Enables injecting dependencies or initial state into the store.
- Controlled Access: Provides clearer APIs and more control over state access and modifications.
- Complex Applications: Helps structure state management effectively in larger, more complex applications.
Donskoy
In NextJS, you should always use global state with a context provider. Check this out to learn how: https://www.pronextjs.dev/tutorials/state-management
JJSenpaiOP
I have created a store using provider. I want it to reset on dynamic route change.
Eg /[name]/page
I want store to reset when name changes, how do I do this?
Eg /[name]/page
I want store to reset when name changes, how do I do this?
@Donskoy @American black bear
Donskoy
ah, ok, you want to isolate stores between users, that's another pair of boots. In that case, on every [name] change, you need to rehydrate it, see the docs: https://docs.pmnd.rs/zustand/integrations/persisting-store-data#rehydrate
Answer
JJSenpaiOP
Thanks for your help, much appreciated guys