Learn React – React Crash Course 2018 – React Tutorial with Examples
🔥Want to really take your coding skills to the next level? Here are some courses for you:
– Mastering React: http://bit.ly/2NfPy4k
– Node.js: The Complete Guide to Build RESTful APIs: http://bit.ly/2NfkpOC
– Object-oriented Programming in JavaScript: http://bit.ly/2KVkEBB
– JavaScript Basics for Beginners: http://bit.ly/2KZea52
🔥If you don’t want to pay for individual courses, you can purchase the annual subscription. Each course will cost you $8 and you’ll get all the future courses for FREE:
http://bit.ly/2Jp9a3T
Subscribe for more videos:
https://www.youtube.com/channel/UCWv7vMbMWH4-V0ZXdmDpPBA?sub_confirmation=1
Want to learn more from me? Check out my blog and courses:
http://programmingwithmosh.com
https://www.facebook.com/programmingwithmosh/
https://twitter.com/moshhamedani
TABLE OF CONTENT
00:00 Introduction
01:14 What is React
05:48 Setting Up the Development Environment
09:27 Your First React App
16:03 Hello World
22:26 Components
24:06 Setting Up the Project
26:15 Your First React Component
31:38 Specifying Children
35:56 Embedding Expressions
40:49 Setting Attributes
46:36 Rendering Classes Dynamically
50:57 Rendering Lists
54:58 Conditional Rendering
1:01:04 Handling Events
1:03:56 Binding Event Handlers
1:08:34 Updating the State
1:10:51 What Happens When State Changes
1:12:58 Passing Event Arguments
1:17:31 Composing Components
1:21:18 Passing Data to Components
1:24:31 Passing Children
1:27:44 Debugging React Apps
1:31:55 Props vs State
1:34:22 Raising and Handling Events
1:39:16 Updating the State
1:43:57 Single Source of Truth
1:47:55 Removing the Local State
1:54:44 Multiple Components in Sync
2:00:39 Lifting the State Up
2:06:18 Stateless Functional Components
2:08:49 Destructuring Arguments
2:10:52 Lifecycle Hooks
2:12:32 Mounting Phase
2:18:09 Updating Phase
2:22:31 Unmounting Phase
Amazon Auto Links: No products found.
i was really anticipating for this. this seeems so awesome
Mosh, You are great a great teacher from my opinion …
I am going to put “Trained by Mosh” on my resume and get all the jobs!
Nice. Was just what I was looking for today.
my company is going to introduce react in our systems so I’ll spread the word about this course 🙂
Because I am on windows, my react start page did not show up, the page where the react logo rotates, I am not certain if it is the $ sign, however I tried it without it and I tried it with the $ sign, just my luck I have been try to get it to function for week on and nothing is working
Running into an error @ 1:15:40
./src/components/counter.jsx
Line 18: ‘product’ is not defined no-undef
My code below. Thanks!
import React, { Component } from “react”;
class Counter extends Component {
state = {
count: 0
};
handleIncrement = product => {
console.log(product);
this.setState({ count: this.state.count + 1 });
};
render() {
return (
);
}
getBadgeClasses() {
let classes = “badge m-2 badge-“;
classes += this.state.count === 0 ? “warning” : “primary”;
return classes;
}
formatCount() {
const { count } = this.state;
return count === 0 ? “Zero” : count;
}
}
export default Counter;
hey mosh made a video about vuejs
I am in love with the way you teaches the courses.Thanks for giving this free courses.Very helpful for people who cannot afford like me.Thanks you so much
good video in some regards… you might want to explain where you are finding files, how to save them etc. might seem easy for most but for beginners its sometimes frustrating trying to follow along. Also the very top of your video is cut off so we cant see your navagation when you refer to it
Not on Udemy?
Will this be on udemy? I already purchased you’re other videos there and it would be inconvenient to go to a different location.
I’ll buy it from your site if you can give me access to the videos I purchased from udemy on your platform.
I’d like it to be react + typescript.
Dude you are amazing. You explain these concepts so much better than most of the Professors at Universities.
Mosh please please make updated course regarding xamarin form with any real world app shopping cart , i purchased your old xamarin course but that is out dated plzzzzzzzzzzz reply
Hey, great course Mosh. Best to understand all the basics you need to know for React JS.
What’s that {…}: scanning.. plugin used here?
Dope.
Thnx!
Thanks Mosh, Big Like
Great work, sir.
Vue Vue!
Mosh give an advice to help me to be able to work online as freelancer .. programming is my life but there is no work here in my country because of war..
You are the best Man !
Thank you so much Mosh you are the best tutor.You rendered the complex UI in to simple components of real life ,Thanks again for you time and patience in making this videos, Excited and damn eagerly waiting for the next follow up video…
Mosh, can you do a more advance version on Udemy? Please!!!!!!
Hey Mosh, I really enjoy your tutorials a lot. They have helped me become a better developer. I was wondering, are you able to do a video on bcrypt and how to implement it? Thanks!
Thanks so much, your instruction is super helpful! Keep up the amazing work!
Mosh killing it again on one of the top and dominating library for building User interfaces. More grace to your elbow my mentor!
8:37 For windows users in visual studio code type Ctrl + , to open user settings to configure prettier formatter
I like the way you explain it, easy to understand specially for me, with simple term but it clear., but any way, why are you still using tht beautiful semicolon?? thanks for the Tutorial, looking forward for more great tutorial, have a great day n success for all your programming and business projects 🙂
thanks Mosh for the amazing video
High quality content as usual. Thanks for sharing.
Mosh you great instructor i got your all courses and i want to say you are the best instructor i ever find in my entire life regarding software….:-)
Hi Mosh,
When will the course be available on udemy?
How can you not love mosh? Uploading such a rich and educating content for free, please you all, lets get him to millions subscribers.