UseContext Hook Tutorial In ReactJS | Global States

In this video I teach you guys how to use the UseContext hook from the React context api to create Global States. This is a very useful hook that can be used in many different situations. Using this together with the UseState hook allows cross component state management!
-
Please leave a comment on what topic you guys want me to cover next!
Checkout my discord for any questions: / discord
-
SUBSCRIBE!
Social
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Website: machadopedro.com
Twitter: / pedrotech_
Linkedin: / machadop1407
Instagram: / _pedro.machado_
Github: github.com/machadop1407
Email: [e-mail]

[@LearnUp..]

I never understood CONTEXT as a beginner until I watch your video, thanks for making it simple to understand.

[@firepup9924]

I was stuck trying to change useState in a child component all day. But then found this video. Thank you so much now I realized I have to learn all those hooks :D

[@metinkucuk734]

Pedro thank you billion times!! As a newbie in React I couldn't find any simple video that talking about useContext from scratch. Even in the channels with millions of followers. Thanks to your video I got the hang of it. Keep up the good work:)

[@daviddriscoll8546]

This is a really nice, clear explanation. Great work (as always) Pedro!

[@edgarzatarain6535]

your videos always help me when im having problems, keep the videos coming!

[@tinotaylor]

This was great Pedro. Perfectly simple 👌🏼

[@nikolatesla399]

Hey , iam contributing to an open source project that is using react as their frontend , this video is soooooo helpful❤

[@patrickwainaina2104]

Very clearly outlined, you nailed it brother
Thanks a lot

[@learnwithjoe8117]

So much better explained! Thanks!!

[@ca-xo2ur]

Great explanation for a refresher thank you so much!

[@satyaganesh672]

broo ur explanation skils are awersome.;.. u really saved me man 🙌🙌🙌🙌🙌🙌🙌🙌🙌🙌

[@tharun5439]

Thanks a lot bruhhhhhhh...i simply cant explain my gratitude in words...

[@karimkazia]

Well this just saved me a ton of work , i am integrating with Django REST API.. Thank you.. simple but will help alot!!!

[@PedroTechnologies]

Awesome! Context API is one of the coolest things I learned while working with react! State management used to be something I thought react lacked but using this changed my mind.

[@samnayakawadi]

You explained it very well. Thanks.

[@broken_jail2506]

Thanks so much for this tutorial, so so helpful!

[@blagovestkolev7716]

Great! Very useful to me! Keep making videos the same way (your way) !

[@bastienv6233]

your video is so perfect ! Your english is very good and simple enough for non english speaker and beginer. Thank you so much for all of your content.

[@517Amit]

Nice. Thanks for this informative video.

[@Bertoos8]

Obrigado Pedro 🙏 Mais uma vez!

[@michaelodikanwa442]

Good work here, PedroTech.

[@gayanhewegeonline4594]

We love you man!

[@danehague1]

Thank you, great tutorial

[@vivekpadelkar]

great work bud!!!!!!!!!!!! keep going....subscribing your channel....

[@minok7374]

Muito legal ver um brasileiro produzindo esse tipo de conteudo! Parabens pelo canal cara, mais um inscrito!

[@rvft]

never thought legal would mean cool in portuguese

[@minok7374]

@@rvft It does kkkkk

[@farhanfadil4503]

Thanks a lot man :)

[@bars5762]

wow that was clean explanation :)

[@sonamohialdin3376]

So good tutorial very useful

[@ahmetyilmaz3896]

another great vid :)

[@Sanyat100]

Ur video s are the best compared to all the others

[@PedroTechnologies]

Thank you for the positive message!

[@abbasahmadvand6866]

perfect bro

[@FunkyFun493]

Thank you soo mutch

[@brianross1972]

Awsome!

[@PedroTechnologies]

Glad you think so!

[@viniththanasekaran1417]

Thanks!

[@mitch1668]

Hey Pedro, what add-on do you have that automatically loads the useContext at the top when you type it within the function? (6:03)

[@shreyashkauthankar1928]

💯

[@dianamatvienko8068]

Thanks))

[@K-nz0]

Can it be possible to be able to change the state before the return braces, within a function? I need the boolean to be set to 'true' only within an if-else condition. I've tried to directly use "setLoggedIn=true;" but it says that I cant change const values.

[@wylakers1250]

love u

[@manuelpineda924]

I was looking to do the same on redux but redux is a total pain to setup. Awesome video thank you, i'll use this method instead

[@PedroTechnologies]

Thank You For Watching! I agree, Redux is a hassle to setup.

[@manuelpineda924]

@@PedroTechnologies definitely watching your other videos

[@PedroTechnologies]

Thank You!

[@SatyamYadav-wh1zf]

Pedro,I have doubt is that once I logged in and then refresh the page the whole logged in info gets vanished.

[@DineshSainath]

What do I do when I get "undefined" when I access the state using context in another component?

[@ca-xo2ur]

You're not importing it correctly?

[@akaghzi]

Guru, how I deal with page reloads, because lossed the states when page reloads

[@alexandrudorultan9001]

Hi, Provider doesn't working I tried to install that but still got in error any idea how to fix that?

[@purvaparulekar-zq2ck]

How can I import useContext variable in a react file which does not have functional compoent.

[@nikolaswalter490]

Trying this in react native and it does not work for some reason. Getting element type is invalid, you likely forgot to export your compoment or mixed up imports, even though I am pretty sure I got the imports down

[@ricardotech]

[@semihozturk9665]

Thank you bro, it was helpful. Btw do you recommend me any site or tutorial or youtube videos for learning react, react-native in depth?

[@tomasburian6550]

This doesn't work. When the page opens, the context is still an empty object as you defined. The values aren't filled in.

[@lucasbpsx8566]

Cara como você fala tão bem inglês? Eu consigo ler textos complexos e escutar tudo, mas na hora de gravar um tutorial em inglês minha mente da tela azul

[@PedroTechnologies]

Boa mano! Eu tive o privilégio de aprender inglês ao mesmo tempo que eu aprendi português kkkkkk mas ainda tenho sotaque! Acho que é muito sobre prática

[@FunwithBlender]

Every example uses onclick.... wish there were examples on condition met trigger x without click

[@lauracooper4676]

Is anyone getting the error: 'setLoggedIn is not a function'. I'd really appreciate some help

[@nightcrawler6618]

me, still haven't found the solution yet

[@lauracooper4676]

@@nightcrawler6618 me neither sorry 😔

[@manuelpineda924]

or is it better to use Redux?

[@PedroTechnologies]

To be honest, I used to use Redux (not for long though) but I stopped because I just don't see the benefit of using it outweighing all of the negative parts. I dislike the development experience with redux, and I prefer using the Context Api much more. I would say that using the Context API is a bit better, especially in regards to setting stuff up!

[@manuelpineda924]

@@PedroTechnologies Yeah I can see that. I had to watch a 40min setup video compared to this 9 min one.

[@leofreiitas]

Does not work for me and I do not know why =/

[@leofreiitas]

I found out why it did not work hahaha, I have put {}, instead of [] when I was creating the hook on the parent =D

[@Pareshbpatel]

{2022-03-22}

[@maxsalum6589]

Honestly, I don't think it was a good example as you basically showed how to pass state to all children which is similar to props. useContext should be shown in contrast to props drilling, where you pass parent state to a, say, 'grand child' directly, i.e. not through passing props to child and then to its child. Otherwise, a good tut. Like your other videos mate. Gracias.