Learn React JS - Full Course for Beginners - Tutorial 2019

[@freecodecamp]

To get this code working, there is a little set up not mentioned in the video. If you are coding on scrimba.com, click the gear icon in the top right corner and select 'add dependency...'. First add 'react', then add 'react-dom'. If you are building locally, you should first install create-react-app. Get it here: facebook.github.io/create-react-app/

[@souvikkundu]

Thank you 👍

[@AnaisUrlichs]

@Elmo I have the same problem; using sublime, installed react app but not sure how to make the connection

[@AnaisUrlichs]

@ElmoI did not get how that works in the case of Sublime so I got Visual Studio Code and got it working- thank you tho

[@dubfactor2002]

@Elmo index.html goes in public folder

[@chrismanuel8993]

you should have really add this to your video

[@WhiteOwlStudios]

You r one of the reasons why i still believe in people. Just uploading this for free. Not even one commercial. Speechless.

[@osamagamal495]

@@supermarioemulator6487 he'll get paid anyway, It doesn't depend on us watching the Ad.

[@eduriseworld]

yup Freecodecamp is truly amazing it does inspire people like us. The only issue we figured out was that it's lengthy which leads a person to lose interest. But the key is to be patient and keep going.

[@eklavyasharma]

It's Not-for-Profit. They don't monetize. The organization relies on donations only.

[@Splixter512]

@@osamagamal495 is that really how ad monetization works?

[@manasmahanand732]

@@Splixter512 no, freecodecamp probably pays him. Freecodecamp gets money from donations. You can also contribute to freecodecamp by adding features to their app, since it is open source.

[@drewstifler1440]

This tutorial helped me land a job as a front end developer without experience. Now on my 9th month :)

[@liquicitizendirk2147]

That's dope, congrats!

[@S4LTYT]

how much u earn bro

[@itsmepiyushsaha]

Hey. Do you have a LinkedIn or any other profile where we can connect? I want to talk about something

[@hiteshkumarr20]

he can you send me your resume?

[@viniciusmiranda3820]

@@S4LTYT I knew that someone would ask that lol

[@BucurIonNiculae]

This tutorial is better than many of the courses on Udemy... Good bless you.

[@khaiduong7318]

totally agree!

[@this.channel]

And he gave us a site to practice on scrimba.com/g/glearnreact How amazing.

[@stealthslushie610]

Well, if someone does something for free then it's probably because they're passionate about that. Udemy is the result of chasing money. The whole udemy's ecosystem is based on fake discounts and the truth is they don't want to work with real teachers, only with salesmen. The fact something is paid gives people "the premium feeling" to it and so it may appear better but only for the foolish.

[@MoneyMaker-ze7dc]

@@stealthslushie610 On the other hand, even though one could be passionate about determined subject, that passion only goes to a point. I say that because making a good course demands considerable time and, in many cases, money. Making a long course requires equipment and planning, and it's hard to do that completely for free, that's why I wouldn't diminish the paid courses. I agree with you, though. If someone is doing something for free and without any "traps" to sell another course, it's because they're passionate and that means the course as consequence will likely be good.

[@FordExplorer-rm6ew]

@@stealthslushie610 this and a ton of other companies . They take advantage of people who have good faith and want to learn but don't know how much it's worth.

[@anuraghazra4772]

⭐️Course Contents ⭐️ ⌨️ (0:00:00) Course Introduction & Philosophy ⌨️ (0:05:22) What we'll be building ⌨️ (0:06:24) Why React? ⌨️ (0:09:25) ReactDOM & JSX ⌨️ (0:16:19) ReactDOM & JSX Practice ⌨️ (0:20:34) Functional Components ⌨️ (0:24:32) Functional Components Practice ⌨️ (0:29:41) Move Components into Separate Files ⌨️ (0:35:07) Parent/Child Components ⌨️ (0:43:14) Parent/Child Component Practice ⌨️ (0:48:12) Todo App - Phase 1 ⌨️ (0:50:50) Styling React with CSS Classes ⌨️ (0:55:56) Some Caveats ⌨️ (0:58:12) JSX to JavaScript and Back ⌨️ (1:02:11) Inline Styles with the Style Property ⌨️ (1:09:21) Todo App - Phase 2 ⌨️ (1:12:42) Props Part 1 - Understanding the Concept ⌨️ (1:14:56) Props Part 2 - Reusable Components ⌨️ (1:17:29) Props in React ⌨️ (1:29:39) Props and Styling Practice ⌨️ (1:40:25) Mapping Components ⌨️ (1:48:27) Mapping Components Practice ⌨️ (1:53:44) Todo App - Phase 3 ⌨️ (1:58:16) Class-based Components ⌨️ (2:03:32) Class-based Components Practice ⌨️ (2:07:11) State ⌨️ (2:12:08) State Practice ⌨️ (2:15:45) State Practice 2 ⌨️ (2:19:59) Todo App - Phase 4 ⌨️ (2:22:05) Handling Events in React ⌨️ (2:25:52) Todo App - Phase 5 ⌨️ (2:27:11) Changing State ⌨️ (2:39:29) Todo App - Phase 6 ⌨️ (2:47:14) Lifecycle Methods Part 1 ⌨️ (2:56:45) Lifecycle Methods Part 2 ⌨️ (3:00:07) Conditional Rendering ⌨️ (3:11:26) Conditional Rendering Part 2 ⌨️ (3:14:21) Conditional rendering Practice ⌨️ (3:23:00) Todo App - Phase 7 ⌨️ (3:25:34) Fetching data from an API ⌨️ (3:36:34) Forms Part 1 ⌨️ (3:48:55) Forms Part 2 ⌨️ (4:00:11) Forms Practice ⌨️ (4:24:29) Container/Component Architecture ⌨️ (4:35:53) Meme Generator Capstone Project ⌨️ (4:56:11) Writing Modern React Apps ⌨️ (5:02:17) Project Ideas for Practicing ⌨️ (5:03:06) Conclusion

