state management
Unanswered
Hermit Warbler posted this in #help-forum
Hermit WarblerOP
what's the best solution to use when it comes to state management in next.js projects?
4 Replies
Korean bullhead
It really depends on your application requirements. I often find it useful to start with component state,
With the app router there is also the option to use url parameters to store state:
https://www.reddit.com/r/nextjs/comments/16wnh2y/how_to_use_url_state_with_the_app_router_zero/
If you are making client side api requests, SWR and Tanstack Query are great options for providing simple hooks that help you manage fetching and loading states efficiently. https://swr.vercel.app/ https://tanstack.com/query/v4/docs/framework/react/guides/queries
I hope that will give you so options to try
useState calls and Context (https://react.dev/learn/passing-data-deeply-with-context)With the app router there is also the option to use url parameters to store state:
https://www.reddit.com/r/nextjs/comments/16wnh2y/how_to_use_url_state_with_the_app_router_zero/
If you are making client side api requests, SWR and Tanstack Query are great options for providing simple hooks that help you manage fetching and loading states efficiently. https://swr.vercel.app/ https://tanstack.com/query/v4/docs/framework/react/guides/queries
I hope that will give you so options to try
@Korean bullhead It really depends on your application requirements. I often find it useful to start with component state, `useState` calls and Context (https://react.dev/learn/passing-data-deeply-with-context)
With the app router there is also the option to use url parameters to store state:
https://www.reddit.com/r/nextjs/comments/16wnh2y/how_to_use_url_state_with_the_app_router_zero/
If you are making client side api requests, SWR and Tanstack Query are great options for providing simple hooks that help you manage fetching and loading states efficiently. https://swr.vercel.app/ https://tanstack.com/query/v4/docs/framework/react/guides/queries
I hope that will give you so options to try
Hermit WarblerOP
i really appreciate your help, our project is quite big and complex, including auth and many users, i also want to benefit from the RSCs and its performance, i was thinking about using Zustand, i've heard a lot about it, what do you of using it if you heard about it?
Korean bullhead
I haven't used it myself but I'm aware of it, there are so many great solutions out there. My advice would be to start small and try to plan out how state would be used within the application. Then find something that fits your requirements. I think when starting a new project, there's a temptation to add state management library and apply everything to it, which can end up making your codebase slow and complicated.
Have a look at some patterns in the react and next.js examples repos online and the links in my previous message, hopefully you'll find something that suits your needs.
Have a look at some patterns in the react and next.js examples repos online and the links in my previous message, hopefully you'll find something that suits your needs.
Rule of thumb for state management:
Use regular react state, then use url state, then think long and hard if you need a state management library or if it’s actually your code that could be simplified or refactored to be cleaner, then use a state management system. I like zustand personally but I’ve only used it once on an incredibly complex project where regular state management wasn’t cutting it.
Use regular react state, then use url state, then think long and hard if you need a state management library or if it’s actually your code that could be simplified or refactored to be cleaner, then use a state management system. I like zustand personally but I’ve only used it once on an incredibly complex project where regular state management wasn’t cutting it.