I was paying attention to every single detail until Rafiki "throw-away" Simba, then I totally lost my track. Although I manage to watch the entire video and is explained incredibly well. Excellent!
I love the way that you explain things. Most tutorials I've seen just show how to implement the code step by step (for total beginners), but your tutorials explain the reasoning behind it. Way more concise and valuable. Sad there's not more free content shared on CZcams though....
agreed, this is amazing. It gives the context,history, and 'why' before just diving into code. I got more out of these 15 minutes than I have in any other tutorial.
Nice. I tried to learn React almost 3 years ago, and now 2 weeks ago I started again; in these weeks I've been doing a project, and came across these two paradigms and didn't understand the difference between them. Plus I barely remembered the createClass paradigm. This video explains very well what is a Class component and a function component. But now I have a project with some Class components and some function components. At least now I know what I have to refactor. Thanks for this cool video.
For real. For months I’ve been trying to find a reason, a real world problem that React Hooks solves and this video is the first example I’ve come across.
This is one of the well rounded explanation on hooks (and why are they great) I've seen. It was so short but so well put together. Bravo. Getting a subscriber.
Teaching a workshop tomorrow, and this is such a powerful refresher on the history or how React components have been written over time. Awesome stuff Tyler!
I'm returning to the React world after working with Angular for a while and hooks were an unfamiliar topic for me because class-based components, lifecycle methods and setState() were the norm when I was still using React. This video was just what I needed to get up and running again because I'm exactly the type of guy who asks "but why do I need this though?". Great stuff
Excellent introduction. I'm studying React but I never really got a clear understanding of what's so special about Hooks (being someone that never had to deal with classes and the problems that you mentioned in your video). So I started looking around for specific examples / comparisons of how a React hook improves the current code, and this is the only video I found that focuses on this exact topic. Thanks for clearing it up for me!
This video made me change my mind about functional components. I guess I will stick to functional components from now on. Thanks for such a great explanation
👋 Hi. I hope you liked this video. If you didn't, well, that's unfortunate. Anyway, you should checkout Bytes - it's our take at a fun, educational, and entertaining JavaScript newsletter. Now, I know what you're thinking - "newsletters suck". And you're right, usually - but Bytes is different. With over 80,000 subscribers and a 50% weekly open rate, devs really love it. If you don't believe me, check out these Tweets - twitter.com/uidotdev/timelines/1428028877129936899 OK I'm done. You can sign up here (it's free) - bytes.dev?s=youtube
I dont know Angular yet but maybe the change in Angular was tremendous and the changes in React are simple but extremly improving everything? Don't know but there is a reason for everything
This is awesome. Thanks for sharing but I think you also missed talking about the beautiful combination of Context and the “useContext” hook. I think these together make using something like redux or mobx unnecessary in most cases. It’s extremely intuitive and less cluttered. Thanks for your content! Really liked how you explained the history of the “why”
Thank you so much for this quick course, it was impressive! Very well explained, in just 15 min I could put words on something I experienced since years ! Subscribing now :)
Thanks for the video! I really liked how you first explained *why* instead of directly starting with "what". That made it way easier to understand the concepts.
Just loved the way you introduced the design pattern of the hooks, and what problems it solves. I'm actually now very intrigued to go and read the hooks part in React's source code, to know how they implemented the reactivity there. Thanks. Keep going with what you do.
As most here have already said, you explained this well, covering the history, showing code samples + before and after, and the reasoning, but most importantly in a short amount of time (the primary reason I clicked this video (I will click videos that are 5min, 10min, and 15min being the max)). You also speak calmly from a neutral stance; I could not sense any frustration or whining in your tone of voice. Keep it up!
Very useful video, absolutely nailed it, but problem is , actually very little one (not only this video), when you editing video/audio please make spaces/gaps a bit longer between end and start new sentence , even for few more milliseconds, for not english speaking people is hard to understand , to quick information goes through . But that’s happens in 80% new videos, it's kind of very popular these days :) Apart of that this is the best video ever about hooks! Good job Tyler.
Awesome video, super well explained! I was kind of confused by "repos" though as I was thinking it was implementing the repository pattern, it might have been more clear loading "todos" or some other data that doesn't have double meaning in software.
Hi Tyler your explanation is awesome,thanks. Can you please make a video on es6 symbols like what are the real time use cases in our web application, where should we use in our app. Please it will be very helpful.Thank you.
These problem were solved decades ago with a pattern called MVC. React is a view library, it’s not designed to handle the complexities of a large scale application. Defining models and controllers as separate entities, then using react just for view rendering solves most (if not all) frustrations with react.
Two weeks of banging my head on internet trying to understand hooks and all it took for you was exactly 14 minutes to make me go "aha", shut down my laptop, walk out like a boss and claim that I understand what 90% of the world doesn't!
is this video implying that arrow function were basically designed due to problems with "this" and react development? people still dont understand "this" and i hear a lot of noobie developers say they just use arrow functions to avoid that problem lol.... but it does seem like arrow functions were made to help assist react with binding lol.. perhaps im wrong tho?.... its crazy how much power facebook/react has had on the entire ecosystem. i just started learning React, luckily i started with some legacy code and im a patient learner ( i feel like wayyyy too many people don't bother watching videos like this) and its awesome to see such an in depth historic breakdown. you are so right.... understanding WHY we use something helps so much. often i learn something before asking this question and never even end up using the skill later lol
To me, one of the biggest advantages of Hook concept - is automatic cleanup in `useEffect`. That allows us to avoid race conditions relatively easily(but it's missed in sample 11:49).
I've also heard of composition mentioned in terms of composing functionality into classes. Is it generally speaking referring to allowance for customization? [ie. custom hooks]
Thank you for making this video. I think you did a great job of explaining "why" hooks exist and what problems they are attempting to fix. I still think hooks miss the target on their goal of making React better. It feels like you are just trading one set of problems for another with 2 apis you have to learn.
I was paying attention to every single detail until Rafiki "throw-away" Simba, then I totally lost my track.
Although I manage to watch the entire video and is explained incredibly well. Excellent!
Haha same here. I rewinded, closed my eyes and listened. A little more clear doing it that way, I found.
@@andyengle same here
same, gifs distract sometimes.
I was going to come here to say the exact same thing, that part really distracted me. I eventually just closed my eyes.
and the crowd goes wild !!!
This video is explained incredibly well
Thank you Matteo!
I love the way that you explain things. Most tutorials I've seen just show how to implement the code step by step (for total beginners), but your tutorials explain the reasoning behind it. Way more concise and valuable. Sad there's not more free content shared on CZcams though....
agreed, this is amazing. It gives the context,history, and 'why' before just diving into code. I got more out of these 15 minutes than I have in any other tutorial.
I don't think I've seen anyone else in the JS community explaining things in this level of clarity :)
Thank you!
Nice. I tried to learn React almost 3 years ago, and now 2 weeks ago I started again; in these weeks I've been doing a project, and came across these two paradigms and didn't understand the difference between them. Plus I barely remembered the createClass paradigm. This video explains very well what is a Class component and a function component. But now I have a project with some Class components and some function components. At least now I know what I have to refactor. Thanks for this cool video.
Love this - especially the first chunk that explains the "why?". I never really felt the need to start using hooks until now :)
Glad you enjoyed it!
Bruh thank god for this video. This primer along with Ben Awad's technical hooks walkthrough has a young man feeling educated AF out here.
This guy is so good at explaining things, one of the best teachers hands down! I will enroll in your course now!
This is the first video I see which explains the real benefits of hooks instead of just saying "we can use states inside a functional component."
Glad you enjoyed it!
For real. For months I’ve been trying to find a reason, a real world problem that React Hooks solves and this video is the first example I’ve come across.
This is one of the well rounded explanation on hooks (and why are they great) I've seen. It was so short but so well put together. Bravo. Getting a subscriber.
Thank you!
I simply could not wrap my head around this. Now, I 'get it'. Thanks for doing this. A life saver!
I can't wait until they change how to create components and relearn React (again).
Could be worse if Angular.
Hey same with vue
Teaching a workshop tomorrow, and this is such a powerful refresher on the history or how React components have been written over time. Awesome stuff Tyler!
You're welcome! Good luck with the workshop!
I'm returning to the React world after working with Angular for a while and hooks were an unfamiliar topic for me because class-based components, lifecycle methods and setState() were the norm when I was still using React. This video was just what I needed to get up and running again because I'm exactly the type of guy who asks "but why do I need this though?". Great stuff
Glad it was helpful! Welcome back to React land.
Excellent introduction. I'm studying React but I never really got a clear understanding of what's so special about Hooks (being someone that never had to deal with classes and the problems that you mentioned in your video). So I started looking around for specific examples / comparisons of how a React hook improves the current code, and this is the only video I found that focuses on this exact topic. Thanks for clearing it up for me!
This video made me change my mind about functional components. I guess I will stick to functional components from now on.
Thanks for such a great explanation
Thank you so much, I've been thinking about this all day and this has answered all my questions.
👋 Hi. I hope you liked this video. If you didn't, well, that's unfortunate.
Anyway, you should checkout Bytes - it's our take at a fun, educational, and entertaining JavaScript newsletter. Now, I know what you're thinking - "newsletters suck". And you're right, usually - but Bytes is different.
With over 80,000 subscribers and a 50% weekly open rate, devs really love it. If you don't believe me, check out these Tweets - twitter.com/uidotdev/timelines/1428028877129936899
OK I'm done. You can sign up here (it's free) - bytes.dev?s=youtube
Thank you so much!! The history of where these changes come from is very important, and one of the best videos so far in react.
As someone trying to understand the progressive changes to react this is an excellent vid
Anyone else here cause they didn't wanna watch the 1h35m video from the React Conf? :-)
Welcome! :)
like seriously all the videos are over an hour ......so annoying
I watched it but amazingly this one actually covers the history and reasonings better.
hahah!!
haha...exaclty
On of the best tutorial I've ever viewed. Thanks, these were complicated things for me, but you lighted up the dark ! :)
A great detail of the reasoning and history, thanks Tyler
Angular: makes a single evolutional change, gets loads of hate
React: changes every 2 years, everybody's happy.
How?!
Because Facebook.
I dont know Angular yet but maybe the change in Angular was tremendous and the changes in React are simple but extremly improving everything? Don't know but there is a reason for everything
Dude, it's so so so important to give perspective, thank you! This was elinghtening.
The best intro that I have seen till date. Thanks for the video Tyler. By the way, I follow your blog posts which are of the same high quality.
❤️
This is my new favorite channel. I will be subscribing to your courses. Thanks for explaining things so well.
Thanks Jason!
Many people know react hooks but to find people know how to explain it is a bit harder. Congrats!
Why did I miss this channel when I started learning react
This is awesome. Thanks for sharing but I think you also missed talking about the beautiful combination of Context and the “useContext” hook. I think these together make using something like redux or mobx unnecessary in most cases. It’s extremely intuitive and less cluttered. Thanks for your content! Really liked how you explained the history of the “why”
Thank you so much for this quick course, it was impressive! Very well explained, in just 15 min I could put words on something I experienced since years ! Subscribing now :)
Thanks for the video! I really liked how you first explained *why* instead of directly starting with "what". That made it way easier to understand the concepts.
Glad you enjoyed it. Thanks for the kind words.
what the... your skill in explaining stuff is incredible. I know hooks an i still was "hooked" on you video. :D
Glad you enjoyed it!
Just loved the way you introduced the design pattern of the hooks, and what problems it solves.
I'm actually now very intrigued to go and read the hooks part in React's source code, to know how they implemented the reactivity there.
Thanks. Keep going with what you do.
Thank you!
As most here have already said, you explained this well, covering the history, showing code samples + before and after, and the reasoning, but most importantly in a short amount of time (the primary reason I clicked this video (I will click videos that are 5min, 10min, and 15min being the max)). You also speak calmly from a neutral stance; I could not sense any frustration or whining in your tone of voice. Keep it up!
Thanks so much Ryan! Glad you found it useful.
Very clear and concise points!
This is prob the best new react video out there...gosh...the history lesson was exceptional to watch
Thank you! Means a lot.
This is so cool, so well explained, keep it up, will watch more of your channel
Thank you!
Thanks for making some of the best informational videos about Javascript and sharing your knowledge with us!
Thanks for the kind words!
@@uidotdev Thanks for Killing it!
Very useful video, absolutely nailed it, but problem is , actually very little one (not only this video), when you editing video/audio please make spaces/gaps a bit longer between end and start new sentence , even for few more milliseconds, for not english speaking people is hard to understand , to quick information goes through . But that’s happens in 80% new videos, it's kind of very popular these days :) Apart of that this is the best video ever about hooks! Good job Tyler.
That's great feedback. Thank you!
Now that solved most of my questions and mistakes i was making in react. Thank you😍
Actually I saw this at your instagram live .. but it wasnt clear.. Thanks alot for reposting this sir :)
This is a really good explanation, thank you
Excellent explanation! Awesome job in conveying the whole concept in bare 14 minutes!
Thank you!
Thank YOU!!!! I finally understand what I've been looking at for a couple weeks.
Glad it helped!
I found this video very helpful as I am new to React coming from the Angular world, Thank you so much.
Glad you enjoyed it!
Supreme explanation, looking forward to this course greatly! Hopefully you'll use async/await/error boundaries when suitable :)
I'm really impressed with the quality of explanations here. I hope this channel grows fast!! THANK YOU
Me too! Thank you!
Beautifully explained 🙏
This video is so insightful for people that have started learning React in the more recent years, amazing job! 💪💯
Thank you!
Awesome video, super well explained! I was kind of confused by "repos" though as I was thinking it was implementing the repository pattern, it might have been more clear loading "todos" or some other data that doesn't have double meaning in software.
TBH, I've never even heard of the repositories pattern. I'll check it out.
Wow, this video is great. Thanks for the really in-depth explanation.
You're welcome. Thanks for the kind words!
This is the most precise and useful video I have ever watched so far.
This video is just beautiful and gets exactly to the point! thanks for making it
Thanks for appreciating it!
Thanks so much for this, soo good!
just wow.... great explanation
Hi Tyler your explanation is awesome,thanks. Can you please make a video on es6 symbols like what are the real time use cases in our web application, where should we use in our app. Please it will be very helpful.Thank you.
this is just amazing, plain and simple
This is very informative, thank you.
You're welcome. Thanks for the kind words!
Incredible and thorough. 🚀
These problem were solved decades ago with a pattern called MVC. React is a view library, it’s not designed to handle the complexities of a large scale application. Defining models and controllers as separate entities, then using react just for view rendering solves most (if not all) frustrations with react.
OK boomer.
Thank you very much, so briefly explained everything, saved me a lot of time)
Glad I could help!
Now i understand why hooks are simple to use. Thanks
I dig the pacing /explanation of this. You might be on to something Tyler Mchelob - cheers 🍺
Thank you!
Two weeks of banging my head on internet trying to understand hooks and all it took for you was exactly 14 minutes to make me go "aha", shut down my laptop, walk out like a boss and claim that I understand what 90% of the world doesn't!
Glad it was helpful!
What ever makes you happy !!
is this video implying that arrow function were basically designed due to problems with "this" and react development? people still dont understand "this" and i hear a lot of noobie developers say they just use arrow functions to avoid that problem lol.... but it does seem like arrow functions were made to help assist react with binding lol.. perhaps im wrong tho?.... its crazy how much power facebook/react has had on the entire ecosystem. i just started learning React, luckily i started with some legacy code and im a patient learner ( i feel like wayyyy too many people don't bother watching videos like this) and its awesome to see such an in depth historic breakdown. you are so right.... understanding WHY we use something helps so much. often i learn something before asking this question and never even end up using the skill later lol
Excellent overview of hooks and, most importantly, why hooks were needed.
Really amazing video. Covered the evolution of react since it's inception, a really great way of narrating the things.
DUDE you have a gift. Holy shit. Beautifully explained. 11/10.
Really good clear explanation!!! Thanks
thanks this helped me a lot, specially looking into it from the dates perspective
Thank you Tyler!
❤️
Super informative!!
Great video, best explanation I have heard yet.
That image throwing the baby lion is very distracting. LOL.
Thank you so much
Holy divine wisdom injected. Thank you!
Thanks Tyler! Now I Love Hooks!
This is a great overview, thank you.
Nice work, great intro. Looking forward to the course!
Enjoy!
To me, one of the biggest advantages of Hook concept - is automatic cleanup in `useEffect`. That allows us to avoid race conditions relatively easily(but it's missed in sample 11:49).
Awesome! Really helped me :)
Fantastic and clean explanation
This was so good! Thank you.
3:15 if you don't want to bind the method in constructor use arrow function when you declare your function instead of regular function
4:05
very well explained the evolution of React, awesome :)
great starting animated view (dog) ... so creative...
I've also heard of composition mentioned in terms of composing functionality into classes. Is it generally speaking referring to allowance for customization? [ie. custom hooks]
Very clear explanation, subbed!
Thank you!
simple and clear !
Thank you for making this video. I think you did a great job of explaining "why" hooks exist and what problems they are attempting to fix. I still think hooks miss the target on their goal of making React better. It feels like you are just trading one set of problems for another with 2 apis you have to learn.
Instantly hooked. Great video.
Quality content every time!
Thanks Nick!
Very helpful, thanks!
You sir are a legend!
Good explanation, thank you.
Great, great.. just great!
Thank you!
@@uidotdev Thank you actually!
Best explanation for hooks !!!
Thank you!
2023 still an amazing video 🥰