[@ianpaul0520]

Thank you

[@soumadip_banerjee]

Thanks!

[@abv250]

Thank you so much for taking the time to do this. It really helps!

[@mayobyohassan500]

your the best

[@angelangelov3225]

@@abv250 it's literally in the description

[@Joseph-qb1es]

I'm at the 2 hour mark. I'm so happy that not only am I grasping all the concepts, I'm also practicing them over and over so as to be able to do it from memory. Amazing.

[@miab5962]

This is hands down one of the best tutorials you can watch to learn REACT on you tube. The teacher explains everything as why certain things work the way they do. You wont be left GUESSING! A thousand likes. World needs more teachers like you! UPDATE : do this on scrimba, you can edit the code with the teacher. Soooo good!

[@ishumishra8104]

yes

[@Khalinakhe]

This tutorial is so great that 17 minutes and 08 seconds in I decided to go ahead and download the video for offline-use just in case something happens to the world or youtube within the next 4.8 hours

[@lunargixx6867]

Lmao haha

[@re-codedexistence9351]

This. My internet is going off in a couple days for the month, and I've had to have this locally to work on !

[@sarahssannals7157]

lol

[@amirasaid6928]

how did you download this video plz

[@ahurein1641]

use internet download manager

[@BrandonsOnline]

This is my first time really diving into React, let alone using scrimba. Holy moly, is scrimba ever a powerful teaching tool put in the right hands. Loved the deep dive couldn't be better.

[@eac-ox2ly]

@@capslock3250 There's a lot of free courses lel. This React one is an example.

[@priyakoli5572]

Step by Step Explanation is really what everyone is looking for. Instead doing any certifications or search for react js tuts you covered all what is needed. Many Thanks to you. Grateful to you 🙏🏻

[@Realswagoverlord]

This is amazing! There are so many react videos but they all rush into the more complex things too fast without covering the basics. I used to think I am incapable of learning React but you showed me I can do this. Thank you so much.

[@seanpereira5824]

Same here.. I used to think it was difficult to learn because there is not a lot of resources which were step by step but this one explains it quite well

[@DubiousPhoenix]

Finally broke down and watched this after ignoring it for so long. A JS tutorial on this channel was a miss for me so I ignored this too. Good lord was I wrong. Nothing on Udemy can compare. This is actually TEACHING ME! You give time to slowdown and you give regular prompts to answer questions and the pacing is just great over all! Dora was so successful because of the techniques on display here. If I find anyone else needing a react course this will def be my first choice! Thanks!

[@robinkartik6356]

Actually I was learning react with my cousin brother. We are at State and found it very difficult to understand. So we decided to learn react from somewhere else and stumbled upon on this channel. I would like to say that your teaching style is fantastic, you encourage your audience to do it at the same time. Thank you so much for creating this video. Love from India.

[@sachinrastogi2296]

