My team and I just got a new project, and our team lead wanted us to make POC for different state management libraries. This video was extremely timely!
Thanks Lee for always having high quality videos with all the dense info in a very short time. I know it's not easy to edit a video like that and you probably need to repeat shooting parts multiple times. No "umm..." or "okay, let's wait for that to install"
Thank you for creating this video. It really helped me to understand react and state. I didn't know about the types of states in an app. For the past couple of weeks, i have been working on a project which requires fetching a lot of data in my next app. basically I wanted to create a dashboard. I wanted to reduce unnecessary API calls. Today I got to know about SWR. I knew about react query but never knew what it does. This video literally summed up everything. I am watching your videos for the past couple of days they are really helpful
Every project don't need heavy libraries like Redux/Recoil. Sometimes you just needs to create and consume global states. "react-rhino" is a library which does exactly the same with simple and straight forward syntax. It uses Context API under the hood, but is very very simple than useContext.
use react query to manage your server state. redux and other libraries are not ideal to manage server state lifecycles. react query handles caching, fetching, and updates asynchronous data. if you remove all the server state from redux or other libraries to react query, your global state becomes very thin.
would you only use a caching library like SWR if you don't expect the API results to change in the short term? for example, if you're fetching stock quotes, i would imagine you don't want to used the cached result from 2 minutes ago.
Such a great content but would like to see you create in depth videos for differnet state management lib or even intro to the upcoming useSelectedContext!
For small projects Redux is not needed, but as a project grows it may become necessary. The Context API is great for side and small projects, but may not be enough. I use Redux mainly, but I'm starting to use react-query for my fun/side projects. Appreciate your input Lee. See you soon!
Hi, I am using pullstate which is very very easy while comparing all other global state management for react of redux, recoil, jotai etc. Is it good to use pullstate? Since I am a beginner i am finding difficult to choose the global state management.
Didn't see it ... yet ;) Understand that you talk about the most popular one. It just seems to me that R-H-F is much easier to use and less boilerplate than formik. Anyway thanks for your answer and for the great content
Redux adds a lot of unnecessary complexity and setup. Even in large projects, most of the time you don't need redux. Also, many times a lot of state don't need to be at the global scope and with redux people tend to put everything as global state. Unless redux middlewares like sagas are needed and are properly used, redux is unnecessary.
I'll write this while i'm still watching the video, so i'll comeback later if the answer is in the video How SWR data that was fetched from an API is available to all my components as a global state? or it is that it doesn't make a fetch to an specific route if it was called previously by another component 🤔
SWR provides the caching layer for you. So if you make a request to /api/user, you can use the useSWR() hook in 100 places across your codebase calling that same endpoint, and they're all looking to the same place in the cache!
I think the central store is a big advantage, I have been trying context and use useReducer which is fine for small projects but doesnt feel right as things start to grow.
Jumping straight to XState makes one David somewhere in the world smiling
My team and I just got a new project, and our team lead wanted us to make POC for different state management libraries. This video was extremely timely!
Sent this video to a dozen devs. Great great explanation that I will be referencing for a long time.
now that is called awesome! thanks for the great tutorial and a taste of history.
Using zustand and immer with typescript. Never enjoyed doing state management so much before.
Hey this video is really useful for our community, thanks!
Thank you! Glad you found it useful.
Thanks Lee for always having high quality videos with all the dense info in a very short time. I know it's not easy to edit a video like that and you probably need to repeat shooting parts multiple times. No "umm..." or "okay, let's wait for that to install"
Thank you for creating this video. It really helped me to understand react and state. I didn't know about the types of states in an app. For the past couple of weeks, i have been working on a project which requires fetching a lot of data in my next app. basically I wanted to create a dashboard. I wanted to reduce unnecessary API calls. Today I got to know about SWR. I knew about react query but never knew what it does. This video literally summed up everything. I am watching your videos for the past couple of days they are really helpful
I really appreciate this comment. Glad I could help!
Great video!
Every project don't need heavy libraries like Redux/Recoil. Sometimes you just needs to create and consume global states. "react-rhino" is a library which does exactly the same with simple and straight forward syntax.
It uses Context API under the hood, but is very very simple than useContext.
use react query to manage your server state. redux and other libraries are not ideal to manage server state lifecycles. react query handles caching, fetching, and updates asynchronous data. if you remove all the server state from redux or other libraries to react query, your global state becomes very thin.
This is the best video I've seen on this topic. Thank you so much for all of the great info here.
great explanation.
would you only use a caching library like SWR if you don't expect the API results to change in the short term? for example, if you're fetching stock quotes, i would imagine you don't want to used the cached result from 2 minutes ago.
Excellent👍
Who can dislike this. Cheers buddy
thumbs up for Schiit Stack behind
Such a great content but would like to see you create in depth videos for differnet state management lib or even intro to the upcoming useSelectedContext!
lol I said "it depends" in the same time haha, great video Lee thanks!
Always great content
Thank you for all
Wow. This was great.
Thanks Lee! What state management solution can be used for keeping global state of websocket data coming from IOT sensors to dashboard?
Great vid!
What do you think about recoilJs?
4:45 😁No strong opinion other than it works well for certain use cases.
Your thoughts on zustand? Great vid Lee
Thank you! The Zustand authors seem to be recommending Valtio now: twitter.com/dai_shi/status/1358568517100920832
@@leerob didn’t know about Valtio. I was using zustand + immer for one of my projects. I also found recoiljs very similar to zustand
For small projects Redux is not needed, but as a project grows it may become necessary. The Context API is great for side and small projects, but may not be enough. I use Redux mainly, but I'm starting to use react-query for my fun/side projects. Appreciate your input Lee. See you soon!
Can I ask whats your react stack? Like what library do you use/like?
fantastic video. also appreciate the excellent bookmarking 👍
Hi, I am using pullstate which is very very easy while comparing all other global state management for react of redux, recoil, jotai etc. Is it good to use pullstate? Since I am a beginner i am finding difficult to choose the global state management.
Client state: Hookstate
Server state: React Query
I've reduced a ton of boilerplate-y code with those
Have fun
Wow. I’m going to have to try swr 😳
What's so bad about prop drilling? Verbose yes, but clear and easy to understand, also yes!
Makes it painful to maintain / re-write code.
Go make something bigger than todo list and you`ll find out
thanks for such a video
Great video as always! For form state management you didn't mention react-hook-form any thoughts on this?
I've made a video using it before, it's nice! Formik is just the most popular and widely used.
Didn't see it ... yet ;)
Understand that you talk about the most popular one. It just seems to me that R-H-F is much easier to use and less boilerplate than formik. Anyway thanks for your answer and for the great content
hello, did you try zustland? would like to here your thoughts, i think it is the simplist one so far.
React Context for context and xstate for state! context is the values you need through a component, state is a state!
What library best for figma like app?
React-query.
Redux adds a lot of unnecessary complexity and setup. Even in large projects, most of the time you don't need redux. Also, many times a lot of state don't need to be at the global scope and with redux people tend to put everything as global state. Unless redux middlewares like sagas are needed and are properly used, redux is unnecessary.
@@shahzadaalihassan_vlogs Yes
@Jack Saat This is true, but Redux is overkill for many projects.
I'll write this while i'm still watching the video, so i'll comeback later if the answer is in the video
How SWR data that was fetched from an API is available to all my components as a global state? or it is that it doesn't make a fetch to an specific route if it was called previously by another component 🤔
SWR provides the caching layer for you. So if you make a request to /api/user, you can use the useSWR() hook in 100 places across your codebase calling that same endpoint, and they're all looking to the same place in the cache!
@@leerob Amazing even without internet connection?
@@abumubarak_dev yes
I think only components that have useContext and their children rerender, not every component under the context provider.
react-query
I was frustrated by redux🥴. I ended up creating my own state management library 🥴🥴
Zustand
just use angular it doesnt suck
I was trying to learn how to luse redux with redux tk, but then the docs mentioned the use of IMMER. It was a totally turn off for me.
the answer is, all of them, I usually combine context/swr/hooks. Going forward I can see redux become less popular.
I prefer zustand
Zuuuuuuuustanddddddddd
just don't use redux and you will probably be okay (or better than with redux)
You should use redux, sorry guys
I think the central store is a big advantage, I have been trying context and use useReducer which is fine for small projects but doesnt feel right as things start to grow.
@@lardosian same here
but it's so hard
@@ufufu001 I agree
@@ufufu001 Check out redux-toolkit. Much easier and cleaner code.
none.. more bloat more complexity
@Jack Saat Throwing other problems at a problem is not the solution