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/mac...
Email: [e-mail]

[@LearnUp..]

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

[@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:)

[@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

[@nikolatesla399]

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

[@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.

[@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...

[@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.

[@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!

[@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

[@patrickwainaina2104]

Very clearly outlined, you nailed it brother Thanks a lot

[@broken_jail2506]

Thanks so much for this tutorial, so so helpful!

[@tinotaylor]

This was great Pedro. Perfectly simple 👌🏼

[@ca-xo2ur]

Great explanation for a refresher thank you so much!

[@samnayakawadi]

You explained it very well. 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)

[@learnwithjoe8117]

So much better explained! Thanks!!

[@Sanyat100]

Ur video s are the best compared to all the others

[@PedroTechnologies]

Thank you for the positive message!

[@Bertoos8]

Obrigado Pedro 🙏 Mais uma vez!

[@blagovestkolev7716]

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

[@michaelodikanwa442]

Good work here, PedroTech.

[@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.

[@gayanhewegeonline4594]

We love you man!

[@vivekpadelkar]

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

[@purvaparulekar-zq2ck]

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

[@517Amit]

Nice. Thanks for this informative video.

[@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?

[@abbasahmadvand6866]

perfect bro

[@farhanfadil4503]

Thanks a lot man :)

[@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!

[@alexandrudorultan9001]

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

[@akaghzi]

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

[@SatyamYadav-wh1zf]

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

[@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

[@danehague1]

Thank you, great tutorial

[@FunkyFun493]

Thank you soo mutch

[@shreyashkauthankar1928]

💯

[@sonamohialdin3376]

So good tutorial very useful

[@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.

[@bars5762]

wow that was clean explanation :)

[@brianross1972]

Awsome!

[@PedroTechnologies]

Glad you think so!

[@FunwithBlender]

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

[@viniththanasekaran1417]

Thanks!

[@wylakers1250]

love u

[@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?

[@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 😔

[@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

[@dianamatvienko8068]

Thanks))

[@ricardotech]

[@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.