React JS Crash Course

  Рет қаралды 3,488,350

Traversy Media

Traversy Media

Күн бұрын

Пікірлер: 2 900
@TraversyMedia
@TraversyMedia 3 жыл бұрын
React Router has been updated to v6. Check out this video to see the changes for this project - kzbin.info/www/bejne/oWO9nGiZl86Nnsk
@folashademustapha2474
@folashademustapha2474 2 жыл бұрын
Hi Travesery media, Thanks a whole lot for the tutorial. It helped a whole lot. One request I will really appreciate is if you can do a very short video on how to edit a task that was already submitted just like you did the toggle reminder aspect of the app. Thank you.
@EmanSh7894
@EmanSh7894 2 жыл бұрын
٨حك نمحح٩جمحممحجك
@williamssynergyinc.1381
@williamssynergyinc.1381 2 жыл бұрын
I have been trying to get your courses on Udemy which come with a 77% discount severals of time, but due to restrict of international payment via Debit Card in my country Nigeria, am not able to. Is there a mean you can grant me access to your React Front To Back 2022 and pay with a Fiat or Crypto currency
@blvcknoone
@blvcknoone 2 жыл бұрын
@@williamssynergyinc.1381 Bruh, you can buy any course on Udemy once you have a Mastercard of any Nigeria bank 🏧. Ask people to help you, transfer to them then use their card to buy.
@williamssynergyinc.1381
@williamssynergyinc.1381 2 жыл бұрын
@@blvcknoone do you live in Nigeria, and if yes, when last were you able to make payment with Naira Debit card
@mvgiacomello
@mvgiacomello 3 жыл бұрын
Story-time: I've been a QA engineer with comp.sci background working in many places building quality tools for over 11 years. Last year during the pandemic most of my company was fired, including myself. So, I decided to apply for a web developer role at Napster. This video was literally all I used to do the technical exam. I am now finishing my probation period! Thanks, mate!
@Mischu708
@Mischu708 3 жыл бұрын
How is webdev compared to your previous work?
@aga080
@aga080 3 жыл бұрын
Napster!?!? THE napster??
@ThunderstruckElectronix
@ThunderstruckElectronix 3 жыл бұрын
Good job
@PB72UK
@PB72UK 3 жыл бұрын
I'm the CEO at Napster, your fired! 🤣🤣🙄
@rajasanchit
@rajasanchit 3 жыл бұрын
I am a STE and even I am learning react from past 1 year
@TraversyMedia
@TraversyMedia 3 жыл бұрын
Hope you enjoy! This is obviously geared toward people learning React. I have a React project playlist for more project based videos as well as a few Udemy courses. I will also be updating my Vue, Angular crash courses and many others
@auawgamer3470
@auawgamer3470 3 жыл бұрын
Love your tutorials! Can't wait for updated one for vue
@sunilchaudhary1206
@sunilchaudhary1206 3 жыл бұрын
Waiting for angular crash course to start learning it👍🏻
@Chiny_w_Pigulce
@Chiny_w_Pigulce 3 жыл бұрын
You got an error because you deleted an "i" in "id"
@kk2070464
@kk2070464 3 жыл бұрын
waiting for your Udemy courses
@ado4969
@ado4969 3 жыл бұрын
Thanks
@TrevorRobertsJr
@TrevorRobertsJr 2 жыл бұрын
1:43:40 Two more items for recent versions of React as of October 2022: 1. You must also import Routes from react-router-dom and wrap your tag in a tag 2. Instead of component={About} use element={}
@boomshakalaka656
@boomshakalaka656 2 жыл бұрын
Thanks bud l was really struggling to find what was wrong with the code
@MangoMang
@MangoMang 2 жыл бұрын
Thanks so much! The root route is still broken for me (not showing any of the rendered internals) but I'll keep following the video and see if I can fix it. EDIT: Found another comment with a fix for this if anyone else encounters it: On the first Route (to '/') change "render={props => (" to "element={"
@curtisbellamy3728
@curtisbellamy3728 2 жыл бұрын
@@MangoMang appreciate u!!
@CastleBomber
@CastleBomber 2 жыл бұрын
gg
@0100-w1s
@0100-w1s 2 жыл бұрын
@@MangoMang you're a life saver!!! thankssss for this!!!
@SprinkledLandSharks
@SprinkledLandSharks 3 жыл бұрын
This is meticulously clear. I've watched 15 or more videos that took me through creating a ToDoList with React. You have explained things in a way that's easy to understand. Your explanations are thorough and I feel that I'm finally understanding what you are teaching instead of just following along in VScode. Thank you.
@K13ran1984
@K13ran1984 3 жыл бұрын
I love the guest hosts, but I was surprised and delighted to hear brad himself!!!!
@TraversyMedia
@TraversyMedia 3 жыл бұрын
Yeah, we're gonna try and go old school for a while. There is a lot I want to do such as creating my platform, but I will also be dedicating quite a bit of time to KZbin :)
@abdullahalakus9700
@abdullahalakus9700 3 жыл бұрын
@@TraversyMedia you are very clever
@beefpapa7616
@beefpapa7616 3 жыл бұрын
@@K13ran1984 Hey just checked out your site. Some cool stuff. Wanted to let you know that your resume section still has lorem ipsum placeholder text
@yt-sh
@yt-sh 3 жыл бұрын
@@TraversyMedia Thanks for all the crash courses
@TraversyMedia
@TraversyMedia 3 жыл бұрын
Just a heads up. If you use the React snippet extension, you can prefix rafce or whatever you use with an underscore to not generate the un-needed react import
@ronyahmed320
@ronyahmed320 3 жыл бұрын
@@gman8361 how did you get a job? plz share your experience. Do you know react, node.js yet?
@TraversyMedia
@TraversyMedia 3 жыл бұрын
@@ronyahmed320 after many failures I landed a dev job but we used PHP and Angular. This was quite a while ago. Most of my career has been freelance, consulting and of course content creation
@RacoonCH
@RacoonCH 3 жыл бұрын
@@TraversyMedia Was it pure PHP or a framework like Laravel?
@codertoon
@codertoon 3 жыл бұрын
thank you so much for this video and for the trick to get class arr func, it wasn’t mentioned in es7 vscode extension’s documentations too.
@shikhaverma0007
@shikhaverma0007 3 жыл бұрын
@@TraversyMedia hi I m also a web developer (PHP) learning react if any job or project in which I can work do let me know.
@JustRDanni
@JustRDanni 3 жыл бұрын
I'm a new dev on my first gig and my new boss just told me that he wants our team to convert their entire website to react - bad news? never done it before, good news, they paying me to learn how, Great news? You have a crash course for me and the team to watch and use to supplement out learning! Excellent work! and thank you!
@ahmd09
@ahmd09 3 жыл бұрын
Best Of Luck!
@abgar3589
@abgar3589 3 жыл бұрын
yikes, up here i would never have a chance to become a dev without knowing react.. somewhere on the world life is just easier
@IChowdhury01
@IChowdhury01 3 жыл бұрын
I wish I could get my first gig AND THEN worry about learning the tech... I already put the tech on my resume, trying to self-learn it and still can't get a job.
@siddhartharoy5263
@siddhartharoy5263 3 жыл бұрын
@@IChowdhury01 How long have you been self-studying ?
@siddhartharoy5263
@siddhartharoy5263 3 жыл бұрын
@@IChowdhury01 Best of luck :)
@clemguitarechal
@clemguitarechal 3 жыл бұрын
Thank you so much for this introduction to React ! I'm an old fashioned programmer, and struggle a bit getting my head around new technologies such as React, and your crash course is such an invaluable tool for me to get into it ; and actually get prepared for a job , for which I'll have to pass a test, next week (dec. 2021). This won't make me an expert at a glance, but for sure i'll give me some confidence in, at the very least, being able to translate/transliterate my ideas into react-ready code. Thanks a million !
@JN-cy9qt
@JN-cy9qt 2 жыл бұрын
Working on my first React project with The Odin Project and felt completely lost midway through. Watching this video cleared everything up thanks so much for taking the time to make this - the way you organized it into segments made it so easy to reference material later too.
@acatch22
@acatch22 3 жыл бұрын
For those getting the error "A Route is only ever to be used as the child of element, never rendered directly. Please wrap your in a " @ 1:43:00. react-router-dom v6 has some changes from v5. you need to import Routes aswell on line 2 with the Router, Route Then you need to wrap both of the 2 tags together with Then in the first change "render={(props) => ( to "element={" Then the second change "component={About}" to "element={}"
@osamah4532
@osamah4532 3 жыл бұрын
Man you are a life-saver , I was about to give up
@xxLadyPanther30xx
@xxLadyPanther30xx 3 жыл бұрын
Appreciate you!
@nguyenvinhquang6872
@nguyenvinhquang6872 3 жыл бұрын
love you my man
@EugeL0
@EugeL0 3 жыл бұрын
I'm getting "Warning: Functions are not valid as a React child. This may happen if you return a Component instead of from render. Or maybe you meant to call this function rather than return it." on the index page, any ideas? Tasks also not displaying.
@bibeduck6001
@bibeduck6001 3 жыл бұрын
why I didnt read the comment first 😭, I install my Router to v5. Thanks man!
@romulororizz
@romulororizz 3 жыл бұрын
Man you’re just a blessing to this world
@TraversyMedia
@TraversyMedia 3 жыл бұрын
Ha! I'll have to show my wife this one :) Thanks man
@tahmidlabib2919
@tahmidlabib2919 3 жыл бұрын
@@TraversyMedia You truly are.
@romulororizz
@romulororizz 3 жыл бұрын
@@TraversyMedia My goodness you replied me! 😱 Really big fan of you man! Keep up with the amazing work!! Much love from Switzerland 🇨🇭
@gambomaster
@gambomaster 3 жыл бұрын
@@TraversyMedia Well I doubt she will understand it. You are a blessing to a world which is different than theirs. 😉
@EvaLasta
@EvaLasta 3 жыл бұрын
@@romulororizz vc é Português cara da suiça?
@44203215
@44203215 3 жыл бұрын
Thank you Brad! Best tutorials! 1:29:30 => each child in a list must have a unique key => in your sample data the second entry has a "d" instead of "id" => Thats why suddenly the unique key warning is thrown :)
@tabhorian
@tabhorian 3 жыл бұрын
That's what I came here to say. I knew someone must have seen that. Good catch.
@tabhorian
@tabhorian 3 жыл бұрын
And then Brad caught it at 1:35:22, so all's well
@LUKFUNTV
@LUKFUNTV 3 жыл бұрын
I am having problem at 1:09:24 That add task function is causing problems [ Error: AddTask(...) : nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null ] Is displayed on the browser
@harisshahcs
@harisshahcs 3 жыл бұрын
@@LUKFUNTV I ran into the same error, it was because of the addTask function and AddTask component, make sure your function addTask has a small "a" instead of capital A in the App.js Component.
@justin-rr2sw
@justin-rr2sw 2 жыл бұрын
I was dying when he didn’t see it multiple times
@Artix9
@Artix9 3 жыл бұрын
I can say this without an ounce of doubt in my mind: You are the most loved coding content creator on youtube!
@captainnemonic
@captainnemonic 3 жыл бұрын
Great course. Went from doing Python/NodeJS to React overnight. This is my first foray into that realm. Thanks for the no-nonsense tutorial!
@lrajoo11
@lrajoo11 3 жыл бұрын
amazing stuff. I came from no coding background and watched your html, css, js videos - and now this - you've made this so much easier than I thought it would be. Thank you!
@josephwong2832
@josephwong2832 3 жыл бұрын
TRAVERSY is a LEGEND!! There are going to be books written about this guy when he's done!
@aimanshakeel5402
@aimanshakeel5402 3 жыл бұрын
Why you want him to be done? Let him continue forever. 😃
@arrevoir2590
@arrevoir2590 3 жыл бұрын
hope he's not going to be gone soon. I won't last long as a programmer without this guy
@pratikthorat3480
@pratikthorat3480 3 жыл бұрын
He wont be done mate because he is a LEGEND
@AnujKumar-ik5hm
@AnujKumar-ik5hm 3 жыл бұрын
legends never die.
@robsonsilv4.
@robsonsilv4. 3 жыл бұрын
Wow! Every year I wait for crash course updates, more than movies hahah.
@TraversyMedia
@TraversyMedia 3 жыл бұрын
That's awesome. Especially this year. Movies have been shit because of Covid
@bhatnagarcapital
@bhatnagarcapital 3 жыл бұрын
@@TraversyMedia Love you Brad from India .
@AdityaKumar1
@AdityaKumar1 3 жыл бұрын
Best React Beginner Guide for everyone who is learning in 2021. Good pace, good examples, easier to grasp, and not too complicated stuff thrown at once.
@shivanigaddagimath6105
@shivanigaddagimath6105 3 жыл бұрын
Hey Aditya! Are you a student or working currently? Would you be interested in exploring job opportunities in web development?
@yellowsaxguy7055
@yellowsaxguy7055 2 жыл бұрын
Just finished the crash course and are very pleased with the results! NOTE! react-router has since been updated this video, and uses a different syntax to route components! Firstly: you have to import a new component called Routes Secondly: wrap a Routes tag around your Route tags Thirdly: instead of using exact render arrow function, use element={} and change the empty tag to a div tag. you wrap the curly braces around that whole thing. Forthly: change component in your Route tag to element. Hope this helps that it took some time for myself to make it work.
@pierre2338
@pierre2338 3 жыл бұрын
Usually I struggle to watch a tutorial that last more than 1 hour at one go, but your approach made React more understandable! Thanks for giving such good courses bro
@damaroro
@damaroro 3 жыл бұрын
1 hour video from Brad is like 3++ hours practice in my computer .
@rodolfoandino2156
@rodolfoandino2156 3 жыл бұрын
3 days took me lol
@dailymeow3283
@dailymeow3283 3 жыл бұрын
Because it's very messy to be honest, adding the props and the codes and if statements right after the component is very messy, they should be organized all together in component.defaultProps You can do this project without react, in node js way more easy and organized better js and styling in just 10 minutes
@tofuyam7361
@tofuyam7361 3 жыл бұрын
show us the cat food
@armaansingh5114
@armaansingh5114 3 жыл бұрын
Just as i was reading the official react document this video popped up. Brad knows it ahead of time cheers!
@animeshsingh4290
@animeshsingh4290 3 жыл бұрын
54:23 - If anyone is confused why he didn't just use 'onDelete()' and instead used () => onDelete(). It is because an event handler is supposed to be either a function or a function reference and a onDelete() is calling the function.
@Ahmad_code
@Ahmad_code 3 жыл бұрын
I still don't get it man
@jakeb1381
@jakeb1381 3 жыл бұрын
@@Ahmad_code if you put onDelete(), the function onDelete will be triggered even tho the user did not click it.
@bzmind_
@bzmind_ 3 жыл бұрын
​@@jakeb1381 How does it get triggered when the user hasn't clicked it yet? I can't understand why he didn't call onDelete(task.id) directly :((( is that even possible? (syntactically) because he didn't pass the task.id in the parameter, he just wrote { onDelete } and then he said: now if we want to give it the id, we should write it like this: { () => onDelete(task.id) } so he wrote it this way just to pass the id? because it wasn't possible to pass parameters if he called it directly? I'm new in JavaScript, I haven't even written code with it yet, I was just checking out what is React ... but I have a little bit of experience in c#, not much
@jakeb1381
@jakeb1381 3 жыл бұрын
​@@bzmind_ If you call functionA(param) directly, functionA(param) will be triggered even tho user does not click the delete button. The reason is that when the browser read your code and see "functionA()" shape it calls the "functionA" right away because of "()" [bracket means "call this function"] . so you have to put "functionA" in onClick event. but we have to pass parameters, so you need a bracket so you have to put "() => functionA()" instead of "functionA()" so that it won't be triggered until the user click the delete button.
@bzmind_
@bzmind_ 3 жыл бұрын
@@jakeb1381 Oh, I get it now, thank you so much for your reply, I didn't know that the browser would call the function() right away, that's new for me, I've just started to learn web development, so where should I learn these points about how the browser and web stuff works and how it reads the codes? what topic are these related to?
@honeypot11
@honeypot11 2 жыл бұрын
this course was perfect, i thought i would have to slave away watching some 48 hour course and here you are condensing it all so well.
@andrewleonardi3351
@andrewleonardi3351 2 жыл бұрын
this
@megumin4625
@megumin4625 2 жыл бұрын
It's perfect in a pinch. I need to learn it, and NOW. Cause time is money for me right now
@austinmillbarge8731
@austinmillbarge8731 2 жыл бұрын
It's great to have a known objective to work towards, clear explanation of concepts, instructions presented in a logical sequence, with well organized time stamps. Best of all, no show stopping blockers in the form of hording and scrambling access or any other silly boot camp drama and interruptions. So refreshing!
@robertwerner6208
@robertwerner6208 3 жыл бұрын
Thank you so much for this! I'm an accomplished React developer [now] but my employer, a major U.S. corporation, will be getting a series of interns this year and I'm going to direct the React newbies to this video of yours.
@gunarcom
@gunarcom 3 жыл бұрын
The first 10 minutes is one of the best explanations of React I've ever heard.
@miles611
@miles611 3 жыл бұрын
I've been getting + seriously into React lately, and thanks to you all of the things that were left unclear from the official documentation/tutorial are now clear as day. I've already commented on other videos of yours, but again thank you so much Brad. You're an amazing teacher💯.
@kevinking1566
@kevinking1566 2 жыл бұрын
My man. I've got a job interview tomorrow and I'm re-watching this video to brush up. You are the best.
@odenhiem2291
@odenhiem2291 Жыл бұрын
Best tutorial so far. It isn't often that coders know how to speak both common English and code
@hemanthkotagiri8865
@hemanthkotagiri8865 3 жыл бұрын
I have tears looking at the hard work and dedication you put forth to teach all of us for free. You absolutely are a blessing to this world, Brad. Thank you so much. ❤️
@shivanigaddagimath6105
@shivanigaddagimath6105 3 жыл бұрын
Hey Hemanth! Are you a student or working currently? Would you be interested in exploring opportunities in job web development?
@h.cazador
@h.cazador 3 жыл бұрын
Thanks for updating the course. I'm just getting into React and having a tutorial that's from 2021 is reassuring when it comes to relevant code.
@neilbarry3
@neilbarry3 3 жыл бұрын
Brad, we really can't thank you enough!
@k8hansen
@k8hansen 3 жыл бұрын
Thank you so much for this! This has truly been the most fantastic react overview I've seen to date. I've been stuck in an endless loop of verbose tutorials, and I really needed a quick overview of hooks, state, and spread operators. This is so fantastic, thank you!
@bartmeeus9033
@bartmeeus9033 2 жыл бұрын
I agree too!
@tochi8061
@tochi8061 3 жыл бұрын
Honestly. i think you're hands down the best coding teacher that ever lived. i dont know a modicum of react and this one video got me creating things first time try.and actually understanding. i started coding about 4 years ago. i watched ur html crash course. that was the first "coding" id ever done. you are a legend sir. thanks for all you do
@bhavinpun1052
@bhavinpun1052 3 жыл бұрын
I swear man i just wished today that traversy media should upload a crash course on react too and here u r making my wish true thank you so much traversy media
@shivanigaddagimath6105
@shivanigaddagimath6105 3 жыл бұрын
Hey Bhavin! Are you a student or working currently? Would you be interested in exploring job opportunities in web development?
@FahadShah822
@FahadShah822 3 жыл бұрын
This is going to be the de facto React reference for everyone using it until he comes out with the next one. We're witness to a legendary moment in history, guys.
@beastmasterbg
@beastmasterbg 3 жыл бұрын
Damn I must be out of the loop for this to be legendary
@RAZR_Channel
@RAZR_Channel 3 жыл бұрын
I've been in this 20 years.... you make the best shit man. Always clear... and most importantly Demonstrated (unlike other tubers that just talk about something which is probably just something they watched from people like yourself and are repeating to make youtube content)
@Susushauauw
@Susushauauw 3 жыл бұрын
best shit? 😂
@RAZR_Channel
@RAZR_Channel 3 жыл бұрын
@@Susushauauw American Slang... for: Best Stuff
@LUKFUNTV
@LUKFUNTV 3 жыл бұрын
@@Susushauauw It sounds like giving toilet paper for a housewarming party😁 Lol
@LUKFUNTV
@LUKFUNTV 3 жыл бұрын
Don't take it strong. Just kidding 😁😀😀
@RAZR_Channel
@RAZR_Channel 3 жыл бұрын
@@LUKFUNTV That's a good idea... Better yet to take a big nasty one to break in the toilet as well..
@sucesssoulman
@sucesssoulman 3 жыл бұрын
I had been studying for hours and had a lot of information. Then I found your tutorial, and everything got sense. I understand why people commented on this video as they did. Now I'm part of them. Thank you!!!!! your tutorial taught me a lot!!
@yashgupta8336
@yashgupta8336 3 жыл бұрын
I am a total beginner with the React , but after watching and coding this tutorial , I feel pretty much comfortable!!
@shivanigaddagimath5994
@shivanigaddagimath5994 3 жыл бұрын
Hey Yash, are you a fresher in web development and open to full-time positions in the same?
@yashgupta8336
@yashgupta8336 3 жыл бұрын
Hey Shivani , yes I am a fresher but currently I am working in a start-up from past 5 months
@shivanigaddagimath5994
@shivanigaddagimath5994 3 жыл бұрын
@@yashgupta8336 I see, thank you for letting me know. We are currently looking for freshers to join us. Feel free to explore the opportunity if interested and refer your friends if they are looking for opportunities. You can connect with me using the contact information on my channel.
@yashgupta8336
@yashgupta8336 3 жыл бұрын
@@shivanigaddagimath5994 yeah sure can U tell me your LinkedIn profile so that we can connect?
@shivanigaddagimath5994
@shivanigaddagimath5994 3 жыл бұрын
@@yashgupta8336 Please visit the "About" section of my channel and you will be able to find the link. Thank you, looking forward to hearing from you.
@roshanshetty5661
@roshanshetty5661 3 жыл бұрын
Quick note: Don't register click and doubleclick events on the same element: it's impossible to distinguish single-click events from click events that lead to a dblclick event.
@eyesofdaveed
@eyesofdaveed 3 жыл бұрын
How can you solve it without binding two events to the same element?
@ananyasingh8761
@ananyasingh8761 3 жыл бұрын
I literally just finished watching your React Crash Course from 2019 and then I see this haha
@TraversyMedia
@TraversyMedia 3 жыл бұрын
It’s still relevant but I wanted to use hooks instead of class components
@JBuchmann
@JBuchmann 3 жыл бұрын
@@TraversyMedia Not to mention class components will still be relevant for some time since many of us have to deal with older code.
@CodingNuggets
@CodingNuggets 3 жыл бұрын
As always, thank you so much Brad. Don't need this, but so happy to see you helping the new guys and girls. We're all in this together. Best of luck to everyone in 2021!
@ozzyfromspace
@ozzyfromspace 3 жыл бұрын
To all the beginners like me, at some point WE just have to accept that we'll probably write a shitty first react app. Lets get started anyway 🙏🏽 and just keep this video in a separate tab somewhere until it starts to feel natural. Best wishes fam. Oh, and Brad.... You're amazing! Thank you, deeply, for everything that you do! Your "learn by doing" approach in this video is probably the best way to learn React that I've come across. This is my third tutorial and you make me feel confident enough to write my first shitty web app. Kudos, mate! 🏆🙌🏽🎊☮️
@joycejeyaratnam433
@joycejeyaratnam433 2 жыл бұрын
I will never accept that my first react app will be shitty! NEVER!
@matthewbaier766
@matthewbaier766 2 жыл бұрын
@@joycejeyaratnam433 unless you're Uncle Bob, good luck lol
@rusurveillancetaskforce
@rusurveillancetaskforce Жыл бұрын
Best way to learn anything is to get an overview and then escape the tutorial trap as soon as possible.
@kademmohammed6836
@kademmohammed6836 Жыл бұрын
Brad, thanks to you I'm feeding my family man, can't thank you enough, much love from ALGERIA
@mianbilalsadiqpannuhan59
@mianbilalsadiqpannuhan59 Жыл бұрын
Only required Information is delivered, no chit chat only qualitative stuff. Great. You just got a new follower and subscriber.
@kalinduR96
@kalinduR96 3 жыл бұрын
this is the first tutorial I followed to start learning react and man I'm so glad I did. thank you very much Brad. keep it up
@shivanigaddagimath6105
@shivanigaddagimath6105 3 жыл бұрын
Hi Kalindu! Are you a student or working currently? Would you be interested in exploring job opportunities in web development?
@frontendHacks
@frontendHacks 3 жыл бұрын
kzbin.info/www/bejne/mX7WYYWfp6ZgqLc&ab_channel=DevTips
@PawanKumar-tu6ti
@PawanKumar-tu6ti 3 жыл бұрын
I just took the React front-to-back course of Brad on Udemy, and guess what, it's frickin' awesome. I just love the way he teaches things.
@shivanigaddagimath6105
@shivanigaddagimath6105 3 жыл бұрын
Hey Pawan! Are you a student or working currently? Would you be interested in exploring job opportunities in web development?
@DocMaggie
@DocMaggie 2 жыл бұрын
I have a single piece of advice, because it can confuse a lot of people new to a particular framework or workcycle: don't use same parameter and value names. For instance, you use onClick={onClick}. Use something like onClick={clickHandler} or anything else, just not the exact same keyword. People will confuse as to what's an event handler name and what's the "random function" name. Not just you, basically any tutorial creator does this for some reason. It might be intuitive to you or any experienced developer just trying out React, but not to people relatively new to programming in general.
@effoff6904
@effoff6904 2 жыл бұрын
Bruh idek what I would do without this channel
@nat.serrano
@nat.serrano 2 жыл бұрын
This is clear. Some other courses I feel that either the teacher is not good teaching or they just want to show off their sophisticated code
@tiffanysantos1512
@tiffanysantos1512 3 жыл бұрын
Awesome tutorial! It was great that you added the backend integration, as a newbie it is something which confuses me and normally gets glossed over... By adding the fake backend and seeing how you manipulate the JSON data and making repeated requests to the server you have really helped me to understand these concepts. THANK YOU!
@madhusaini22
@madhusaini22 3 жыл бұрын
Can you please tell me how can i deploy this project with this json server. I had tried to do this but no backend is running :(
@abdullahibundi6109
@abdullahibundi6109 3 жыл бұрын
I learn a lot to develop both in front and back end web dev from you, you're the genius, keep on we're behind you, and thanks.
@Asuuri
@Asuuri 3 жыл бұрын
Im currently learning React! And ive watched a lot courses! But this is the best course imo, this course covers so much topics and contains so much value! Thanks a lot Brad!!
@MoodMelodies38
@MoodMelodies38 3 жыл бұрын
The ONLY REACT COURSE I finished!!!!!!! Thanks a ton Brad, Good work!
@arvi8843
@arvi8843 2 жыл бұрын
Thanks. Thinking of going with this crash course over the others.
@melkeydevvods7698
@melkeydevvods7698 2 жыл бұрын
This basically showed me I can build any app with the core basics of React. You're the best.
@Lucifer-wd7gh
@Lucifer-wd7gh 3 жыл бұрын
Brad I was missing you badly . Your voice motivates me to code more . Please comeback as soon as possible. Get well soon Other devs are good but traversy media is incomplete without Brad . 👍👍
@TraversyMedia
@TraversyMedia 3 жыл бұрын
I'm back my man 😉
@orelalon6167
@orelalon6167 3 жыл бұрын
My thought exactly!!!!!!
@bhatnagarcapital
@bhatnagarcapital 3 жыл бұрын
@@TraversyMedia LOve you brada
@dylandelorie2067
@dylandelorie2067 3 жыл бұрын
Who else was feeling so hopeful that he would see that he used “d” instead of “id” on one of the json server entries. Btw I’m completely new to React and this tutorial has been really great! Really easy to follow, well explained, and just focusing on fundamentals; exactly what I expect in a crash course 👍 Keep it up!
@zay5872
@zay5872 3 жыл бұрын
Haha I was like wait im not getting this error, then I saw he used d instead of id, if people where wondering when this happens it is on 1:30:00
@VaidehiPandya2410
@VaidehiPandya2410 3 жыл бұрын
Your crash courses are helping me to clear my interviews! Thanks a lot, man! I wish I could've subscribed to this channel earlier! haha
@shivanigaddagimath5994
@shivanigaddagimath5994 3 жыл бұрын
Hi Vaidehi, where are you based currently? Are you still interviewing for web development roles? We are interested in hiring talented web developers.
@abhijiths148
@abhijiths148 3 жыл бұрын
@@shivanigaddagimath5994 Interested
@shivanigaddagimath5994
@shivanigaddagimath5994 3 жыл бұрын
@@abhijiths148 Good to know that Abhijith! Can we please get in touch to discuss more? Please connect with me using the information mentioned on my channel. Looking forward to hearing from you!
@lnkeat
@lnkeat 3 жыл бұрын
Brad!!! Thank you so much for this (and your other tutorials!) These walk-throughs are some of the MOST valuable things in my learning process. And I'm paying $$$ to do a well-established software engineering bootcamp. This really helps put together pieces that I didn't even realize are missing. Thank you, thank you, thank you!!!
@patrickjreid
@patrickjreid 2 жыл бұрын
Yeah, I am in the same boat.
@dhanukalakshan1553
@dhanukalakshan1553 3 жыл бұрын
I tried to learn react multiple times but i wasn't able to learn it.But this time,things has changed thanks to you,now i know how React works and how to combine all of these Stuff into an end Product. Thank you Brad
@dynamodenis1164
@dynamodenis1164 3 жыл бұрын
It amazes me how you code every day yet everything seems all new
@RedBeardRetroTech
@RedBeardRetroTech 3 жыл бұрын
I feel no matter how much I learn there's always so much more to understand and learn, nested learning??!!
@karljohannisson
@karljohannisson 3 жыл бұрын
This video was amazing! I’ve been trying to grasp React for a few days now and this video just nailed it. It’s clear that you are very knowledgeable within this area, and you are terrific at conveying the concepts to others. Thank you!
@DThompsonDev
@DThompsonDev 3 жыл бұрын
WOW! Brad is back with a React Crash Course! WHOA! Just cancelled lunch plans with my family. This is a big moment for me instead! lol
@DThompsonDev
@DThompsonDev 3 жыл бұрын
@Paul Maximus I have. But Brad is awesome so I have to show him support. I work in react at work, but it is always good to review material and support someone great!
@mnreddy6443
@mnreddy6443 2 жыл бұрын
Just wow. Im a backend dev. Wanted to learn react. I saw another video of 2 hours. But coudln't grap clealy. But this guy is an amazing teacher. The way he explains is awesome. Subbed. Gonna watch all your videos.
@tomhollins9266
@tomhollins9266 3 жыл бұрын
This was not too long. It was an excellent crash course. Taught well by you. Thank you.
@marcosochieng5175
@marcosochieng5175 3 жыл бұрын
I've been eagerly waiting for this updated version. I can't thank you enough.
@kevingrimaldi1774
@kevingrimaldi1774 2 жыл бұрын
Simply awesome. My first time dealing with React, and I can say this video is definitely beginner's friendly! Thanks a lot!
@Uniqflav
@Uniqflav 3 жыл бұрын
Thank you Brad, one of my goals this year was to learn React and having you as a teacher makes everything better
@haciendadad
@haciendadad 2 жыл бұрын
First of all, I love that you update your courses when it is needed! I love this course! You made a great choice for an app! I am looking to change jobs and wanted a brush up on newer React and this course was perfect! Everything is so much easier than it used to be.
@jewalker7842
@jewalker7842 3 жыл бұрын
I have been trying to wrap my head around React for weeks and you just hit the nail on the head with a sludge hammer!!! Thank you!!!
@_swordancer_
@_swordancer_ 3 жыл бұрын
Great course !! It's funny to watch how Brad can't see that he has 'd' instead of 'id' in the second object, but that kind of things makes course even better. Shows that everyone makes mistakes from not-even-junior to senior full-stack :)
@robertn4996
@robertn4996 Жыл бұрын
I did struggle a lot to learn React. A lot of wasted 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.
@Maha-yg7pv
@Maha-yg7pv 10 ай бұрын
Whats the title of the book?
@bensonbenson4149
@bensonbenson4149 9 ай бұрын
what is the book
@ven7782
@ven7782 3 ай бұрын
The best Javascript book: Eloquent javascript by Marijn Haverbeke The best React book: The road to learn React by Robin Wieruch
@jameshansen801
@jameshansen801 3 жыл бұрын
Thank you so much for this course! While I'll admit that attempting to learn React, for me has been daunting for a long time. But the way you teach has put my mind at ease. I learned so much :)
@OneBigByte
@OneBigByte Жыл бұрын
For react-dom version 6: 1:44:20 Instead of "render={(props) => ( ..." use "element={..." then follow Trevor's tip on 1:43:40 1. You must also import Routes from react-router-dom and wrap your tag in a tag 2. Instead of component={About} use element={}
@alive2750
@alive2750 Жыл бұрын
Thank you!
@ianeyansky5635
@ianeyansky5635 3 жыл бұрын
Just finished this crash course to the last minute. I can say it is worth every minute!! 😍 . Thanks Brad!!
@pinderant
@pinderant 2 жыл бұрын
Thank you so much Brad for this incredible crash course. I really loved seeing how fast things can go using react. Can't wait to start redoing some of my portfolio projects in react
@YeloPartyHat
@YeloPartyHat 2 жыл бұрын
For those having a MiniCssExtractPlugin constructor error when building around 1:20:05, put this in your console then build npm i -D --save-exact mini-css-extract-plugin@2.4.5
@itzyourbwoytchybooxuur6475
@itzyourbwoytchybooxuur6475 2 жыл бұрын
Awesome contents on this channel! This is totally what I needed to brush up on REACT! Moreso, I have a 'no too important' observation at 1:13:07 The code that generates ids in the function handler 'addTask' in 'App.js' component, given below: const id = Math.floor(Math.random()*10000) + 1; could be changed to: const id = Math.floor(Math.random()*10000) + 4; since we already have ids of 1, 2 & 3. This was later made irrelevant after incorporating json server as it generates its own ids. However, the correction may be useful for those who didn't add json-server to theirs.
@manojk1494
@manojk1494 Жыл бұрын
Crystal clear, I was able to practice this completely in my laptop without any difficulties. Thanks a lot for your effort brother. God bless you!
@TimmyBlumberg
@TimmyBlumberg 2 жыл бұрын
Incredible tutorial, really learned a lot working through this~
@susheendharvijay2059
@susheendharvijay2059 3 жыл бұрын
This was amazing! Thanks for the amazing content Brad, feeling grateful for your channel.
@shivanigaddagimath6105
@shivanigaddagimath6105 3 жыл бұрын
Hi Susheendhar! Are you a student or working currently? Would you be interested in exploring job opportunities in web development?
@ВадимГаджимурадов
@ВадимГаджимурадов 3 жыл бұрын
1:30:00 on second task lost "i" in "id"
@edjohnson-williams
@edjohnson-williams 3 жыл бұрын
He knows. He fixed it at 1:35:00.
@felixlipski3956
@felixlipski3956 3 жыл бұрын
imagine if he deleted this task accidentally while testing deleteTask and would never know
@isbeb507
@isbeb507 2 жыл бұрын
It's amazing how a 2 hour video takes a whole day to work through, but i made it! thanks for making this!
@poorvashukla
@poorvashukla 9 ай бұрын
half way through it and I have already learned a lot of concepts! Thank you for creating a thorough video!
@prenomnom5637
@prenomnom5637 3 жыл бұрын
Are you serious? I was just planning to start learning React! haha this is awesome 😄
@ayoubZaZen
@ayoubZaZen 3 жыл бұрын
lucky us hhhh
@riyastp1835
@riyastp1835 3 жыл бұрын
1:25:00 Me screaming : YOU MISSED "i" 1:29:16 Me : NO 1:29:32 Me : Look at the second line 1:29:40 Me : Coz, Missed an "i" 1:35:00 Me: I Knew you gonna find it. Now I can rest in peace
@KT-ut9zg
@KT-ut9zg 3 жыл бұрын
1:29:50 Reads below for hopeful spoiler alert about him finding the missing 'i'. Phew!
@MichaelKire
@MichaelKire 3 жыл бұрын
He didnt fix the key -> index back to id tho
@arlet9788
@arlet9788 3 жыл бұрын
hahahha that gave a little bit of anxiety ngl
@manthikatharumudu4905
@manthikatharumudu4905 3 жыл бұрын
Hahahaha same! xd
@TheJphrubant
@TheJphrubant 3 жыл бұрын
I was screaming at the screen
@aldanamichelino
@aldanamichelino 3 жыл бұрын
Anyone else screaming "you missed an 'i' in the second 'id'!!!" at the screen? JK, great tutorial, man!
@sayanmaity2694
@sayanmaity2694 3 жыл бұрын
Yeah I hv seen too 😂
@ntigirishari
@ntigirishari 3 жыл бұрын
didn't even notice until he said it :-)
@LUKFUNTV
@LUKFUNTV 3 жыл бұрын
I am having problem at 1:09:24 That add task function is causing problems [ Error: AddTask(...) : nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null ] Is displayed on the browser
@Abdo_Elawady
@Abdo_Elawady Жыл бұрын
thank you so much, i was overwhelmed by react before this course with all the abstractions but after your video everything about the hooks, props, and routes makes so much sense now... you deserve all support.
@dguedry01
@dguedry01 2 жыл бұрын
This is a brilliant tutorial. It just cuts to the chase and immediately gets to the crux of things. Thanks for sharing. Very helpful.
@hashimabbas2508
@hashimabbas2508 3 жыл бұрын
Legend is back 🙌
@DevMadeEasy
@DevMadeEasy 3 жыл бұрын
WOW! Great Content as always, thanks for sharing it!
@dgundi
@dgundi Жыл бұрын
You are ####### amazing man. Every single one of your videos are so succinct, cover every single issue that you would come accross. I've watched a lot of tutorials in my time and no one covers everything the way you do with 0 time wasting. Everything you mention/talk about is 100% relevant and easy to digest. Ridiculous how good you are
@twinpixie3460
@twinpixie3460 3 жыл бұрын
This is a great tutorial. I always see many tutorials about coding and usually stop about 30 minutes in. I did that with both Angular and React. When I watched your crash courses on both of those they finally clicked!
@ParadoxWorks
@ParadoxWorks 3 жыл бұрын
49:06 :))) Why we love you. These little things, like a cherry on the top.
@xplusziefv
@xplusziefv 3 жыл бұрын
Wow yea peak comedy right here..
@AmZaDin14
@AmZaDin14 3 жыл бұрын
For Mobile Phone Timestamps: 0:00 - Intro & Slides 12:37 - Create a React app 14:52 - Files & folders 18:54 - App component & JSX 22:39 - Expressions in JSX 23:49 - Creating a component 27:18 - Component Props 28:50 - PropTypes 30:42 - Styling 34:17 - Button Component 37:46 - Events 40:18 - Tasks Component 41:03 - Create a list with .map() 43:07 - State & useState Hook 44:55 - Global state 46:52 - Task Component 49:30 - Icons with react-icons 51:41 - Delete task & prop drilling 55:50 - Optional message if no tasks 56:58 - Toggle reminder & conditional styling 1:03:13 - Add Task Form 1:06:16 - Form input state (controlled components) 1:09:18 - Add task submit 1:14:36 - showAddTask state 1:15:58 - Button toggle 1:19:33 - Build for production 1:21:51 - JSON Server 1:25:53 - useEffect Hook & Fetch tasks from server 1:30:13 - Delete task from server 1:31:51 - Add task to server 1:35:15 - Toggle reminder on server 1:39:15 - Routing, footer & about
@shannon-daygrant8754
@shannon-daygrant8754 3 жыл бұрын
Employer: What are your skills? Me: I can pretty much follow Traversy Media's tutorials. Not always, but most of the time. Employer: You're hired.
@lPoliticallyFye
@lPoliticallyFye 3 жыл бұрын
is it that easy?
@shannon-daygrant8754
@shannon-daygrant8754 3 жыл бұрын
@@lPoliticallyFye No that was a joke. I'm not sure what an employer would say to that.
@jack-ed2cz
@jack-ed2cz 3 жыл бұрын
@@shannon-daygrant8754 The employer would say, "Sorry, we're not a good fit." Two weeks later the employer would call you back "PLEASE PLEASE PRETTY PLEASE COME WORK FOR US!!!!!!"
@LUKFUNTV
@LUKFUNTV 3 жыл бұрын
Following and doing stuffs yourself, there is a vast sea in between🧐
@codinginflow
@codinginflow 2 жыл бұрын
Cool, this is where Jetpack Compose seems to have gotten its inspiration from :)
@clockwork204
@clockwork204 2 жыл бұрын
Very nice beginner tutorial. I like this slow approach where take your time building the app up and showing the results in each step, instead of just writing the whole thing down and we just see the end product. Easier to visualize what each code actually does. Showing alternative approaches really helps too.
@marcelnunez1658
@marcelnunez1658 3 жыл бұрын
Lmao I needed this literally now, I'll watch this and then buy the course
React Crash Course 2024
3:04:36
Traversy Media
Рет қаралды 657 М.
Node.js Crash Course
2:06:35
Traversy Media
Рет қаралды 260 М.
Vue JS Crash Course
1:50:52
Traversy Media
Рет қаралды 1,3 МЛН
All The JavaScript You Need To Know For React
28:00
PedroTech
Рет қаралды 671 М.
React JS Full Course | Build an App and Master React in 1 Hour
1:11:44
JavaScript Mastery
Рет қаралды 1,8 МЛН
Learn React In 30 Minutes
27:16
Web Dev Simplified
Рет қаралды 1,3 МЛН
Async JS Crash Course - Callbacks, Promises, Async Await
24:31
Traversy Media
Рет қаралды 1,4 МЛН
JavaScript Crash Course For Beginners
1:40:30
Traversy Media
Рет қаралды 4,1 МЛН
React 19 is finally out!
28:01
Theo - t3․gg
Рет қаралды 69 М.
Every React Concept Explained in 12 Minutes
11:53
Code Bootcamp
Рет қаралды 868 М.
Exploring React 19 Features - use() Hook, Actions & More
54:27
Traversy Media
Рет қаралды 66 М.