Learn React Hooks: useContext - Simply Explained!
ฝัง
- เผยแพร่เมื่อ 26 ก.ย. 2024
- 🚀 Project React → cosden.solutio...
📥 Import React (Newsletter) → cosden.solutio...
Join The Discord! → discord.cosden...
Source Code → github.com/cos...
In this video we will learn about React hooks, starting with useContext. This powerful React hook will allow you to manage your state efficiently without having to pass an enormous amount of props around (prop drilling). You will learn how to identify when to use the React Context API, how to use createContext to create the context, create a custom hook to handle undefined values, and finally use the context in any component to get access to the data.
In this new React world, hooks are here to stay, so it's best to learn them! In this tutorial I demonstrate the useContext React hook, and I explain it very simply and in a way that is easy to understand. Enjoy!
Hope you enjoyed the video! I also have a really cool and unique course that will teach you way more than this video. You'll learn how to build an actual complex project with React. It's called "Project React" and you can find it at cosden.solutions/project-react. Also, I have a free weekly newsletter called "Import React" with tutorials, news, and cool stuff about React! You can sign up at cosden.solutions/newsletter?s=ytc
Thank you for the content. You have the gift to talk about coding in a simple way.
thank you for the kind words!
Clear explanations with no "fluff!
Great tutorial! I was so confused about how Context works, every other creator complicates it too much. Thank you for simplifying it. Just subbed!
makes me happy to hear!
It's like eating a tasty food for the brain. Your presentation and words used is really easy to understand and not verbose. Liked and subscribed.
It's amazing you also taught how to deal with problems and showed proper way to code and handle potential errors.
I have seen a lot of videos on context but this is the best. easy to understand and follow through. thank you.
Thank you. I've been learning React for about 4 days and I was confused about the useContext and createContext, but your video explains it well. Thank you.
did you complete your react journey?
This was a really good explanation. I took notes and later was able to replicate a similar example. I now understand the useContext hook a lot better. I'm just starting with React and this is really my first application, although I work with a team in a project that already have a lot of react. I expect to become more proficient in React to really be able to work on that project. Keep the good work, I hope you get a lot of subscribers soon.
Really happy to hear that dude! You're going to do great ☺️ thank you for the kind words!
@@cosdensolutions please when are going to do a video on HOC
Wow you're a perfect teacher and programmer thanks for the time that you spent for this amazing content
Thanks for content it get me out of props drilling and gaining to know the power of the useContext and customHook.
Great explanation! I am new to React and your Hook series are really helpful to me. As I also do not have much time to go over everything and this is clear, on point and very concise. Thank you 🙇
Thank you very much for your video. I finally cleaned up my context implementation and were able to get rid of the question marks 🙂
Thanks man, been watching your videos for the last 7 days. Practicing for mid-senior dev job...
Now I feel like a junior dev 😁, because of all the content I learnt. I "was" a "I can do it, but I can not explain it" person.
But the upside is now I "REALLY" know what to do.
Just subscribed.
And we need more videos on testing.
been loving the react tutorials man! dont think anyones ever explained context so simply :)
Wow! Such a excellent explanation and with examples too. Well done 👏👏👏👏
Glad you enjoyed it! 🤙
I watched you before because I have already subscribed some of coding channels but I watched your single video with all of my focus and then I did a subscribe to a channel which was your channel and started watching another video from your channel... Thank You !
I hope your videos go viral soon like they should. You are doing a great work with your explanations
Haha imagine going viral for React 😅 would love it!
This was straight forward. Thank you for throwing in the extra error handling method as well 🔥
Great, thanks. It's my first Context video and I think I got it at the first time because it's so well explained, of course having used Redux before makes this easier to understand.
glad to hear it!
1:34 that was genious and I subd immediately. Nice work!
Done thanks!
Wrap useContext hook in a custom hook to handle when the context is null (if component didn't have provider up in the tree when it should have and tried to use the context hook)
I subscribed!! This is a great way to explain the concept + thanks for adding the error handling part 👍
🤙
Definitely appreciate your attention to detail and have earned my sub. You helped me understand how I was having trouble with a boilerplate I use that has a useState inside a useEffect. I understand *what* the problem is now (thank you for that video), but I can't figure out what I need to learn to solve it. Thanks for at least helping me get closer.
Bro thank you for this video! amazing. I have an interview in 1 hour and it's main thing is knowing about react context!
After this video you really don't need to watch another video about react useContext. This was excellent video.
Bro I really love your content and I learn a lot from you, don't worry about subscribers, they will ultimately come to you as your way of explaining is so very good. Keep uploading contents.
thanks for the kind words! 🤙
Thank you! It's so clear
Top-notch explanation. Manifesting 100k subscribers by end of this year
This was the clearest explanation I've seen. Thank you!
1:31 This part of the code worked; I have now subscribed!
☺️
"If you watch this hook video, you'll probably never need to watch another"
This is so true! You explain it so well. Thank you!
Great one with context, i like the way you handled the undefined scenario. Thanks for the tutorial.
useContext is a great alternative for a bunch of prop drilling with a bunch of useStates as well in the child component as well.
you know im a sub bro, your videos is my goto for react content- one day inshallah i meet you when i build an insane app
that's incredibly explained, thank you sir
I grabs those points clearly, thanks dude.
Sou desenvolvedora Júnior e seus vídeos estão me ajudando muito a me desenvolver 🚀
No doubt I won't need to watch another React Context API video! [Subscribed]
great explanation. I was a little bit confuse when using context and how to implement them.
And what if User comes from a fetch? Do you put in on the custom hook? How would you handle errors? Thanks for the video
If user come from server state, don't throw error in custom hook, just return user.
really nice and simple explanation thank you for making this video
trying to get a grasp of it,nobody taught like u did,i finally get it now ❤❤
🤙
man, awosome video crystel clear concepts and learned how to write a more safe code(in the pov for debugging)
I reall like this explanation. You're very good, god bless you!
Thanks a lot, this was really helpful. Really great video and great channel
glad it helped!
I watched many videos and still did not understand context but this video helped me a lot.
you got this
I speak another language, but I'm happy to find this video. Thanks!
Working on adding translated captions to all videos soon!
Thanks it was very helpful
It would be suggested to put some console log and also the UI just to make it more clear would be a lot helpful too thanks
best explanation ever!🤩
Just make more videos like this on react plz you explain really well
Will do!
the way you explain react is the best!
1:37 if you really want user to get you subscribed create content which user want to watch again and again, most of us won't subscribe but still hit a like button just because we know this video is great and we can come back to you by searching you, to be in our feed create something which we want to see on daily basis and these things are not one watches on daily basis... this is just a advice... you gained 1 subscriber
A really underrated channel, well done bro! ⚡❤
realy thank you but i have a question please which better using context api or redux tookit
Great content, thank you!
Really use full video thanks for doing ... extending my great full and encouragement .... keep doing well..
grouse wrapping the context in a hook. You can build up the provider with state & mutators and pass that to the value of the provider. There's no need to wrap the context with hook jank to extend the context -> with a wrapped hook A) you're not enforce access & mutations B) you also have an extra shit tonne of renders as the hook runs through state changes in every component C) you remove the useContext which hides the fact the component is consuming global/shared state.
I literally subscribed after seeing your message in the Video
Great tutorial thanks !
man.. this is a lot to wrap my head around
With a few exceptions, I'd stay away from context. It sounds like an easier way to share state but come with some significant performance penalties on larger apps.
That subscribe intro you did made me subscribe. Genius.
GOD level explanation. I want everyone to subscribe to this channel. Too bad one can't give two likes.
Bro I love the way that you explain keep it up. Subscribed❤
thanks man I really understood it. Subscribed already
Thankyou very much!
Fantastic tutorial. I really appreciate it. 😊
Great video, thanks for sharing your time and knowledge,
Amazing Channel for Learning React
you made it soooooo easy to understand
I really did subscribe at 1:57...good one there😂
Home of React well explained Tutorials
great explaination on useContext
Thanks for the reminder to subscribe. Guilty as charged, but subscribed now.
ok lắm anh trai đẹp zai ơi, em mới học mót không học chính thức, ban đầu em đi móc A => B => C => D, bây giờ thì móc A => D )))
Thanks from india..
Amazing channel, thanks.
Good explanation! I have a question: if the user refreshes the page, wouldn't the state stored in the context be lost?
yeah it would. If you need it, you need to store it in localStorage or db
I didn't understand where it imported the "user" object from, when it creates the context. uswContext is the parent folder? So evereything we're looking at is wrapped inside a chidren of useContext?
Great Explanation, Thank you!
Thank you very much. Good content
Nice videos!
It is possible to change/set Context before going to another screen (using a Link or Pressable component and Expo Router)?
This example is great to set a value and call a component but not to move to another page,
I have a JSON object that I receive in the Home page that contains info used by the rest of the App. I want to set the context there and use that info in other pages in the App.
Thx!
great explanation
nicee, it works now i'm subscribed
Thank you man. That is good explanation
i put like b4 watching your videos :)
legend
don't know why love watching your videos🤍
Thanks man! Crystal clear now!
Another great tutorial thanks so much!
Realy great explanation,thank you
Great job man. its very helpful !!
Very well explained !!
You're the best man
Crystal Clear... Thanks
Great tutorial thanks. My subwoofer got a serious workout every time you banged the mic though :-)
LOL 😂 it gets better in later videos I promise!!!
How do you change the context value say you want to login as a different username so need to load a dashboard of a different name?
Thanks bro, much appreciated !
thanks . helped a lot
Thanks, man very good video. 10 Stars ⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