Learn React In 30 Minutes

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

Комментарии • 1,6 тыс.

  • @WebDevSimplified
    @WebDevSimplified  5 лет назад +135

    Make sure to checkout my full React course for more in depth explanations and projects with React. It is the best content I have ever created. courses.webdevsimplified.com/learn-react-today

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

      How often do you send out emails to your newsletter distribution?

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

      In India, it is 4000+ rupees 😭

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

      Nice one, practical and hands on.
      Take a look at this too --
      ruclips.net/video/-3G0LZlbUis/видео.html
      Simplified, very basic and from the ground up,

    • @joaoalegria7578
      @joaoalegria7578 5 лет назад +15

      Thank you so much for this crash course Kyle, I know the basics and took an udemy older course and the ammount of info you put in 27minutes is unreal. I would only recommend adjusting the variables names, for a beginner it must be incredibly confusing hearing and writing everything as "todos/todo", other than that well done my friend, after I get my 1st react dev job I will probably buy your course! :)

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

      Thx for the Video!

  • @lemargreen6049
    @lemargreen6049 3 года назад +845

    Thank you, for taking the time todo this

  • @jardinek2121
    @jardinek2121 3 года назад +432

    QUICK TIP: Make sure your playback is at least 1.5 times speed, if you want to become fluent in Todo language.

    • @bvaroni
      @bvaroni 3 года назад +3

      lmao

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

      Lol

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

      i thought at first i will attempt this, but after few seconds of figuring out how big every directory is, i thought i rather wont

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

      I don't think were in Kansas anymore, todo... I mean todo.

    • @re8nifle
      @re8nifle Год назад +3

      The word "todo" has lost all meaning for me!

  • @mr_matata
    @mr_matata 4 года назад +1111

    so many *Todo* that i don't understand what todo and what not todo
    "cries in todo"

    • @yashwanthcb
      @yashwanthcb 4 года назад +27

      create a todo item of cry

    • @kendriip
      @kendriip 4 года назад +36

      Are you sure crying is the right thing todo

    • @printchannel_name3371
      @printchannel_name3371 4 года назад +26

      glad im not the only one Todo that

    • @kendriip
      @kendriip 3 года назад +13

      @@CurrencyTradingCards same i dont even want to learn it anymore

    • @Priyanka-cy3zw
      @Priyanka-cy3zw 3 года назад +1

      😂

  • @X-13-X
    @X-13-X 3 года назад +336

    In case anybody has problems with uuid. importing it like in the video didn't work for me. In the git repository it said to import it this way:
    import { v4 as uuidv4 } from 'uuid'
    That worked.

  • @MothBallsYT
    @MothBallsYT 2 года назад +14

    Wow, this is so convoluted for no reason. Perfect example for why meaningful variable names are important.

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

      what's convoluted?

    • @MothBallsYT
      @MothBallsYT 2 года назад +8

      @@InfectedEnnui todo todo todo todo, everything is named todo

  • @hansschuijff
    @hansschuijff 2 года назад +617

    Great lesson, but I had two problems with the code.
    1. the import of uuid should now say (according to their readme)
    import { v4 as uuidv4 } from 'uuid';
    2. There is a problem with the react.strictMode in that the code in de video doesn't restore the todos from storage correctly.
    Although removing strictmode solves it, I also watched your react hooks video in which you explain how to correctly call the setState functions and why it otherwise doesn't do what you might expect when called more than once.
    So it seems in this case the setTodos in the useEffect that initializes the todo's should say:
    setTodos( prevTodos => [...prevTodos, ...storedTodos] );
    instead of
    setTodos(storedTodos)
    After that change the function will restore the todos even in strictmode.

    • @AlanJaison1
      @AlanJaison1 2 года назад +39

      You sir are a legend! was stuck on problem 2 for so long

    • @ourcore
      @ourcore 2 года назад +11

      Thanks for the setTodos() fix, but mine has a bug where the todos are duplicated on their own, even with their IDs, when I update the code. Not sure if it's related to this

    • @ourcore
      @ourcore 2 года назад +5

      @@zachboemer4008 Just disabling strict mode and using the original `if (storedTodos) setTodos(storedTodos)` fixed it for me

    • @suckerformimi
      @suckerformimi 2 года назад +7

      Why is this workaround necessary? I don't see how React is usable if this simple save and reload code doesn't work in strict mode.

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

      thanks to you

  • @garagavia
    @garagavia 4 года назад +576

    I really like the speed and precision of this tutorial. A lot of tutorials are slow and not very concise. However the variable naming and overuse of the word "todo" made it way less simple than it could have been.

    • @JacobAuthier
      @JacobAuthier 2 года назад +66

      todo todo todo

    • @CrazyPlumGaming
      @CrazyPlumGaming 2 года назад +52

      Came here to say the same thing. Trying to differentiate between 4 different “todos” names and learning what each one does was very challenging.

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

      @@CrazyPlumGaming that's what you get when you skipping Javascript lessons, its easy to see it if you know basic javascript

    • @CrazyPlumGaming
      @CrazyPlumGaming 2 года назад +31

      @@kodiak809 do you feel better now? That’s what you get “when you skipping English lessons”. It’s easy to type a reply when you know basic English.

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

      @@CrazyPlumGaming in what world is english lesson relevant to programming?

  • @nsharma4981
    @nsharma4981 4 года назад +33

    There was so much of well explained info jam packed in 27 minutes! Definitely need time to absorb it all coming from just vanilla js, but wow Kyle! This was a great intro, and I loved how you covered soo many things and explained each of them too. As always, thanks a ton!

  • @CAPS_AMERICA
    @CAPS_AMERICA 4 года назад +68

    One of my TODOs is to learn React. cheers

    • @coreyknight9272
      @coreyknight9272 6 месяцев назад

      This dude is horrible teach...horrible tutorial. Folks there are WAAAY better tutorials from folks that make it way easier and don't intentionally try to make it hard.

  • @2ru2pacFan
    @2ru2pacFan 2 года назад +10

    I'm in a Bootcamp and I've learnt from your one video than I did in a whole week! No doubt your the best teacher when it comes to the Web 🔥

  • @tigercore
    @tigercore 5 лет назад +1492

    The word Todo has lost all meaning

    • @sneezydeezymcdeluxe7015
      @sneezydeezymcdeluxe7015 5 лет назад +62

      I'm currently doing the watchandcode JS course, which also has me building a todo list. After I don't know how many hours, the word todo is just so weird to me now.

    • @woutjuh13
      @woutjuh13 5 лет назад +141

      Maybe they don’t know what else to do

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

      @@woutjuh13 lol

    • @jovialdeveloper3908
      @jovialdeveloper3908 5 лет назад +34

      Todo, I don't think we're in Kansas anymore.

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

      good to beginners like me, we can focus on learning React rather than designing app- i started with the full course, felt React is so complicated! just because the recipe book app is too many components to do

  • @stricklybisnez3296
    @stricklybisnez3296 4 года назад +26

    I was doing good until minute 18 everything went side ways and i realized i wasn't sure what i was doing
    thanks for the introduction to these concepts im sure in the future it will help me recognized patterns in react use

  • @robertn4996
    @robertn4996 Год назад +129

    I did struggle a lot to learn React. I wasted a lot of time.
    The problem? I did not know the basics of Javascript in first place. You need to walk before you can run.
    So I took a few very basic books (books, not complex tutorials!) and learned the fundamentals.
    After I learned the basics of Javascript, learning React became much easier.
    Edit: For those asking about the books, for the very basics I learned with Javascript In Less than 50 Pages.
    And to develop my knowledge I learned with Head First Javacript Programming.

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

      Head First is actually a great series to get your start in most programming / scripting languages.

    • @lukas.webdev
      @lukas.webdev Год назад

      Congratulations! 😉

  • @PeterBernardin
    @PeterBernardin 4 года назад +350

    Everyone here is complaining about how many todos he said I'm just here appreciating how clear he is when he explains!!

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

      Agreed with the two above!!!

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

      So true!!!

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

      Yes 100% true

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

      lucky you. I failed dismally at this one. Maybe this is not for me

    • @hil449
      @hil449 3 года назад +16

      he explains well and the pacing of the video is really good but the naming is poor af

  • @cptCrax
    @cptCrax 4 года назад +33

    This was exactly what I needed! Thank you! I think the best part was the careful order in which you introduced things -- one complication at a time with a simple description of how we handle it in React. This format worked really well for me.

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

    Man... it's amazing the way you explain things. I've had my fair share of courses that are almost only "see me doing and copy". But you actually explain stuff even though your lessons are still quick. Congratulations, really beautiful stuff.

  • @audriusbaranauskas6498
    @audriusbaranauskas6498 4 года назад +11

    Great tutorial. No "just copy this code, because it would take too long to explain" parts. Solid delivery on what is promised.
    I've been scouting the interwebs for a few hours trying to grasp react and this is what made it click for me.

  • @yogajourney9519
    @yogajourney9519 4 года назад +29

    Thank you for the helpful video. As others suggested, it might be a good idea to use more variety when naming the variables, components, etc. to help out beginners (like myself) who easily get confused. I still found this very helpful, so thanks!

  • @KETANRAMTEKE
    @KETANRAMTEKE 4 года назад +219

    Amount of topics packed in this 30 minutes is impressive

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

      these

    • @WantOxide
      @WantOxide 2 года назад +5

      Also the amount of useless stuff is great

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

      +1

    • @eobardthawne6903
      @eobardthawne6903 10 месяцев назад

      ​@@WantOxide Is useLess also a react hook?

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

    Amazing example. Finally React starts to make sense to me. For other beginners, you must have already taken full JS, HTML and CSS courses, know how a basic ToDo app is built without React, then put this video on 0.75x. Then things will start to make sense and you would be able to follow.

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

    I blindly started working on a React Project yesterday as it‘s the way I often learn programming languages. Even though I was on a good way I turned to RUclips for a bit more help as it was getting very tedious. This was so great, you explained so many concepts and mechanics in such short time! Thank you for making my WebDev World a bit brighter :D

  • @timstern1540
    @timstern1540 2 года назад +150

    Small thing I ran into: When trying to load tasks from storage be sure you do not have React.StrictMode enabled. It will cause the useEffect block to run twice which will prevent tasks from reloading correctly.

    • @bladex9061
      @bladex9061 2 года назад +10

      That was really helpful! Thanks! was stuck at this part for about 2 hours, checking through my code and wondering why!!

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

      @@bladex9061 same!

    • @theaceforum
      @theaceforum 2 года назад +6

      you saved me like 2 hours of troubleshooting

    • @suti1979
      @suti1979 2 года назад +6

      4 hours of troubleshooting...

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

      I removed the React.StrictMode in index.js but it is still preventing the tasks from loading... not sure what could be wrong

  • @ZakkPanzermensch
    @ZakkPanzermensch 5 лет назад +653

    1. TODO
    2.
    TODO
    3. TODO TODO TODO TODO TODOOO
    (pink panther theme)

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

      Lmaoooo😂😂

    • @실험맨
      @실험맨 4 года назад +2

      Just following

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

      The fuck 😂😂😂

    • @1randumbguy
      @1randumbguy 4 года назад +6

      this video is useless due to all of the 'todos'...he should make them unique so a person can understand what is what...

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

      🤣🤣🤣🤣👌🏻

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

    The best tutorial to understand the react js, voice is very clear and confident. instead of learning i was trying to learn his style of speaking. Very clear and profound.

  • @franjomaric7913
    @franjomaric7913 3 года назад +15

    In case someone else is having issues with importing uuid as he did in example(for me it didn't work), here is how it worked for me
    import { v4 as uuidv4 } from 'uuid';
    Great tutorial btw

  • @peteraliciastuart5807
    @peteraliciastuart5807 2 года назад +8

    This was my first bash at React! Great tutorial & well explained. Now I have a million other questions but will get to know the framework better as I use more! Will defos subscribe!!! Merry Christmas from Scotland :)

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

    This was everything I’ve been trying to understand the past few days in one video!! Thank you so much!

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

    Thank you so much for creating this video. This saved me tons of time to learn react in a short period of time.

  • @kose241
    @kose241 4 года назад +46

    Great video, one thing to note if anyone made the same mistake, the useEffect function that saves the state to local storage must be placed below the useEffect function that retrieves the existing/previously stored state. Otherwise, you'll have the useEffect function that sets the current state set it to empty(since it hasn't retrieved the local todos) and you're saved todos won't show on refresh.

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

      Thanks this saved me

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

      Thank you so much, thought it was a strict mode issue but this fixed it.

    • @shree4641
      @shree4641 Год назад +2

      I had already placed it below the getItem useEffect but still it saves empty [] to todos, for this i had added an if(todos != " ") condition before the setItem line and it solved the issue. You can try this.

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

      @@shree4641 thanks that worked

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

      Oh God you saved me

  • @birbcoding
    @birbcoding 2 года назад +7

    If you are watching this now in 2022, after npm i uuid
    you need to do
    import {v5} from "uuid";
    and use v5() function in id:

  • @CodeInspire
    @CodeInspire 3 года назад +3

    Everything was great before I start reading the comment. Now. I just hear todo, with todo, does todos :)
    Thanks for the video :)

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

    Best ever! 30 mins react tute in youtube! thank you very much! take my word for this is the best video !

  • @ANILKHANDEI
    @ANILKHANDEI 4 года назад +11

    Thanks for creating such premium content for free. I have learnt a lot of important web dev concepts from your videos. This is short and simple intro to React. I like this one.

  • @myname-mz3lo
    @myname-mz3lo 3 года назад +2

    if (todo > todo || todo < todo) {
    return todo
    }

  • @uxlordsimplifyingdesignpro5544
    @uxlordsimplifyingdesignpro5544 4 года назад +27

    This video was so helpful to me. I’m a ux /ui designer and was working to study typescript and react. This video got me understand the basics. Thanks for making this! 🙏

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

    One of the best intro to react videos I've come across so far.

  • @lacherdaniel
    @lacherdaniel 4 года назад +194

    take a shot everytime he says todo

    • @The_Soup_Wizard
      @The_Soup_Wizard 4 года назад +13

      No thank you, I would like to live.

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

      Am now an alcoholic

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

      That wasn't a good idea, I am writing this from heaven.
      JK!
      In hell.

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

      @@ashleywilkonson386 you really weren't supposed "to do " that

    • @ff-tg2vy
      @ff-tg2vy 3 года назад

      not everyone is alcoholic homeless piss of shit

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

    That's mind boggling explanation?
    I can explain back even in sleep. Kudos to you

  • @DamianTew
    @DamianTew 3 года назад +7

    Your videos are great. I'm quite new to programming and I find the level of detail excellent. You explain the parts many others skip, and actually show how things work. Thanks for making these!

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

    Thanks for this! Couldn’t really follow it but I will watch on repeat

    • @lukas.webdev
      @lukas.webdev Год назад +1

      Now that's what I call motivation. Keep it up! 😉

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

    i can't even speak in my mother language for 5 minutes without any pause or a little bit stutter while speaking fast.
    big applause to this guy for talking not only smoothly but also doing that for about 30 minutes.
    wow.

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

    10/10 - fast, no droning, to the point.

  • @SameenIslam
    @SameenIslam 4 года назад +471

    A decent tutorial ruined by poor variable naming choices. Calling every variable ‘todo’ doesn’t help simplify data flow related concepts to beginners. Hopefully you’ll take this into account in future vids.

    • @marknguyen606
      @marknguyen606 4 года назад +28

      my head hurts.. i had to pause to see where it all connects.

    • @shangshi6286
      @shangshi6286 4 года назад +30

      @@marknguyen606 I think he is too fast, if he slows down and explains every data flow like we are idoits, that way is better and more clear.

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

      You got a major point. I stopped watching the moment I started hearing the word todos every single second. Most channels of this type create a content but don't actually put themselves in an audience perspective.

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

      Absolutely agree. Perhaps a better approach would have been to use suffixes e.g. todo_prop, todo_item or something among those lines.

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

      @@shangshi6286 ..you can reduce the play back speed !!

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

    I am not a react beginner. Was just watching while eating and really learned a few new stuff. Thanks!

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

    This is jam-packed React and JavaScript goodies. Thank you for sharing. Learned a lot in 30 minutes.

  • @ThomasKupracz
    @ThomasKupracz 2 года назад +2

    Great overview. Thank you for this tutorial. The amount of stuff you cover in 30 mins is sick!!!

  • @keithlamontdavis8047
    @keithlamontdavis8047 5 лет назад +15

    This was a great lesson. Excellent, clear and direct teaching. Thank you.

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

    For those using this in 2023, this tutorial is still mostly valid BUT since it's react 18 ReactDOM.render() isn't supported and you have to use
    const root = ReactDOM.createRoot(document.getElementById('root'));
    root.render(

    );

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

    This video is freaking awesome... I just followed it and it is just plain perfect. I'm buying the course now even with Argentina's Exchange Rate...

  • @srinivasnahak3473
    @srinivasnahak3473 5 лет назад +13

    You're an amazing teacher with amazing hair.....😃

  • @Jef-ur7zv
    @Jef-ur7zv Год назад +2

    for people watching it now. Import import { v4 as uuid } from "uuid"; and use ` return [...prevTodos, { id: uuid(), name: name, complete: false }];`
    if you have any issues

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

      wish I saw this comment before fucking around tog et this right cheers!

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

    Alert: while importing uuidv4 use this code instead:
    import { v4 as uuidv4 } from 'uuid';
    it works well !!

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

      Thank you so much! This helped!

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

      This comment should be right at the top

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

    At about 22:20 I did not have anything in my list yet and the parse produced an error. To fix it, parse the storedTodos in the if (storedTodos) line. Then it will work. Great hands on tutorial. I'm subscribing.
    Great audio, great voice, excellent progressively working through the app creation.

  • @Riguintantrix
    @Riguintantrix Год назад +4

    So in minute 22 i wasn't able to recover correctly the todos after refreshing . Doing some debuggin seems that the setItem was running 2 times. This was because the if statement that check for storedTodos will always resolved to true even if the array was empty, efectivly clearing the array. I had to check that the length of storedTodos was greater than 0 inf the if evalutaroand then it would work correctly.

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

      this!! you're a life saver. I'm confused as to how his code ran the way it did with this error?

    • @Sky-lc1ew
      @Sky-lc1ew Год назад

      BUMPP!!

  • @anton-haskevych
    @anton-haskevych 2 года назад

    OMG!!! THE BEST REACT GUIDE EVER!!!!!!!!!!

  • @shinichi9do
    @shinichi9do 5 лет назад +130

    my ear tired hearing 'to do' 😂😂

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

    One of the best breakdowns I have seen in a while. Straight to the point and not just coding harp hazardly

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

    A-W-E-S-O-M-E teacher. Congrats!!!

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

    The concept of persisted data is a hard one to grasp. This cleared it up a bit as far as local storage even though it wasn't the information I intended to mine from this video lmaooo . This proved to be more useful than expected

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

    Man thank you so much, I hope to see a complete React course coming quite soon, I like how you explain complex things.

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

      I already have a complete React course on my website linked in the description.

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

      Kyle is there a coupon code you have handy for your course?

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

    Great instructor, clear words with a clear voice. not too fast not too slow. the best possible speed. Thanks

  • @yojona
    @yojona 5 лет назад +320

    Video speed 2X: Learn React in 15 minutes ;)

    • @vik8860
      @vik8860 5 лет назад +74

      that would be an example of what not "to do".

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

      Lmao

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

      1.25x ain't so bad, just sayin 😁

    • @dynerushd7517
      @dynerushd7517 4 года назад +12

      Install video speed controller and put it to 10x to "Learn React In 3 Minutes"

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

      @@patrickwalsh9444 Learn React in 24 minutes! :)

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

    So much to learn, I think I'll put this on my Todo list.

  • @m.haydar.mosawi
    @m.haydar.mosawi 5 лет назад +7

    I have a question, why did you use useRef to get the input value while you can access it from event.target.value ?
    Thank you for the tutorial, you make the useEffect more clear to understand, really thanks.

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

      While it's true that 'e.target.value' can be used to grab the value of an input element, he's applying the event listener to the button element instead of the input element. When the user clicks on the 'Add Todo' button, the button element is what 'e' would be referring to when it's passed into the 'handleAddTodo()', thus, 'e.target.value' wouldn't give the input value since that value comes from the input element and not the button element.

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

    the first 15 mins it was very clear to me ... but after that it started to be very complicated with the word TODO ..
    we all know u r a beast but it would be better if you choose other words than todo and be a bit slower so we the beginners could understand you way better
    anyway thnx for the vid and try to be a bit slower cuz i think 70% of ur followers are beginners :)

  • @prajwaldeepkhokhar7416
    @prajwaldeepkhokhar7416 4 года назад +45

    9:30 min and am already completely lost pulling my hair. I wanna die

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

      So am I😭.it's been three months since you posted this comment,are you a react dev now ?????

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

      If you wanna understand how useState works (and you know JS) check this vid out. (the first half):
      ruclips.net/video/1jWS7cCuUXw/видео.html

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

      I gave up

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

      @Nickolas Gettel what software know how do
      Have under your belt?

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

      @@keerthanaanandan6062 it's been 6 and am still lost af LMAFOOOOOOO

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

    VERY COMPREHENSIVE TUTORIAL, Thank you very much :)

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

    Great tutorial! Very succinct and clear :)

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

    My man... You saved my ass a ton of time, this is what i need to learn react, all in 30min...
    I really appreciate

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

    Another Awesome video!
    Note :
    Viewers have some knowledge on react components, Props & hooks to understand the code

  • @8xnnr
    @8xnnr Год назад

    Man I really appreciate these guides , you do a great job of explaining.
    The only criticism I have is that at one point in the video my mind went blank from all of the "Toodos" and I just stared at the computer screen for a good solid minute trying to figure out what reality I am in.

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

    I loved this tutorial. I start my first IT job on Monday (so excited!), so I'm doing projects to refresh some stuff, and your video was so helpful!
    PS: i followed a lot of your videos while learning and you're the best!

    • @farter134
      @farter134 2 года назад +2

      How is the new job🎉?

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

      @@farter134 it's great!! The office is amazing, they let us wear slippers to work lol 😂

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

      @@candym5280 how is that possible?

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

    Thank you, dude! Even though the process of creating a react app has changed a little bit, I actually was able to run it! I've watched a couple of videos on the Internet but it's only you who helped me out! Thanks!

  • @kamel3d
    @kamel3d 3 года назад +26

    As a dev you should have used better names instead of calling everything todo

    • @infrakazos
      @infrakazos 2 года назад +2

      I think he knows what todo

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

    Fastest way to learn React. Thank you dear

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

    How the eff did you learn all this with only one head?
    This will be my foundational video for learning react.

  • @JackJones-ed1dx
    @JackJones-ed1dx 2 года назад

    the sheer amount of "to do" and "to do's" .... holy fuck. great video man

  • @samiam.402
    @samiam.402 3 года назад +23

    If anyone started having errors after import "uuid" it turns out the way to import has been update slightly. Now import it with "import {v4 as uuidv4} from 'uuid'" and I was able to run my script again. Hope that helps someone out there.

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

      Yup came to write the same thing. Glad someone already pointed it out ! Thank you :D

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

      thanks man!

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

      Oh THANK YOU!

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

    this is great, I am a C# dev that has recently been working a lot in Vue and wanted to learn more about React. Learned a ton in this video, excellent tutorial!

  • @AlexTechie
    @AlexTechie 5 лет назад +48

    I bet the word "task" was at the tip of your tongue the whole time while making this video. 😉 Side note: the variables/object names are way too similar, making it tough to keep track of what they represent. We still appreciate the video, though. 👍❤

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

    Great video my man. I really appreciate that you made this great intro free of charge.

  • @tyland777
    @tyland777 4 года назад +80

    The word todo was use so many times. I got lost. Should have used another word when it was possible. Didn't watch til the end

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

    Excellent Tutorial! I found it to be so helpful just to watch someone quickly create a simple app. It really helped me put the pieces I've been learning into perspective.

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

    Damn, this guy can win a staring contest. How can u not blink?

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

      He is not a human, he is a todo machine.

    • @sara-wing
      @sara-wing 4 года назад

      what? I see him blinking every few seconds ...

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

    My head is spinning after every todo, great explanation btw Kyle.

  • @Joseph-qb1es
    @Joseph-qb1es 5 лет назад +4

    Buy his react course. NOW!

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

    Unbelievably clear and easily understandable. You have a gift!!!! Thank you!!!

  • @mohamedshahid6063
    @mohamedshahid6063 5 лет назад +14

    Please make one more on REACT REDUX.

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

    This is an excellent 20K foot overview to get the basics and move on to more in-depth material later.

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

    oh man, i was starting to get it at the beginning but there were so many todos thing it just got super confusing.

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

    This was very helpful. Kyle, you are a gifted teacher, breaking down concepts so people can understand. Thank you!

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

    "And now what you have to do is to make a todolist that todo is todo tOdO todODOtoTOdotO"

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

    Amazing work there. I just tried to play in 0.75x as I was watching and doing at the same time. This helped big time, thank you so much!

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

    Great fast tutorial, I'm needed to learn this framework. so i could help my customer...

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

    I’m going to make a tutorial on React… todotodotodotodotodotodo

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

    Ty so much, I just know basic html, css and js and react was always something confusing and scary.. But this rlly helped me understand react a lot more

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

    this has got me so confused, do you have another simple project without using the word todo so many times lol :)

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

    Thx for thanking the time to speak slowly. I could follow you perfect.

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

    This felt less efficient than using regular HTML & JavaScript. But it’s probably because of how small the project was. It does look like it would make a project a lot easier to scale though.

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

      In a bigger project it’ll be even less efficient.

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

      @@aammssaamm So why do people use it then?

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

      @@aammssaamm I’m not being sarcastic, just trying to understand

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

      @@henriqueb5637 money. nearly all modern sites use react so best chance getting hired that way