@@bonfaceosuka not all the project I went are using react hooks. In my previous jobs from 2019 to 2021. I just got started again to refresh my knowledge. My recent skill set is low code which is more convenient to implement than traditional. I understand your point. But laughing at me is not okay.
00:02 React hooks simplify functional components to work like class components 03:08 Demonstration of changing and updating colors in React 09:51 Using useState hook to manage state variables and update UI dynamically 13:07 Explanation of creating state variables and transitioning to state objects 19:53 Updating state based on previous state using the spread operator. 22:48 Explanation on updating counter value by one and four 28:21 Explanation of the use effect hook in React components 31:08 Implementing a timer function using useEffect 36:13 Understanding the use of useEffect hook in React 38:52 Using useRef hook to access and modify DOM elements 44:28 Using useRef to prevent unnecessary re-renders 47:23 Using useRef to maintain state without triggering component rerender 53:02 Explaining the use of useRef, useMemo, and useCallback hooks in React. 56:00 Implementing power function in React Hooks 1:01:42 Using useMemo hook to prevent unnecessary recalculation of the cube function 1:04:21 UseCallback Hook caches function between renders 1:10:10 Using memo method to optimize rendering 1:13:01 Explanation on function comparison using equality check. 1:18:17 Using useEffect to prevent unnecessary renders 1:20:46 Using props to pass data at every component level can be painful. 1:26:34 Adding context support in React project 1:29:49 Mounting components and consuming context in React app 1:35:29 useContext hook for managing global data and sharing data across components 1:38:07 Creating a counter using useState and useReducer hooks. 1:44:01 Dispatch method updates state using reducer function 1:47:08 Use reducer function for state management 1:53:01 Using useReducer to efficiently update state variables for different actions. 1:55:40 Illustrating how useLayoutEffect executes before rendering 2:01:24 Understanding useLayoutEffect and useEffect Hooks in React 2:03:54 Demonstration of using React Hooks to manage state and local storage data 2:09:17 Implementing custom React Hook to handle local storage operations 2:12:13 Creating and using custom hooks with local storage 2:17:45 Thank you for watching
I heard this voice when I started learning HTML CSS and JavaScript and now I am still watching even though I am capable of creating apps on my own. I want to thank him for his input in my life as far as my career as web developer is concern.
Its a real Gem !! best explaination on hooks, great way of teaching-- starts with a problem --> makes us realise why we need any particular hook--> explains it clearly
Hi @greatStack, javascript, react , react hooks tutorials are very very informative, thank you so much for such a great videos. could you please please make a video on node js, express js and mongodb . we will really grateful.
Hi! Great explanation! In the useMemo cube example, could we do the following? : Keep the cube result as state. On change of input, call a function, which we use a local variable to store result of calling cubeNum function and then updating cube result state, and then in UI, render using cube result state.
I love your tutorials previously because you provide assets 😅 and your explanation was always good. But in this video you just nailed react hooks I don't think there is any other source where you can learn hooks in that much easy way. I really appreciate your effort ❤.
Thank you so much for your kind words! 😊 I’m glad you found the React hooks tutorial helpful. Your feedback really motivates me. Thanks for your support! ❤️
👏Hello brother your react series is going best👍👍 make more projects of react But bro I have an problem in react installation please help me brother make solution video please 🥺
Wow what a clean and clear explanation of all the react hooks, thank you so much for such a great explanation which no one can get on paid course also.
Sir as you hit 1million please provide 1 react js project with source code, as a lower middle class student your code prize is not affordable,iam requesting not for all source code just one react project code🥺🙏
Very well explained. it's clear my all doubt. very-very thanks to making this type conceptual video. can you please make full video tutorial on firebase.
While giving the example of useRef (), You removed useEffect because it was rendering the component alot of times. But, if we had passed the dependency of Value to useEffect. It would have rendered only when the Value would have changed right?? Then what useRef made different there?
Completedly understood the 2nd implementtion of useRef hook. That is what we have used it for . But can you please help me understanding the !st use of useRef?
thanks for your excellent explanation but I am facing problem in useContext section as whenever i am trying more than one data, it shows as an error and adds that Objects are not valid as a React child (found: object with keys {name, phone}). If you meant to render a collection of children, use an array instead. please help me
Sir please make a full tutorial video how to upload website upload online and what is SSL, hosting and how to maintain our website Please sir it's request
Redux is a complex state management library with a centralized store, ideal for large apps. useContext is a simpler, built-in hook for sharing state between components, best for simpler use cases. Redux has a steeper learning curve and more setup compared to useContext.
![React Hooks in ONE Video 2022 [ EASIEST Explanation ] | React JS Tutorial](/img/n.gif)
👉Get Certified for react hooks course: quiz.greatstack.dev/rhks
90%
Got 90%
In my 2 years in React JS. This is my first time I understand react hooks really well. Thank you for your well explained tutorial.
Hahahaa I once saw a meme about developers coding and not knowing what they were doing .
@@bonfaceosuka not all the project I went are using react hooks. In my previous jobs from 2019 to 2021. I just got started again to refresh my knowledge. My recent skill set is low code which is more convenient to implement than traditional. I understand your point. But laughing at me is not okay.
00:02 React hooks simplify functional components to work like class components
03:08 Demonstration of changing and updating colors in React
09:51 Using useState hook to manage state variables and update UI dynamically
13:07 Explanation of creating state variables and transitioning to state objects
19:53 Updating state based on previous state using the spread operator.
22:48 Explanation on updating counter value by one and four
28:21 Explanation of the use effect hook in React components
31:08 Implementing a timer function using useEffect
36:13 Understanding the use of useEffect hook in React
38:52 Using useRef hook to access and modify DOM elements
44:28 Using useRef to prevent unnecessary re-renders
47:23 Using useRef to maintain state without triggering component rerender
53:02 Explaining the use of useRef, useMemo, and useCallback hooks in React.
56:00 Implementing power function in React Hooks
1:01:42 Using useMemo hook to prevent unnecessary recalculation of the cube function
1:04:21 UseCallback Hook caches function between renders
1:10:10 Using memo method to optimize rendering
1:13:01 Explanation on function comparison using equality check.
1:18:17 Using useEffect to prevent unnecessary renders
1:20:46 Using props to pass data at every component level can be painful.
1:26:34 Adding context support in React project
1:29:49 Mounting components and consuming context in React app
1:35:29 useContext hook for managing global data and sharing data across components
1:38:07 Creating a counter using useState and useReducer hooks.
1:44:01 Dispatch method updates state using reducer function
1:47:08 Use reducer function for state management
1:53:01 Using useReducer to efficiently update state variables for different actions.
1:55:40 Illustrating how useLayoutEffect executes before rendering
2:01:24 Understanding useLayoutEffect and useEffect Hooks in React
2:03:54 Demonstration of using React Hooks to manage state and local storage data
2:09:17 Implementing custom React Hook to handle local storage operations
2:12:13 Creating and using custom hooks with local storage
2:17:45 Thank you for watching
I heard this voice when I started learning HTML CSS and JavaScript and now I am still watching even though I am capable of creating apps on my own. I want to thank him for his input in my life as far as my career as web developer is concern.
I'm glad to hear that and proud to have you as our subscriber. Thanks for your comment. 😊
@Leesdjo Thats great. can you tell me how many year have you been learn web dev until now?
Its a real Gem !! best explaination on hooks, great way of teaching-- starts with a problem --> makes us realise why we need any particular hook--> explains it clearly
Well Explained... Really Appreciate to making React hooks very simple. This is what we require as a professional to learn the things quickly.
Thank you so much.
Thank u so much for the content with an example!❤
The way u explain is so amaizing ..ur great teacher.....lots of thanxs
Glad you liked it! Thank you. 😊
This tutorial is really helpful and usefull for beginners ❤️
Glad it was helpful! Thank you for the comment. 😊
for me too divya
Post React Full Course in one video sir❤❤❤
Thanks Great Stack❤. And also teach express js, node js, mangodb tutorial
Thank you so much GreatStack Team. The greatest of all time❤❤️🥰. Love from Srilanka🇱🇰
Thanks, bro. I've learned a lot from your tutorials, and I appreciate your clear explanations.
very beautifully crafted videos 🙏 you are our custom Hook 😊😊🎉
Thank you so much! 😊 Keep leaning.
Thankyou So much sir Its really a grate Videos 🙌🙌
1M subscriber GreateStack👏👏👏👏👏👏👏👏👏👏👏
Hi @greatStack, javascript, react , react hooks tutorials are very very informative, thank you so much for such a great videos.
could you please please make a video on node js, express js and mongodb .
we will really grateful.
Thank you. Noted. Will try.
One of the perfect tutorial that i found i have watched! this tutorial is amazing and really intresting. thank you for making such kind of tutorial.
This content is really helpful for anyone who is looking for React Hooks or even the beginners. Thanks for sharing this AMAZING Simple content...!
Thank you very much, as I was giving up React, then this tutorial. Best explanations...
You're welcome! Glad it helped you. Thank you! 😊
My man❤❤❤❤❤❤❤❤❤ sooo well explained
Thank you so much 😊
Hi! Great explanation!
In the useMemo cube example, could we do the following? : Keep the cube result as state. On change of input, call a function, which we use a local variable to store result of calling cubeNum function and then updating cube result state, and then in UI, render using cube result state.
Thank you for your great lesson man! Very clear!
Thanks a lot. clear and easy presentation
i really appreciate your efforts in helping me understand frontend . Love from Pakistan
Thank you so much! 🙂 Keep learning and build some react projects.
I love your tutorials previously because you provide assets 😅 and your explanation was always good. But in this video you just nailed react hooks I don't think there is any other source where you can learn hooks in that much easy way. I really appreciate your effort ❤.
Thank you so much for your kind words! 😊 I’m glad you found the React hooks tutorial helpful. Your feedback really motivates me. Thanks for your support! ❤️
This Video is really really helpful thank you very much.
Glad to hear that. Thanks for your comment. 😊
Thank you, Avinash. You helped me a lot, and I learned a lot from your videos, I really like the way you explain. 🙏
Glad to hear that. Thank you
Great tutorials from a good guy 👍👍
Thank you my friend. 😊
❤@@GreatStackDev
Thank you so much for this video , it has been of great help to me.
you done a great job sir!!
Thank you. 😊
This tutorial helped me a lot to understand hooks with real world examples.
nice explain sir👌
Bhut mast video banya bhai aapne
👏Hello brother your react series is going best👍👍 make more projects of react
But bro I have an problem in react installation please help me brother make solution video please 🥺
GreatStack, i mean GreatStuff, Thank you for explaining very well.
Glad you liked it. Thanks for your comment. 😊
Superb ❤❤
Custom hook is hard to understand but for other hook , thanks ❤
Thank you bhaiya, aaj meri doubt solve itne din hawa mai tha..
Glad you liked it. You are welcome! 😊
Bro this content worth thousands, simply teaching valueable things for free, this worth ad
I appreciate that! Thank you so much 😊
thanks a lot.❤
You're welcome. 😊 Keep learning.
This is a great video. Great examples definitely to rewatch
Glad you enjoyed it! Thanks for your comment. 😊
great explanation
Wow what a clean and clear explanation of all the react hooks, thank you so much for such a great explanation which no one can get on paid course also.
Thank you so much Rahul! Glad you liked it. 😊
Loved it.. please make a detail video on redux!
Bro You're a great Person Thanks a lot, My Confidence level increased after I started Watching Your Videos😊❤
Great exlpanation 👏, thanks man ❤
Thank you ❤
You're welcome 😊 Keep Learning.
Nice sir Make some video on react native your teaching styles is too good
bestest react hooks vdo ever
Brother, I can confidently say that this video is one of the most complete and accurate for learning the hooks in the react library, thank you
😊😊👏🙏🙏
Your like bookm bro your content deserve million's of views
Thank you so much.
I'm the first one to comment... Loves your videos... Keep it
Amazing 🤩
Thank you Venkat.
Mja aa gya❤
Clear an concise
45:16 we can also solve the infinite render issue by passing [value] as a dependency in useEffect
I am excited 🎉🎉🎉
Amazing tutorial
Glad you liked it. Thanks for your comment. 😊
Thank you, sir ❤
thank you so much
:)
You're welcome!
hello bro nice video and all point are good but you can create redux complete one video
in useeffect , settimeout() without use effect working as increasing value by after 2seconds what is difference using use effect and without it
Please make more series like that for javascript and react and redux too
Thank you sir 🙏
best explanation
You are so awesome.😀 Please Keep going
:)
You're welcome. Thank You for your comment. 😊
Excellent
Glad you liked it. Thanks for your comment. 😊
Thank you
Glad you liked it. You're welcome Jayesh! 😊
Sir as you hit 1million please provide 1 react js project with source code, as a lower middle class student your code prize is not affordable,iam requesting not for all source code just one react project code🥺🙏
Bro, why do you need the source code? Just watch the video and code alongside it."
Congratulations🎉 1M
Very well explained. it's clear my all doubt. very-very thanks to making this type conceptual video.
can you please make full video tutorial on firebase.
Sir make the complete video on React router and nested routing plz plz
I need all the examples code for future reference
Plz provide git link
Nice!
I'm so glad! 😊 Keep learning.
While giving the example of useRef (), You removed useEffect because it was rendering the component alot of times. But, if we had passed the dependency of Value to useEffect. It would have rendered only when the Value would have changed right??
Then what useRef made different there?
Completedly understood the 2nd implementtion of useRef hook. That is what we have used it for . But can you please help me understanding the !st use of useRef?
Great Explanation
thanks for your excellent explanation but I am facing problem in useContext section as whenever i am trying more than one data, it shows as an error and adds that Objects are not valid as a React child (found: object with keys {name, phone}). If you meant to render a collection of children, use an array instead. please help me
Sir when you teaching use ref: are u using tailwind css
thanks
nice one tutorial👌
Glad you liked it. Thank You.. 😊
First comment 😊
Content is top notch but there are a lot of ads
Free me kuch ni milta youtube pr
Subscription le lo
@@fashionaddaudaipur4023khi v kuchh nhi milta free me
Good explanation indeed, I love your content. But can we create more than one context in a project
Yes we can create more than one context
Sir please make a full tutorial video how to upload website upload online and what is SSL, hosting and how to maintain our website
Please sir it's request
Bro when I stood up on my feet I will meet you one day ....
Nice ❤❤
it's not everything but it's fine. Thanks
overall pretty good, you have a couple errors in your useReducer example though
what is major diff between redux and useContext hook
Redux is a complex state management library with a centralized store, ideal for large apps. useContext is a simpler, built-in hook for sharing state between components, best for simpler use cases. Redux has a steeper learning curve and more setup compared to useContext.
Please can you make a video on redux
Please make detail tutorial on redux and toolkit
Noted
can you use appwrite as a database and nodejs i hope you'll notice me
why cant we directly put count+4 in use state example?
Please bring a big project with next js
in useEffect Section you forgot to mention about the Lifecycle methods and return {} .
27:28
Sir Please add video on redux toolkit too ....
Do tutorial on react native and flutter.
yes 💪💪
Sir please upload tha project real time chat application