⌨️ (0:00:00) Course Introduction & Philosophy ⌨️ (0:05:22) What we'll be building ⌨️ (0:06:24) Why React? ⌨️ (0:09:25) ReactDOM & JSX ⌨️ (0:16:19) ReactDOM & JSX Practice ⌨️ (0:20:34) Functional Components ⌨️ (0:24:32) Functional Components Practice ⌨️ (0:29:41) Move Components into Separate Files ⌨️ (0:35:07) Parent/Child Components ⌨️ (0:43:14) Parent/Child Component Practice ⌨️ (0:48:12) Todo App - Phase 1 ⌨️ (0:50:50) Styling React with CSS Classes ⌨️ (0:55:56) Some Caveats ⌨️ (0:58:12) JSX to JavaScript and Back ⌨️ (1:02:11) Inline Styles with the Style Property ⌨️ (1:09:21) Todo App - Phase 2 ⌨️ (1:12:42) Props Part 1 - Understanding the Concept ⌨️ (1:14:56) Props Part 2 - Reusable Components ⌨️ (1:17:29) Props in React ⌨️ (1:29:39) Props and Styling Practice ⌨️ (1:40:25) Mapping Components ⌨️ (1:48:27) Mapping Components Practice ⌨️ (1:53:44) Todo App - Phase 3 ⌨️ (1:58:16) Class-based Components ⌨️ (2:03:32) Class-based Components Practice ⌨️ (2:07:11) State ⌨️ (2:12:08) State Practice ⌨️ (2:15:45) State Practice 2 ⌨️ (2:19:59) Todo App - Phase 4 ⌨️ (2:22:05) Handling Events in React ⌨️ (2:25:52) Todo App - Phase 5 ⌨️ (2:27:11) Changing State ⌨️ (2:39:29) Todo App - Phase 6 ⌨️ (2:47:14) Lifecycle Methods Part 1 ⌨️ (2:56:45) Lifecycle Methods Part 2 ⌨️ (3:00:07) Conditional Rendering ⌨️ (3:11:26) Conditional Rendering Part 2 ⌨️ (3:14:21) Conditional rendering Practice ⌨️ (3:23:00) Todo App - Phase 7 ⌨️ (3:25:34) Fetching data from an API ⌨️ (3:36:34) Forms Part 1 ⌨️ (3:48:55) Forms Part 2 ⌨️ (4:00:11) Forms Practice ⌨️ (4:24:29) Container/Component Architecture ⌨️ (4:35:53) Meme Generator Capstone Project ⌨️ (4:56:11) Writing Modern React Apps ⌨️ (5:02:17) Project Ideas for Practicing ⌨️ (5:03:06) Conclusion

[@aditivyas1420]

This is the only tutorial where I actually understood the core reactjs concept.

[@vampirehunter911]

React Query Essentials (learn.tanstack.com/) Download link --> katfile.com/oja17g3nnnlj/kat-ts-rqe.zip.html

[@yukii_kamishiro]

14th/12/2019 after spend 30 days of learning and practicing with your video. I now can do my course project, share all of my knowledge with my friends, especially I can do a lot more project with React that I learn only from your video. Thank you so much for sharing this video to the world. God bless you and people around you.

[@attitudefever1]

Thank you so much, sir. I can't believe resources like this exists on internet for free to help out starters!! I did all of your exercises and took a good 2 weeks including weekends to finish up because I really wanted to learn good and active learning instead of passive learning. Thank you so much once again and God Bless you ! for guiding many of us.

[@murtazajafri9387]

at the end. how would you rate your react understanding? can you make a frontend of an app on your own?

[@PlasmoX]

i've been looking around for react tutorials, and this one is the one that really helped me the most. very clear, nice examples to practice, and i'm retaining the information.

[@ramialsabki4146]

I see all other programmers trying to sell their courses when they BARELY go in details and explain. And you explain in a way that anyone would understand and still make it free? I am really speechless but thank you :D

[@STUPIDYOUTUBE_HIDINGMSGS]

So do you think this programmer went into explaining the details? He didn't even explain how the HTML is connected to the index.js file. He just said there's the "root" element. But he failed to explain why the HTML file has the javascript source "index.pack.js" and he's editing index.js. So how does that magically finds the file? Was this explained somewhere in the video?

[@hoangtranba9760]

@@STUPIDKZbin_HIDINGMSGS Yeah but in summary he did explained his code clearly

[@STUPIDYOUTUBE_HIDINGMSGS]

@@hoangtranba9760 Good enough, but try Angela Yu, you'll be amazed with the details of her teaching.

[@alimagnetic-iransenigma9647]

it took me 3 weeks to finish this course since i work three jobs but it is the best course of my life not just for react or coding but compared to everything ever lived. no teacher and mentor will teach something this sophisticated with this many details and fully like this only in 5 hours let along this is a coding lang which i knew nothing about and i only knew JS with courses on FCC. but after this i understand every bit of react needed to go on and can work with it. just a thank you not gonna cut it. i don't know what to say but the only thing i thought it should not be done to this video is at the end it have been fast forwarded to save some time but i really think individuals who stay by this course for 5 hours that might even take 3 week to finish (like myself) don't mind a few more minutes to understand everything and don't rush the mind after this much data to make it forget. again thanks

[@mohamedasiqshajahan1200]

What an explanation!!! I was at level 0 at the time of started watching this tutorial. Now I've got the confidence. You are the best teacher.

[@bobziroll]

Thanks! That means a lot to me :)

[@Badar2310]

@@bobziroll Hi mr Bob, Im doing the course on VS Code and it wont run in my index.html file, my contents wont display in browser, help please? What am i missing

[@irfanomi22]

