NextJS + State Management = Good Idea???

We can do data fetching in NextJS during static site generation or during server side rendering, so do we need a state manager? If so, how would that even work? Let's check it out and see for ourselves whether a state manager is worth the bytes we give it.

👉 VS Code theme and font? Night Wolf [black] and Operator Mono
👉 Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF

0:00 Introduction
1:47 Project Setup
3:04 NextJS State Challenges
3:52 #1 React State
8:12 #2 React Context
16:07 #3 React Query
19:20 #4 Better React Query
21:44 #5 Redux
26:22 #6 Zustand
30:24 #7 Mobx
32:58 #8 Jotai
36:59 #9 RxJS
39:14 My Recommendations
40:39 Outroduction

#nextjs

[demiann]

A 10/10 for the quality and creativity in making something unique and so valuable for all of us

[thegrumpydeveloper]

React hook form is my go to state management no joke. Form fields are the most complex state and have so many hidden states like validity, submitting, submitted etc. It’s important to choose a form library if you’re taking any user input beyond button clicks.

[mooshy]

Was hoping you would go into a flow such as “action” => “state update” => “getServerSideProps” => “Client Hydration & render”. I think what makes nextjs more convoluted when it comes to state management is that you can also treat query parameters as state, which in return continues the SSR even when a person for example goes to “/pokemon?page=2”

[garrettdarnell]

I'm finally getting into React after being an Angular dev for years, this was really helpful. Loved seeing the RxJS content in there, it helps me connect my old mental model of reactivity with the new.

[kodoku]

I've always liked this state library called "easy-peasy" which is a very simplified version of redux and uses it under the hood, so you can use most redux features with it. Even redux devtools and it's compatible with React Native

[JasonChannelOne]

Such a helpful video! Thank you 🙏

Do you have any thoughts on ORMs and databases?

A video like this for both would be great!

[ryanle]

Thank to you, I know about Zustand. Such an amazing library. Now state management is very simple and I can even access the store outside a component. SO COOL.

[tuananhdo]

[Copy] Thank to you, I know about Zustand. Such an amazing library. Now state management is very simple and I can even access the store outside a component. SO COOL.

[krisnarusdiono]

sir you are my mentor now, thank you for your videos!

[ThEldeRS]

I would've watched this video even if it was hours long, it was so instructive and well made! Thank you for your hard work producing these wonderful videos, Jack!

[trenthm]

Fantastic. We don’t deserve videos this comprehensive and well done! Learned a ton

[leumasrodama]

It takes a lot of work to have a tuts like this.,
Keep up the good work. Just subscribed., :)

[البراءبنمالك-رم]

Your recommendation at the very end is great. Made my realize so much. Thank you for the thorough video.

[alexsuarez]

As usual Jack! Excellent video! Keep rocking

[tuRistst]

Thx for videos. Don't lost a motivation to create content. We love your lessons and respect your work!
Ps: special thanks for the work with nextjs

[badasspresso]

God bless people like you!
So much effort, so many examples, so accurate… Thank you!!!

[shahrzadgheidi]

Perfect.. Thank you so much. this was such an amazing wrap up.

[jasonma]

This video explained so well. Nice work and efforts! love it.

[bartgrundeken]

Great video. I like your style, very enthusiastic, balanced view, great! I use Zustand in a CRA project right now, works great. Btw...looking forward to more Remix stuff, if you have it in the pipeline ;)

[joshuastories]

Free content. Free like. Thank you for invaluable content.
(Within scope of content) thank you for promoting internet health and developer prosperity. That’s priceless in my opinion.