Fun with React Hooks - Michael Jackson and Ryan Florence

Поделиться
HTML-код
  • Опубликовано: 3 май 2019
  • Michael and Ryan from ReactTraining.com will give a joint presentation covering hooks and some of the concepts from their training.
    Deepen your fundamental understanding of React's composition model and dig into some advanced, real-world use cases like animating route transitions, manage data caching, and real-time updates.
    We'll also be covering React's latest feature, hooks, in depth. Hooks promise to simplify your React code and make building clean, reusable abstractions easier and faster than ever.

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

  • @AmandeepSingh-dt2qc
    @AmandeepSingh-dt2qc 5 лет назад +24

    I really loved the MJ's part. He nailed the best selling point of hooks--composition. Thank you guys .

  • @kandhankuhan973
    @kandhankuhan973 4 года назад +10

    Amazing presentation! First 20 minutes covers the mental modelling of hooks and the next part covers the awesomeness(how it can be composed and be used for almost anything) of it.

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

    This talk is fantastic. Very useful examples on composing custom hooks

  • @ThePerro
    @ThePerro 4 года назад +4

    Props to Michael for not shortening his first name to Mike

  • @AndrewVasquez0113
    @AndrewVasquez0113 4 года назад +10

    I knew hooks were great before but seeing the composition part just changed my life

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

    Ryan is a talented teacher!

  • @nissieln
    @nissieln 3 года назад +1

    Very informative and fun presentations as usual

  • @saurabh75prakash
    @saurabh75prakash Год назад +1

    Awesome introduction to hooks, thanks.

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

    Michael presentation was awesome.

  • @roselpadilla
    @roselpadilla 3 года назад +1

    The amount of shade in this talk from Ryan is hilarious.

  • @wordythebyrd
    @wordythebyrd 4 года назад +50

    Legit first time I've watched someone code in vim.

  • @mohamedrifkan6577
    @mohamedrifkan6577 Год назад

    His confidence is next level 👍

  • @tijldeclerck7772
    @tijldeclerck7772 3 года назад +5

    The Michael part was a serious eye-opener for me.

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

      you probably dont give a damn but does any of you know a trick to get back into an instagram account..?
      I was stupid lost my login password. I appreciate any tips you can give me!

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

      @Chandler Moshe Instablaster ;)

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

      @Achilles Arturo i really appreciate your reply. I got to the site thru google and im waiting for the hacking stuff atm.
      I see it takes quite some time so I will reply here later when my account password hopefully is recovered.

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

      @Achilles Arturo It worked and I finally got access to my account again. I'm so happy:D
      Thank you so much you saved my ass !

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

      @Chandler Moshe no problem xD

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

    if you put the ++ in the backend then it ... but if you put it in the frontend it returns also the value. Great terminology! :D

  • @josephjoey3904
    @josephjoey3904 4 года назад +4

    Source code of all speakers? Particularly the second one with the calendar thingy 😍

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

    Nobody:
    Someone teaching React: Look at this COUNTER

  • @DarkNenyk
    @DarkNenyk 5 лет назад +29

    It's kind of sad that audio in Michael's part is not synced with video :( Still watched tho, awesome job guys!

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

      Yeah, bummed that I missed that during editing :/ I don't really want to replace the video though since it'll get a new URL.

    • @gulshansaini5279
      @gulshansaini5279 5 лет назад +10

      @@dceddia please upload and give url in description of this video

    • @VilhelmNielsen
      @VilhelmNielsen 4 года назад +4

      If you can manage to open this video in VLC, than you can adjust the audio delay to around -1300ms, then it syncs up.

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

      @@dceddia create a new video with a new title url etc.

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

    Awesome

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

    "tuplé" I've lost on it

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

    That syntax theme is amazing. What's it called? (Great presentation and all.. :) )

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

    Oh my god, I always forget that if you move the double plus' before the variable name it adds one and returns the value. lol

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

      Then you should recheck infix, prefix(this one) and postfix (the ones we've been using) notations

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

      Then you should recheck infix, prefix(this one) and postfix (the ones we've been using) notations

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

    Ryan has explained very well about react hooks which might solve the bug of re-rendering of useState while used with useeffect. Thanks Ryan 🙌

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

    Did you catch the bug that slipped in the hooks version?

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

    So subsribetopost does not call the callback when cleaned up? Because that will be setState on unmounted component a.k.a memory-leak.

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

    I wonder how many people in the audience got what he's saying... Because it took me about a year to really get what he's sowing there lol :D
    Examine me chat: Hooks are a way of sharing stateful logic before hooks the patterns for sharing stateful logic were HOC's and render props but they had their drawbacks and weren't as clean as hooks. This is how I understand it.

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

    Kick a$$ presentation

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

    I am just learning front end, I wish I will be that fast on my keyboard and text editor one day

    • @igorswies5913
      @igorswies5913 3 года назад +1

      he uses vim which makes text editing so much faster

  • @perc-ai
    @perc-ai 5 лет назад +7

    We just left Redux and implemented React Hooks only!!

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

      I heard that one when new Context API was introduced, and Redux is still around

    • @perc-ai
      @perc-ai 5 лет назад +5

      @@chethelesser if you are already using redux at production level, dont leave and refactor for hooks. But any new projects at this point are questioning if redux is needed.

    • @Glinkis
      @Glinkis 4 года назад +6

      Context can not replace redux until you can subscribe to partial state changes.

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

    cool

  • @dallas-cole
    @dallas-cole 4 года назад +46

    I came here for a moonwalk, and I left very dissapointed.

  • @afj9966
    @afj9966 4 года назад +5

    46:23 umm the function could be shorten...
    46:30 also the return ...
    46:48 wait... you can replace the arrow func with one param by the func name only????????
    47:00 what's going on in that one line of code...
    BIG WOW

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

    SetState actually seems more like magic than hooks to me.

  • @farisraz9448
    @farisraz9448 5 лет назад +36

    I clicked thinking this had something to do with the singer Michael Jackson, lmao.

    • @Ograws
      @Ograws 5 лет назад +7

      Me too! I thought to myself "what does programming have to do with Michael Jackson?" 😂

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

      hee heee!

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

      Neptune Michael ??????

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

      May this encourage your faith
      facebook.com/esther.chester77/videos/1029971633787995/
      ruclips.net/video/mIxKl9KYwNU/видео.html
      m.facebook.com/story.php?story_fbid=2582272895211292&id=490097534428849
      m.ruclips.net/video/EE2sJ-WIfts/видео.html
      ruclips.net/video/Qw2hwcocVvM/видео.html
      m.facebook.com/story.php?story_fbid=777934336005747&id=100013675634259

  • @can.slaughter
    @can.slaughter 3 года назад

    12:27 Yes, but actually no. When you do ++x it adds 1 to x and evaluates to its previous value. x++ is the same except it evaluates to the new value of x.
    For example:
    console.log(x++);
    is the same as
    x = x + 1;
    console.log(x);
    and
    console.log(++x);
    the same as
    console.log(x);
    x = x + 1;

  • @MinusTechTips
    @MinusTechTips 5 лет назад +7

    Why is Ryan so cool?!

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

      Nothing useful from his part, just a default hooks introduction

  • @3skladniki
    @3skladniki 4 года назад +2

    is there a source code somewhere i can check?

  • @Pareshbpatel
    @Pareshbpatel 2 года назад +1

    {2022-03-16}

  • @roselpadilla
    @roselpadilla 3 года назад +1

    I thought this was a video of Michael Jackson, The King of Pop ®, coding 😐

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

    Where is Michael Jackson?

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

    "How do you think French people write their code!? " .... "in English.."

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

    In Video title: Michael Jackson 🕴🏻In Video content: Satya nadella 👨🏻‍💻

  • @ThomazMartinez
    @ThomazMartinez 4 года назад +5

    Oh that crap MacBook Pro keyboard... the sound is so annoying

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

    The guy in the background is trying way tooo hard

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

    This is all just Monads lmao.

    • @roselpadilla
      @roselpadilla 3 года назад +1

      Yeah be these are all JS developers lmao

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

      @@roselpadilla \x -> lmao

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

    Spected some hee hee's, very disapointed

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

    just painful to watch a vim user holding j and k to scroll tens of lines down and up, please use ctrl+d ctrl+u instead. otherwise excellent presentation...

    • @ryanflorence6910
      @ryanflorence6910 4 года назад +15

      But then only I know where I jumped to and not the audience. There is a difference between presenting and coding by yourself. But solid vim tip otherwise :)

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

    I prefer Angular :) You guys write functions and call it Hooks... damn Stoneage coders.

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

      First understand what is a hook and how it's used and then talk thick boy

    • @anonymoususer5402
      @anonymoususer5402 3 года назад +2

      Because you don't know why the word hook is used. If you prefer angular then it's good but don't just speak rubbish

    • @can.slaughter
      @can.slaughter 3 года назад +1

      Hooks and Components are not just functions.

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

    Watched the first twenty minutes.. gained nothing 👎