I have tried some of tutorials in youtube, even Udemy ones. Nothing even comes close to this tutorial for easy understating. My god I was thinking react is hard to learn, cuz everyone else's video was kind of tough to understand (even though I know Angular).I'm super glad I found you man. Dude you are a LEGEND !!!!!

[@chhawiprasad3755]

This is the best tutorial ever on react. I swear. Others just tell you write this here write that there blah blah. You are explaining everything and I feel like I am learning. Thank you so so very much. You're an inspiration. Love from India.

[@RayThompson100]

After watching a few other react tutorials on you tube, this is the only one I have watched so far that has helped me understand react. Great tutorial.

[@swami2672]

I am confused with this and React Tutorial for Beginners [React js] by Programming with Josh... Any comments on this?

[@AxiomTutor]

I'm impressed not just by the information but also the pedagogy practiced in this video. Building up very iteratively, quizzing the viewer, giving hints about how to debug (a practice that's super important in your life as a programmer). Excellent video.

[@balkisslimene9442]

[@ombhosale8090]

Thank you so much for this course. It took me almost 10 days to complete and I can confidently say I have followed through and learned React basics from this course!

[@andig97]

Actually the best coding course I've ever done.. how they all should be, so detailed and cleverly built up with the pauses to remind about the importance of rewriting it over and over. Do you do any others in this kind of detail?

[@bobziroll]

I'm working on a more intermediate/advanced course on React for Scrimba now.

[@andig97]

@@bobziroll awesome!

[@MrWango-se4fi]

@@bobziroll is this released? Waiting for it eagerly !!!!

[@sangramjitchakraborty7845]

@@bobziroll Let me say man, you are a legend. You are helping build the career of thousands out here, including myself. Thanks for investing your time and effort on this.

[@80Vikram]

Learning Philosophy 3:40 What you'll learn 4:55 What you should already know 5:20 React 6:25 Why React 9:25 ReactDOM & JSX 16:20 ReactDOM & JSX Practice 20:35 Functional Components 24:35 Functional Components Practice 29:40 Move Components Into Separate Files 35:10 Parent/Child Components 43:20 Parent/Child Component Practice 48:15 Todo App - Phase 1 50:50 Styling React with CSS Classes 56:00 Some Caveats 58:20 JSX to JavaScript and Back 01:02:15 Inline Styles with the Style Property 01:09:25 Todo app - Phase 2 01:12:50 Props Part 1 - Understanding the concept 01:15:00 Props Part 2 - Reusable Components 01:17:35 Props in React 01:29:45 Props & Styling Practice 01:40:35 Mapping Components 01:48:35 Mapping Components Practice 01:53:50 Todo App - Phase 3 01:58:25 Class-based components 02:03:40 Class-based components Practice 02:07:20 State 02:12:15 State Practice 02:15:55 State Practice 2 02:20:05 TO-DO APP Phase 4 02:22:15 Handling Events in React 02:26:00 Todo App - Phase 5 02:27:20 Changing State 02:39:40 Todo App - Phase 6 02:47:25 Lifecycle Methods Part 1 02:56:55 Lifecycle Methods Part 2 03:00:15 Conditional Rendering Part 1 03:11:40 Conditional Rendering Part 2 03:14:35 Conditional Rendering practice 03:23:15 Todo App - Phase 7 03:25:50 Fetching Data from an API 03:36:45 Forms Part 1 03:49:00 Forms Part 2 04:04:25 Forms Practice 04:24:45 Container / Component Architecture 04:36:10 Meme Generator Capstone Project 04:56:30 Writing Modern React Apps 05:02:40 Project Ideas for Practicing

[@toannew]

55:00 note with className 1:38:30 set a condition with ternary 1:38:50 set a condition with double ampersand 1:45:40 an unique key props for a component 2:08:00 props is immutable => state is needed for mutable variables

[@ronaldot401]

I just started watching it and I already love it. Better than my classes in college!

[@MsStajna]

This is my first time with React and I learned so much from you, everything is crystal clear now! Amaaazing job!!!

[@rohankademani6406]

i literally surfed the entire youtube but didnt find a worthy video on react but now im here its the best anyone would pay to watch this video

[@enriquet548]

Repetition is key. I am watching this first. I setup REACT and did a few examples. I am watching the second half now and plan on going back to the beginning later to do the other examples. This course is more clear and concise than any of the other courses I have taken online. I don’t mind the instructor repeating his steps because that is how you remember things. Have you ever taken a course where the instructor clicks on stuff really fast and you spend time trying to figure out what happened? This course doesn’t do that.

[@medi7573]

I have watched many courses about reactjs, and really I was not able to even do the first exercise. Thank you for the hands-on comprehensive course.

[@gursheeshkour4254]

Purely a masterpiece! Don't look for any other course, this has literally everything.

[@abhisheksankpal261]

Is it still relevant ?

[@gursheeshkour4254]

