React.js Hooks Crash Course

Поделиться
HTML-код
  • Опубликовано: 5 янв 2025

Комментарии • 546

  • @kr0k0deilos
    @kr0k0deilos 5 лет назад +415

    1:15 what are React Hooks
    2:49 useState intro
    4:54 useState (start of code example)
    21:11 useEffect intro
    27:38 useEffect (componentDidMount)
    34:51 useEffect (componentDidUpdate)
    38:00 useEffect (componentWillUnmount)
    41:20 React.memo (shouldComponentUpdate)
    45:29 custom hooks - sharing (possibly stateful) logic
    1:02:20 rules how to use hooks

    • @riyanshbiswas
      @riyanshbiswas 5 лет назад +9

      Thanks for the timestamps man, saves a lot of time when you come back to revise the topics.

    • @pbdivyesh
      @pbdivyesh 5 лет назад +4

      Thank you sir!

    • @muhamadimron9785
      @muhamadimron9785 5 лет назад +3

      Nice sir, thankyou

    • @njihiamark6926
      @njihiamark6926 4 года назад +2

      thank you!

    • @GooseGumlizzard
      @GooseGumlizzard 4 года назад +2

      i was totally onboard until "45:29 custom hooks - sharing (possibly stateful) logic"

  • @KooKoogm
    @KooKoogm 3 года назад +4

    He's one of those teachers who completely understands what he's going to teach and how he's going to teach... Awesome explanation.

  • @die1234abc
    @die1234abc 4 года назад +3

    This one hour video was more informative than hours and hours of reading on the internet! Thanks!!

  • @RockstahRolln
    @RockstahRolln 5 лет назад +66

    Wow.... my head is swole... so much good stuff to learn here. Thanks for this vid!

  • @ivanabregu1
    @ivanabregu1 5 лет назад +1

    Someone could tell me please Why there are 19 dislike? This explanation in the way that the concepts are added and presented is awesome. Its really notable the preparation of the content and the predisposition to teach in the best way. In IT we have a lot of jobs opportunity, while we learn more we earn more money. So we could say that every hour and every minute it's money. Here we have Max wasting his time with us, wasting his money. I can't understand those 19 f*ckings dislikes.
    Thanks Max, like always, you are amazing!

    • @academind
      @academind  5 лет назад +1

      Thanks for your awesome feedback Ivan, but I just think it's difficult to make everybody happy (especially in the internet). However, we are very very happy with the amazing feedback we get from many people, so some dislikes are ok I guess or at least something you have to live with if you create content :)

  • @JamesBond-zz1nb
    @JamesBond-zz1nb 3 года назад

    You just cleared up months of confusion and stress with just 3 minutes of video, let alone the whole thing. Thank you so much for explaining things so succinctly.

  • @jy_chen
    @jy_chen 5 лет назад

    Max does an unreal job of walking through the entire life-cycle of react hooks clearly, and emphasizing the key points.
    I couldn't have made into a React dev without him.
    Thank a lot sincerely.

    • @academind
      @academind  5 лет назад

      Wow, it's simply wonderful to read comments like yours Jianyuan, thank you very much for this support!

  • @tehdreamer
    @tehdreamer 2 года назад

    Dude, you are the best teacher on React and Typescript on youtube!

  • @harshdeepverma2903
    @harshdeepverma2903 5 лет назад +19

    Awesome Tutorial. It really helped me a lot. I liked how the two ways were compared instead of just teaching hooks.

  • @Ckwon117
    @Ckwon117 4 года назад

    good explainers are tough to come by but they're out there
    what really sets this video apart is the example project and how it naturally progresses through the basics. Almost every time i started thinking of a question, you went on to answer it right afterwards. Nice video.

  • @anindyakundu6323
    @anindyakundu6323 4 года назад

    These last 7 months sitting at home, I learnt so much about full stack web dev all thanks to you ... I'd deferred learning node, react, graphql, etc. because the other learning resources I touched beforehand were just too overwhelming. This here is pure gold!!!

  • @bebro2075
    @bebro2075 5 лет назад +1

    At first, I thought, "Oh no, 1 hour video: - /"
    But then it was over so fast, because you know how to keep us up to date and teach the stuff quickly and well.
    I have learned so much for what my teacher needs about 5 hours.
    Greate job Max

  • @juliovicenteperez7172
    @juliovicenteperez7172 3 года назад

    You are the best teacher I have seen on RUclips. You really know the topic you are explaining, and you do it with passion There are not many like you on RUclips! Infinite thanks!

  • @chetankharel4435
    @chetankharel4435 5 лет назад +149

    Max you are a great guy making good content for students like us..

    • @academind
      @academind  5 лет назад +27

      Thanks so much for your support Chetan, this really means a lot to me!

    • @damansharma6737
      @damansharma6737 4 года назад

      Yalgaar ho

  • @zmorabya85
    @zmorabya85 5 лет назад +5

    I have watched this video at least 3 times in full and may be a couple more times for specific parts of it. My deep thank you for sharing it with us.

  • @DenhamTurton
    @DenhamTurton 4 года назад +7

    thank you Max, I love your teaching style. I went straight to Academind when I wanted to learn about React Hooks. Thank you for your positive demeanour in all the videos.

  • @cargi
    @cargi 5 лет назад +30

    The absolute best video i've seen on React Hooks! Thanks Max!

    • @academind
      @academind  5 лет назад +4

      So happy to read that Andrew, thanks a lot :)

    • @alexmaslow6512
      @alexmaslow6512 5 лет назад +1

      I wanted to write the same thing

  • @clovisbueno3872
    @clovisbueno3872 4 года назад

    Watched so many videos and after 5 days breaking my mind into react hooks you really clarify how they works. Thanks for the good content and very simple and understandable explanations. Really helped me a lot!!

  • @prosenjitdas4639
    @prosenjitdas4639 5 лет назад

    Reading the official documentation of the React Hooks is scary and this video clearly explains it and make it so simple to understand...You are awesome !!

    • @academind
      @academind  5 лет назад

      Happy to read that, thanks a lot!

  • @ladydidi8725
    @ladydidi8725 4 года назад

    Maximillian, probably it is not new to hear for you, but you're absolutely stunning! Great work as always! I purchased many of your courses. You're saving lives.

  • @realoAwAo
    @realoAwAo 5 лет назад

    I was struggling to find better stuff on react hooks. You made it so easy. There is always something to learn from your videos. Rockstar.

    • @academind
      @academind  5 лет назад +1

      Wow, thank you so much Kawaljit!

  • @Scott-ur6xh
    @Scott-ur6xh 5 лет назад

    If you know React, but are looking for an introduction to React Hooks, this is the one to watch. Great video!

  • @celina6204
    @celina6204 3 года назад

    I like how you went through multiple examples, this really helped cement my understanding. Just a suggestion: It would be helpful to minimize the terminal when you're not using it so we can see more of the code at one time. Keep up the awesome work!

    • @kashmirtechtv2948
      @kashmirtechtv2948 3 года назад

      Does this video work in 2021 as well?

    • @celina6204
      @celina6204 3 года назад

      @@kashmirtechtv2948 Yes

    • @kashmirtechtv2948
      @kashmirtechtv2948 3 года назад

      @@celina6204 i have watched the complete tutorial but didn't grasp something new. Infact got more confused on the final part of video 😅
      Now shifting to his udemy React course updated in May 2021

  • @sam9758
    @sam9758 4 года назад +2

    This is the best introduction video to Hooks

  • @arunh3
    @arunh3 4 года назад

    Awesome Video. I loved how you converted instead of just teaching hooks, it really helps the viewer understand why & how.

  • @nikhilkoli5073
    @nikhilkoli5073 4 года назад

    Dude, you are God...! I spent almost a day learning about React hooks from a lot of websites and the official documentation. I landed on this video after that. You pretty much summed it all up in the best way possible!!! Thank you!

  • @msomedevil
    @msomedevil 4 года назад +1

    Incredible stuff. I was being an old man and not wanting to ditch class based components, but your very through and concise explanation of hooks were amazing and I will be using them from now on. Thanks alot man, will be checking out your other videos as well
    Edit: right after this, I bought your udemy course for React Native. Great stuff so far

  • @surajpenugonda4756
    @surajpenugonda4756 5 лет назад +8

    This is the best video i have seen for explanation of hooks in react.

  • @xSanctify
    @xSanctify 5 лет назад

    Love the way you explained, and how you clearly state that it's a keyword or we can name it whatever we want helps to identify keywords against convention

  • @ChronologicalLogic
    @ChronologicalLogic 5 лет назад

    Bought your courses on Udemy, and now looking up Hooks and you're the teacher :)) You have a knack for teaching Max. I appreciate all the updated content on Udemy and the videos you do for the community. It helps to bring the industry standard up a notch. Cheers!

    • @academind
      @academind  5 лет назад +2

      Thanks so much for your awesome support here and on Udemy and your great feedback, this means a lot to me!

  • @attilaracz8876
    @attilaracz8876 3 года назад

    I normally avoid long videos but your tutorial is very easy to follow. thank you!

  • @youssefelbieh2939
    @youssefelbieh2939 5 лет назад

    Your name is Great Max.
    In the past I hate js.. But now I am a react developer because of you.
    Great thanks for the Great German man

  • @FrankHale
    @FrankHale 5 лет назад +2

    This tutorial was broken down beautifully and demystifies React Hooks for me now. Thank you so much!

    • @academind
      @academind  5 лет назад +2

      So great to read that you liked it Frank, thank you!

  • @nathansanderson2122
    @nathansanderson2122 4 года назад

    Really appreciate you uploading this, I'm new to React within my current job and in the current climate it's tricky to figure out which is old and new standard. Thanks again, would love to buy you a coffee. Thanks:)

  • @BarakaAndrew
    @BarakaAndrew 4 года назад

    After this video I changed my whole react native app to using hooks. Its way better. Thanks for an excellent video

  • @DheerajBhaskar
    @DheerajBhaskar 4 года назад

    Wow! This cleared up so many concepts for me. Brilliant job Maximillian

  • @inaccessiblecardinal9352
    @inaccessiblecardinal9352 5 лет назад

    Excellent survey! Just started using hooks in my team's projects. Loving the simplifications to the code.

    • @academind
      @academind  5 лет назад

      Thank you, happy to read that you liked the video!

  • @sreejithp3916
    @sreejithp3916 5 лет назад +1

    Max you are a great trainer. the way of presentation is excellent

    • @academind
      @academind  5 лет назад

      Thanks a lot Sreejith!

  • @unhash631
    @unhash631 4 года назад

    This might be the best introductory video to Hooks

  • @rebecasantiago2012
    @rebecasantiago2012 3 года назад

    Awesome video tutorial is the type of thing I've been looking for,now I understand the differences, personally I prefer class components for some reason hooks seems little messy for me, but I need to keep learning , thanks 😊

  • @Spouken
    @Spouken 5 лет назад

    This is by far the best tutorial I have found on this topic. Thanks for always taking the time to make these amazing videos. 🍻

    • @academind
      @academind  5 лет назад

      Thank you so much Mike!

  • @popalaris1633
    @popalaris1633 5 лет назад

    Nice. I understood how useState and useEffect works and this is all I wanted from this video. Thanks!

    • @academind
      @academind  5 лет назад

      Happy to read that Popa, thank you for your comment!

  • @TyeTheOnly
    @TyeTheOnly 4 года назад

    I never like, subscribe, or comment but in this case, it would be criminal to get this level of content for free and not show support. Thank you so much!

  • @dzengiztafa510
    @dzengiztafa510 5 лет назад +2

    This is by far the best video about React Hooks! Kudos!

  • @IvoryEatsTheWorld7
    @IvoryEatsTheWorld7 5 лет назад

    Hero!!! Thank you so much, i have your CSS and React course and I really don't know someone who explains better than you. I bought other courses in my native language, Spanish, and they didn't explain very well.
    Thanks and greetings from Argentina
    !!

    • @academind
      @academind  5 лет назад +1

      Thanks a lot for your awesome support here and on Udemy! Happy to read that you like my courses :)

    • @IvoryEatsTheWorld7
      @IvoryEatsTheWorld7 5 лет назад

      @@academind Thank YOU for help me grow as a developer! I wish you many successes for you this year!
      Keep it up!

  • @ravinderreddykothabad2299
    @ravinderreddykothabad2299 5 лет назад

    Great video from Academind. The content is very nice and clear, and to the point, the comparison between class based components and functional components with hooks is very nice.
    Thanks Max

    • @academind
      @academind  5 лет назад

      Thank you very much Ravinder, it really means a lot to me to read that the video is helpful!

  • @KMCGamer
    @KMCGamer 5 лет назад +2

    I cant even fathom how good this video is

  • @warlordzephyr
    @warlordzephyr 5 лет назад +8

    This is the react hook video I needed. Thank you.

  • @SakhawatHossainlive
    @SakhawatHossainlive 3 года назад

    Probably the best tutorial for starting react hooks.

  • @ihortsarenko3119
    @ihortsarenko3119 5 лет назад

    I think nobody can explain it better than Maximilian. THANK YOU!

    • @academind
      @academind  5 лет назад

      Thanks a million for your awesome feedback Irop!

  • @pbdivyesh
    @pbdivyesh 5 лет назад +1

    I am not gay, but I love you man! I literally learned how to implement each and everything in my projects with hooks from this. Super recommended for everyone who is experienced or not, watch this video and learn everything.

    • @academind
      @academind  5 лет назад +1

      Wow, thanks a million for such an awesome feedback Divyesh :)

    • @pbdivyesh
      @pbdivyesh 5 лет назад

      @@academind Thank you MaxiMillian! haha :)

  • @4rled
    @4rled 5 лет назад

    The dislikes are from individuals who should not be coding in any language. This is some really good content nice one bro.

    • @academind
      @academind  5 лет назад

      It's always hard to make everybody happy Arled, but I'm very happy with the support we get from you and so many others :)

  • @Develoquent
    @Develoquent 3 года назад

    Great explanation for useEffect and custom hooks. Coming from class based components it was easy to grasp

  • @danielimodoye5688
    @danielimodoye5688 5 лет назад

    Maximilian Schwarzmüller...you are the best ..thanks for making it crystal clear

  • @thaismoraes2723
    @thaismoraes2723 5 лет назад +1

    Very clear explanation Max! Keep going with your awesome work!

    • @academind
      @academind  5 лет назад +1

      Thank you Thais, I'll do my best to keep it going :)

  • @darekgala4667
    @darekgala4667 5 лет назад +8

    Great video, you are awesome teacher, thanks!
    P.S you can set isLoading in `finally` clause to reduce duplication in `then` and `catch` :)

  • @frfancha
    @frfancha 5 лет назад

    Great video, and adding a custom hook in hooks presentation is good idea as it nicely illustrates the power of the concept. When you say we get null from useHttp because its useEffect runs after the component renders for the first time, well yes it is true but that is not the "main" reason: the "main" reason why we must be ready to handle the fact that data returned from useHttp is null in a first stage is that data in useHttp is set asynchronously, later on, when the fetch request returns. Finally it could have been nice to automatically use the url itself as dependency in the useHttp custom hook, because, essentially the url IS the dependency of the useHttp. Using the url itself to control the useEffect in useHttp would avoid to require client code to pass a dependency array.

  • @francescosaccone6378
    @francescosaccone6378 4 года назад

    AMAZING TUTORIAL ! Looked up into React documentation but I haven't seen there the part of passing a second parameter to useEffect function!

  • @info662
    @info662 4 года назад

    Didn't think I'd understand it this quick, thank you Max for this awesomeness.

  • @markreeves5561
    @markreeves5561 4 года назад +1

    Thanks Max. I have learned a lot from this tutorial. This is a great thing you are doing and I appreciate your help. Continue the good work. Thanks very much.

  • @xiaoboswift4343
    @xiaoboswift4343 5 лет назад +1

    I'm a lucky guy when I starting to learn react! Your course is amazing! Thanks so much!

    • @academind
      @academind  5 лет назад

      Thank you so much for your support, happy to read that you like the React course and React in general :)

  • @krishanmadushanka9521
    @krishanmadushanka9521 2 года назад

    Best video in youtube about react hooks. Thanks

  • @XinWongDigital
    @XinWongDigital 4 года назад

    Very nice. Thank u. If multiple custom hooks need to work together an extra controller like mechanism maybe needed. For example we can have a hook managing products and another hook managing cart. But these two have to communicate at some stage.

  • @MrGreenpaulo
    @MrGreenpaulo 4 года назад

    You're a brilliant teacher Max! Explanations are great. Thanks for your channel!

    • @academind
      @academind  4 года назад +1

      Thank you so much!

  • @nanasarathi
    @nanasarathi 5 лет назад

    You are superb Max... I always see your videos... The way you explain the concept is really good. Thanks...

    • @academind
      @academind  5 лет назад +1

      This really means a lot to me Narendra, thank you!

  • @franciscoceruti966
    @franciscoceruti966 5 лет назад +1

    Thank you so much! This is just what I needed to level my react game: a neat example with a very didactic yet not condescending. For me at a 1.5 speed was great.

  • @anthonyyershov4156
    @anthonyyershov4156 5 лет назад

    Every question I've ever had about react is answered in this video. Thank you so much Academind!

    • @academind
      @academind  5 лет назад +1

      That's just fantastic to read Anthony, thank you for your comment!

  • @skinnycarrotchan
    @skinnycarrotchan 4 года назад

    You are a really good teacher, I was able to understand everything, though custom hooks will take some more practice. Thank you for this! 🙏

  • @sagarv1997
    @sagarv1997 4 года назад +1

    This is one of the best tutorials for React Hooks!

  • @andrewcodes
    @andrewcodes 5 лет назад

    Max, as if Graphql was not good enough! Thank you very much, I have gone over the React hooks in the course that you updated. This explanation has got me to understand it though, I guess it has taken me two takes to understand it fully. Thanks!

    • @academind
      @academind  5 лет назад +1

      I can only say thank you for your amazing feedback and support here and on Udemy Andrew! Just great to read that you like the courses and videos :)

  • @IdeaOrbit
    @IdeaOrbit 4 года назад

    Max you are real techie geek and a superhero for us....

  • @sebastianweber629
    @sebastianweber629 5 лет назад

    Maximilian, you're the Dirk Nowitzki of teaching to code online. I love your Udemy courses. Thank you also for this awesome free content! Grüße!

    • @academind
      @academind  5 лет назад

      Wow, thanks so much for your amazing feedback Sebastian! I got no plans to retire at the moment though :D

    • @sebastianweber629
      @sebastianweber629 5 лет назад

      @@academind That's good :-)

  • @andrewpagan
    @andrewpagan 4 года назад

    18 minutes in and holy crap. The readability is insane with hooks.

  • @rajnayak9883
    @rajnayak9883 5 лет назад

    Really enjoyed this video specially writing modular / resuable hooks. Keep making these awesome videos!!!

    • @academind
      @academind  5 лет назад

      Awesome to read that you liked it Raj, thanks a lot for your comment!

  • @kushalbansal5508
    @kushalbansal5508 4 года назад

    This guy really knows how to teach properly

  • @jasonhughes6300
    @jasonhughes6300 4 года назад

    Thanks for the demonstration of how powerful React hooks can be!

  • @KenanArik
    @KenanArik 3 года назад

    Thanks for the great content! I have always enjoyed your videos, and needed to catch up on hooks. I appreciate the detail you go through while keeping the explanations succinct.

  • @mirkosedda3196
    @mirkosedda3196 3 года назад

    These tutorial are so great! Will buy your react course!!

  • @johnmm5146
    @johnmm5146 5 лет назад

    Hey Max. This really complements your Udemy course as a quick refresher on React Hooks. I highly commend this strategy you use of having your Udemy courses complemented by quick RUclips overviews of the material. This is great.

    • @academind
      @academind  5 лет назад

      Happy to read that you like this video and the approach John, thanks a lot!

  • @MauriceMelchers
    @MauriceMelchers 5 лет назад

    Best explanation on the feature I've seen so far. Thanks man!

    • @academind
      @academind  5 лет назад

      Thank you Maurice, awesome to read that!

  • @lvilasboas
    @lvilasboas 5 лет назад

    Awesome video, step by step and straight to the point at the same time, great examples!

  • @samuellucas7049
    @samuellucas7049 5 лет назад

    I'm currently watching your videos on Udemy, and I find them amazing. This is also a great addition to the course... Keep it up man ☺

    • @academind
      @academind  5 лет назад +1

      So happy to read that Samuel, thanks a lot for your comment and support here and on Udemy!

    • @samuellucas7049
      @samuellucas7049 5 лет назад

      @@academind you're welcome. I have a few questions to ask you, concerning my career as a software developer... How can we get to talk better, please?

  • @rendynation7392
    @rendynation7392 5 лет назад +2

    finally done watching your video... and finally understand what react hook is,
    great content anyway.. (y)

  • @mdelclaro
    @mdelclaro 5 лет назад

    You can actually pass only the URL parameter to the useHttp hook, and use it as a dependency on the useEffect inside useHttp. When you pass the selected id as a dependency, it's the same thing as passing only the URL, since the selected id changes the URL :-)

  • @wolfroad
    @wolfroad 5 лет назад

    This is one of the best react hook tutorials

    • @academind
      @academind  5 лет назад

      So great to read that Foad, thanks a lot :)

  • @vladahinski5699
    @vladahinski5699 5 лет назад +1

    Your tutorials are amazing, you're a wonderful teacher. Thank you Max 🙏

  • @tekhiun
    @tekhiun 5 лет назад

    As always your videos are great and easy to understand, it would be nice to see a video about how to use kotlin and react together

  • @aytacg26
    @aytacg26 3 года назад

    Thank you very much for great courses on RUclips and also on Udemy, the React Course was and also still is great and I also took the MERN course and will start it asap.

  • @sfincione2000
    @sfincione2000 5 лет назад

    Really nice run through of hooks. Very nice to do it via refactoring. Thanks!

  • @MrMassmaker
    @MrMassmaker 4 года назад

    watched tl-dr, rewinded a couple of times to clearify some moments.
    Thanks for the explanation.

  • @spotted756
    @spotted756 5 лет назад +1

    Thank you so much Max! I bought many of your courses on Udemy and this video is just super!

    • @academind
      @academind  5 лет назад

      Thanks a lot for your great feedback and your awesome support Davide!

  • @darshitgajjar5199
    @darshitgajjar5199 5 лет назад

    you are my heart teacher.i never miss your video course and anything. salute sir ;-)

    • @academind
      @academind  5 лет назад

      Thank you so much Darshit :)

  • @buddhikaweerasinghe4113
    @buddhikaweerasinghe4113 4 года назад

    Superb explanation. Cheers from Sri Lanka

  • @jeinernoriega7910
    @jeinernoriega7910 4 года назад

    The best instructor online!

  • @HugoPineda83
    @HugoPineda83 5 лет назад

    kudos to the best hooks materials so far! Thanks a lot

    • @academind
      @academind  5 лет назад

      Thanks so much! That's amazing to hear!

  • @Ahmed.Hadjou
    @Ahmed.Hadjou 5 лет назад

    Thanks a lot Max, your informative tutorials are as usual a perfect mix of theory and code, keep up the great work :)

    • @academind
      @academind  5 лет назад

      Happy to read that you liked it Ahmed, thanks a lot!

  • @eugene1196
    @eugene1196 3 года назад

    52:20 xDDD
    great job btw! Thanks, Max.

  • @revillsimon
    @revillsimon 4 года назад

    Awesome job Max, thank you so much 😊. I’m now looking forward to writing my own hooks now for reusable logic!

  • @danielbocelli
    @danielbocelli 4 года назад

    Thanks so much! I’m just now getting into react again and I was so confused but this helped a lot.

  • @SaveTheWhales5
    @SaveTheWhales5 4 года назад

    Really great video. Helps to see the conversion from a class component