@@abhisheksankpal261 Surely is! He has updated the video on Scrimba so use that link.

[@karansatha5285]

Such an amazing course for someone who is new to React. Thank you for giving out this for free.

[@koby4132]

This was the best learning experience I've had learning a new language/framework/library. The practices sections are extremely useful. I can't recommend this course enough. 10/10

[@dv2983]

I logged in specifically to thank you! First off, this is one of the best informed video on React. I see A LOT of so called React tutorials where you can tell that the person has no real knowledge about what is happening under the hood-it is bandaid React. Secondly I hate arrow functions and all the mess that ES6 has brought with it-call me a damn purist but I like my function to look like a function. And thanks for talking about whats happening under the hood-that is IMPORTANT. We don't want React robots who can copy paste, we need to know what and how things works! (only issue with your tutorial-it is too dark and you haven't zoomed in. Thats all, the rest is gold)

[@exmachina767]

In 2:45:30, the “handleChangeFunction” is actually modifying the previous state, as opposed to creating a new object as is recommended earlier. This is because the “todo” object in the “map” function is being modified directly, instead of creating and using a copy of it. Using ES6 syntax, this could be fixed with “return {…todo, completed: !todo.completed}” in the body of the “if”

[@bobziroll]

Good catch! I actually realized this later and updated the course on Scrimba to include a follow-up screencast that corrects this.

[@bandaharis]

Thanks

[@error-ie4fo]

This tutorial is really great. I've never understand React like that before. Thanks Bob

[@girlfailurecaughtin4k]

Thanks! I am moving from Vue to React and just lost in all those articles on the web ... and I find this!!! Totally my lifesaver 😭

[@ExploringandCoding]

What made you prefer React over Vuejs?

[@vassirng]

Great tutorial!!! The only thing that I would personally appreciate for the future videos is a bigger font.

[@amelielecoz3348]

this course is just what I needed to start learning React ! Merci !

[@nareenderkumar]

hi i need little help.

[@anishdhandore5812]

@@nareenderkumar simp

[@mohamedniyas1044]

Comma va tu?

[@dmennenoh]

Thanks much! I've been watching loads of React tutorials and find this one the most complete so far, and you have a great speaking style. Taken me three days to get two hours in so far, as I'm doing everything. Appreciate the effort it took to produce this.

[@AshishSingh-dq9fs]

hands down, even today this single video teaches you a lot and is probably better than all those long 19hr course videos on other channels

[@bovrar2nd861]

This is an awesome tutorial! The platform is also great! I was writing React right up front and not just blindly coding along, now I can remember more what I write. Excellent Job Mr. Ziroll I am very grateful!

[@MukeshKumar-co5ky]

Hey, since It has been 1.5 years the video uploaded, Should I watch tutorial or try to find any latest tutorial? please reply ASAP!

[@alonlaob]

When you make pauses for us to answer, I can't help feeling like in Dora the Explorer.

[@maheshguptha9796]

Hahaha

[@reinhardheydrich314]

do it on scrimba

[@YoungGrizzly]

Great intro. I always think of tutorials as pointers.i mean at some point you get tired of learning what a dang variable is but you listen anyway so you can get that gem about ternary operators that makes you rethink your last twenty projects where you have a variable for each POST and GET parameter.

[@ketub]

The tutorial is awesome. The way of teaching is great. I only have a tiny suggestion regarding the font (if the video is fullscreen then the font size is not an issue) when I want to split the pane and stack the "video | editor" side by side to follow along I could use a larger font. Thank you Bob Ziroll for such an awesome tutorial. Thank you FreeCodeCamp for providing such great content and an awesome learning experience 👏👏👏🙇‍♂️

[@shivanigaddagimath5994]

Hi Sanket, are you a 2021-passout and looking for job opportunities in web development?

[@ketub]

@@shivanigaddagimath5994 nop

[@vaibhavkumar5827]

Dislikers are those who paid huge amount to learn reactjs but found its available for free and that too with better teaching quality... Thanks to this channel...

[@aammssaamm]

Wrong. From those who knows better than react LOL

[@rshabhsharma2916]

For those of you getting "loading..." on StarWars API, it is because the API address is changed/removed so you will not receive anything from fetching. Don't worry its not a bug and move on :-)

[@SandeepSharma-co5tl]

Thanks buddy I was looking for something like this

[@rshabhsharma2916]

@@SandeepSharma-co5tl Glad to hear :)

[@denishpatel6038]

Thank you man, I purchased courses on Udemy and completed 30 lessons and was very bored of it, I watched this video and I think I got perfect knowledge to getting started for advance react topics.

[@michelezucca5819]

denish patel which Udemy courses did you buy? I’ve been doing Colt Steele’s one, and although his Web Developer Bootcamp was a great course and I got started with my passion for web development thanks to it, I haven’t been very happy with his React course. It just doesn’t click. I did one hour of this freecodecamp course and everything is already so much clearer

[@Kazerian18]

@@michelezucca5819 I bought Maximillian... He is a great teacher though. Although sometimes his voice puts me to sleep.

[@travel_ghost22]

@@Kazerian18 same things happening with me everytime his voice puts me in sleep and that too for a long time he is a fast speaker speaks so speed and in all the video he just speaks God Saved Me

[@yuvakishore335]

any one wants how to setup the reactJs 1. npm install create-react-app -g 2.create-react-app 'your-app-name' 3.cd 'your-app-name' 4.npm start

[@RoboDTeach]

Thank you sir!

[@xXThegabeXx]

Jeez why couldnt someone show me that yesterday :D

[@stanleychiemelapaul]

will i write it on a text editor and run it using command prompt ? or am i to run it directly on command prompt? am using windows

[@parthSHARMAparth]

thank you so much sir. love from iit delhi

[@prachurjyabasistha4682]

@@stanleychiemelapaul write it on your command prompt and also make sure to have node installed previously

[@abdullahch8535]

After installing node, you can create your react app through these steps 1- Go to your terminal and write " yarn global add create-react-app ", this will install a few packages 2- After this type " create-react-app my-app", this will install the template and other things. 3- type " cd my-app " and you're good to go.. 4- type "npm start" and the app will start running on your Local Host.

[@charlene6306]

Moved over to scrimba to watch and use the interactive editor. This is by far THE BEST intro to React video I've come across. I'm 7% of the way through and I've learnt more from this course then I did from spending time going through the Facebook official tutorial. Not only does this person know about React, but they also know how to teach. Knowing how to teach is a skill, an art form that not all the big youtube people have. I highly recommend this and any other course taught by this teacher 10/10

[@alikolachi3959]

Perfect course for beginners to take. I love the way the instructor takes on different concepts and the way he teaches everything step by step. I love the way he teaches. The way of teaching is similar to the instructor teaches at Programming With Mosh. Thanks for the tutorial.

[@saifullah1334]

Hands down THE best react tutorial for beginners out there. Helped me a lot! Thanks!!

[@garvitgupta13]

Does this video contain Hooks such as {useState,useEffect}?

[@camcardow1566]

The best tutorial on React I've seen. Really effective teaching style.

[@victorliendo2010]

Just beginning to get my hands dirty with REACT. I'm a backend developer and was kind of reluctant to get into the frontend field. But this course has made me change my mind, It's a great content, thank you very much for this

[@michelezucca5819]

You don't know how much I am grateful to you for putting together and publishing this course. I have been doing a couple of React course on Udemy but this course is the first one where I really understand how to write code on React, how components and elements are structured and how the logic behind React structure works. You focus so much on putting the React student to write syntax from scratch and to understand how to write Javascript on React before throwing problems to solve. In all the other courses I've seen teachers throw in problem-solving games all over while I'm still trying to understand the syntax, which in my opinion is the wrong approach, leaving the student more and more confused. Thanks to you I understand React so much better now.

[@xuannghiemnguyen3048]

First, you need follow command below: npm create-react-app my-app cd my-app npm start

[@satejtawade]

Best React tutorial for beginner. Each topic explained clearly. Author has great knowledge of React. Thnx sir for such video

[@paanshulchowdhary7264]

If i get a job in react after this ( my interview is on 19th Aug 2019 ) i'll personally message and pay you for the tutorial sir! amazing work!

[@freecodecamp]

Best of luck gearing up for your interview. You've got this.

[@monalpatel2009]

Best of luck bro, please share your experience what they aske you.

[@paanshulchowdhary7264]

@@freecodecamp Thanks a lot for your wishes sir....the interview focused more on my skills on javascript, im sorry i was'nt able to crack it.

[@paanshulchowdhary7264]

@@monalpatel2009 Thanks Monal, the interview was'nt that good. focused on javascript and thus wasn't able to crack it.

[@biswaroopbhattacharjee4565]

@@paanshulchowdhary7264 what kind of questions did they ask you?

[@talhashakil8245]

This was the most amazing React tutorial I found on youtube. Thank you soo much for such detailed explanation. The real-time practice on scrimba made it more beneficial. Thank you Sir Bob Ziroll !!

[@kritikarai5106]

Its just been 30 min into the tutorial and I have become a hugeee fan of your teaching sir!!!I am actually practicising your hw tutorials on my own...............Thank u so much!!!!!

[@dustincintron1682]

Just finished the tutorial. This was INCREDIBLY helpful and built my confidence in React quite a bit. Thank you for your work

[@abhayjackful]

can i learn react js directly, if i only know html and css?

[@dustincintron1682]

@@abhayjackful Yes. Though I'd suggest finding some vanilla JavaScript tutorials as well. But you can def learn React as you are right now.

[@alb12345672]

@@dustincintron1682 I watched the tutorial, I wish I never used angular and vue, then I would be ok with it. This is like going 10 years in the past, seriously. No directives for starters. For example, vue explodes v-for (an HTML attribute) into a map statement. The only reason I could see using this is for better testing. It looks like the meta-code vue creates.

[@dustincintron1682]

@@alb12345672 I cant figure out if your comment is positive or negative lol. I never used Vue before. I'm still trying to get my foot in the door as a developer.. Are you saying this is outdated or not as good as the other frameworks?

[@alb12345672]

@@dustincintron1682 Everything is opinion. Not meant to be positive or negative. There are fanbois online for every framework. It seems to be best if you want a job today, but I'll say this, I've been doing dev for a long time, frameworks come and go. 10 years ago, every job wanted Jquery. Some wanted Backbone. Heard of those :lol:? It is like many other choices in life. React looks like it relies more on base javascript (with some additions) and vue/angular use shortcuts. I can give examples but you would have to understand Vue. Some may say that creates a learning curve, so in that respect react is better. React has a small API, a few concepts and you go from there. But you write more code. Best to watch tutorials for all and come to your conclusion. Make a todo app for each one. Can't hurt to put it on a resume either or add to your portfolio.

[@ThePeciuks]

This could be updated to contain React Hooks which would be very appreciated :)

[@edoardogribaldo2870]

I can't stop thanking you guysssss Amazing video and with no ads!!! You are helping everyone who wants to change his life coding

[@humzaasif4426]

i have gone through a lot of tutorials on youtube, but the way you teach is something else and this scrimba is very cool. Thanks a lot man

[@bobziroll]

I'm so glad you've found it helpful! :)

[@nurel882]

Thanksss, i've finished this course and i love how you deliver every material with effective communcation

[@SuperVSKY]

test

[@SuperVSKY]

test

[@shawinmendis9382]

One of the best tutorials out there on react ❤️

[@tanayraj2991]

This is what we call QUALITY CONTENT

[@VIjayKumartheh2o]

We could also use instead using ..... as making the parent for the input and nodes

[@amirsohel9260]

I complet this video till 58:19 min and i will say only one word "wow" 😍 I tried many time to learn react but always it seems hard for me but after this video i m fall in love with react 😇 and i really appreciate your efforts every time you create a new file and import react library only for explain clearly 😇 hat's off to you man

[@OwzaB]

Same here I've been trying to learn React using "React for beginners" videos and always find it hard at about 40 min into the video. I hope this one will help me.

[@EisenGlas]

**creates unordered list** **names the elements 1,2 and 3** ....

[@__prod1gy__793]

ahahaha good notice :))))

[@bobziroll]

🤣 I never noticed it, but I do this all the time. I think it's because 1. 1 2. 2 3. 3 Looks too weird/redundant for me. But I should probably use "a b c" or something instead. Or maybe something more interesting altogether.

[@microwavecoffee]

this is the baskin robbins jamoca almond fudge of react tutorials.

[@jimmyopot1972]

May God Himself bless you for this course. Really learning a lot.

[@gabrielfono844]

I finish with the course and I am so happy as self taught this has helped me strenghten my knowlege. thanks.

[@piusvictor8780]

With your teaching skills,you make React to be delicious i never understood this before and now you make me back to React life,you are a genius bro,much appreciation for sharing.

[@montazmeahii6029]

“Hello World,” the bane of all coding tutorials.

[@nemanjastojanovic7497]

Nice to see that someone give tutorial for free, but it is unusable if we couldn't configure the React project. Please, can you show us how to configure dependencies and all other stuff to write simple Hello World? Tnx

[@freecodecamp]

To get React to work, add these script tags before the closing tag in your HTML file:

[@leonh5453]

Yeah, that part is missing a bit, true.

[@desequilibradoo]

@@freecodecamp Even I have these script tags and in my js file I have these import React from "react" import ReactDOM from "react-dom". Still I dont get any text in div root. Here is my code . Can you please help me? import React from "react" import ReactDOM from "react-dom" ReactDOM.render(Hello , document.getElementById('root'));

[@freecodecamp]

I didn't give you all the info before. React requires a build process. If you are building locally, the easiest way to set up the build process is by using create-react-app. Get it here: facebook.github.io/create-react-app/ If you are using scrimba.org, click the gear in the top right corner and select 'add dependency...'. First add 'react', then add 'react-dom'. Everything should work after this.

[@harshilsoni2345]

@@desequilibradoo u gotta use babel... react dependency used in video include react in it... but you are using unpkg cdn... make below two changes if you havent yet... ReactDOM.render(here it is,document.getElementById("root"));

[@TheKraetos]

U need to take time and do the exercises! *2x speed enabled*

[@lolrgf]

Thank you for releasing this online. I will buy merchandise to help contribute back! You’re doing everyone a favour for those who are less fortunate.

[@kristianbitcoin4741]

I am half way to complete this lecture. I want to say thank you as I understood react better with this tutorial.

[@MuhammadAhmed-vi2xt]

You guys don't know how much you gave to us. Thank you Hug you love you. Thumbs Up and salute you

[@knightr1der]

This tutorial is really good!! Appreciate your teaching skills 👍

[@mohsinsayed_]

Just completed this course, Thanks Mr. Bob and freecodecamp for bringing such great study material for everyone to learn and take their skills to the next level. Thank You from the bottom of my heart!!!

[@beatboss9275]

So glad that I found this course on KZbin, otherwise the audio of this course on scrimba is very low almost null. thanks fCC.

[@bobziroll]

I'm going to fix the audio level issue in my new, updated React course on Scrimba (which will also be on fCC)

[@artrising967]

One of the gnarliest tutorials I've seen on React so clear, easy and well thought out. Thanks. I think you're totally dope.

[@MyReviews_karkan]

I am literally stuck in that "tutorial hell" and have been for the past couple of years. I have gotten so tired of not knowing what to code and how to start a project on my own even though I understand a good amount of programming languages, JS, Python, Ruby, C#, ReactJS etc, but I just don't seem to be able to start anything on my own. The minute I open the IDE, everything I have ever learned just poof, vanishes. I have been starting to give up lately because I am getting nowhere. I haven't coded for at least a month now and I don't feel like it anymore. This is kinda sad giving the amount of time and effort I have put into learning what I know. And what makes it even harder is that I can't attend any groups anymore because I have to watch my two kids on my days off while the wife is at work. I don't even have a single friend (near me) who is into coding, so, it is all solo. I really love coding :(

[@freecodecamp]

Here is something new to try to get out of 'tutorial hell'. Instead of trying to start a new project from scratch, try customizing a project someone else made to make something new. You can find code for a project on GitHub. Or you can try creating some projects from the freeCodeCamp.org curriculum. The curriculum assigns projects, but not step-by-step instructions. When you get stuck, there are always people to help you on the forum.

[@chrismerriweather4348]

i too feel this way also as i can answer qa on sololearn but to start my own project has me stuck i think once i move from studying to developing on the keyboard that the ideas may begin to flow dont forget in your in a community so feel free to ask a fellow IT/CODER for help

[@omarnasr6285]

This is extremely normal and don't count on that disappearing anytime soon. Even with years of experience with a framework I find that I have to go back and look up the most basic of things from the docs because I forgot. The key is not to get frustrated with yourself, easier said then done, but what helps is to know this is completely normal even with the most seasoned developers it happens

[@azammohammed9567]

This is the best meme generator tutorial.

[@Afghanistanmujaheed1234]

The best tutorial for react js in the market ...Thanks bob from afghanistan

[@iamserda]

Some people have a "gift", Bob Ziroll is truly gifted at simplifying very complex ideas when he is teaching technical concepts.

[@bahboom]

Excellent tutorial. Like your pacing and your use of repetition and reinforce the material. And having the viewers think and instead of just listening and watching you code.

[@arunaabhpant295]

In todo phase6 you cannot do todo.completed=!todo.completed this will modify the todo object itself(pass by reference). Instead you should be cloning the todoObject using spread operator. If you try to modify the previousState the changes would not take place. Atleast that is the issue I faced, don't know why is it working properly in the tutorial

[@ahmadsheerazsaeed5673]

Hello todo.completed=!todo.completed is not working for me also but If i use the if statement and check only one value, for example if (todo.completed === true){ todo.completed = false} it worked but if i want to check both the vales like this if (todo.completed === true) { todo.completed = false} else if(todo.completed === false){ todo.completed = true} it doesn't work. So will you please tell me how you did that. Thanks

[@grenadevisuals5810]

3:07:06 don’t mind me I’m just leaving this comment to see where I left off.

[@okeyD90232]

don't mind, just reminding you to complete this course :)

[@anurag.tiwari.official]

@@okeyD90232 don't mind, just reminding you to watch this course again to memorize important points.

[@shivamjaiswal7950]

@@anurag.tiwari.official dont mind,just reminding you to watch this course atleast once before placement.

[@ManishSharma-lm3wg]

@@shivamjaiswal7950 don't mind just reminding you again

[@ClickHow]

don’t mind. just remind you to complete the course.

[@omega_squared]

Star wars API is now .dev instead of .co, 3:28:54

[@mohammedyounus23]

How do you set up?

[@aaronzhang6347]

This is the best free online computer programming course I've taken. The quality of the course is much better than many other providers that charge a fee for their courses. Thank you very much for the great teaching!

[@ryancoding6733]

best react tutorial i've ever watched, simple and easy explanation, seamless transition from topic to the next. thank you bob

[@vin3995]

tried to learn react from coursera, wasnt helpfull. This guy did a lot better