00:00 Hello world, this is your introduction to React, the React Fundamentals Workshop as a part of Epic Web Dev. And I am really excited that you joined me, because this is going to be a ton of fun. We're going to start out with the total basics of React.

00:17 In fact, our first exercise doesn't even touch React. We're going to start with the DOM and creating DOM nodes, creating a hello world in just JavaScript, nothing else. And then we can bring in React. And that will be pretty cool, because we can start creating React elements. We can see how we can make things a little bit more dynamic. All of that stuff will be pretty cool.

00:36 And then after we get into that, we'll start realizing that React by itself is not all that fun. And including JSX to transform something that looks a little bit like HTML into the Create Element API that we're going to be working with. That's going to be fun. Oh yeah, by the way, yeah,

00:55 we're not going to be jumping straight into JSX in this. You're going to be hand crafting your Create Element calls, calling just regular functions to create your UI. And so building UIs that way, not a ton of fun, but you will understand JSX and how it converts into regular JavaScript. You'll understand why a lot of people say,

01:14 oh yeah, JSX, that's just JavaScript, because it really is. And you'll be able to convert that in your head, which will be cool. And then you'll understand what makes a custom component a custom component. And how do we type this efficiently so that users of our custom components are using it properly? So we're building this little calculator thing

01:33 to have a bunch of different props and typing those properly. With TypeScript, it's going to be awesome. And then we'll get into some styling stuff with inline styles and class names and bringing in a CSS style sheet and all of the cool stuff that you can do there. And we're going to actually take this pretty far so that you'll end up with a box component that has a size prop.

01:51 And so you'll have an idea of how to compose things together in a nice way. And then we go pretty deep on forms and all the cool stuff that you can do with forms in React and how React differs slightly from the way that the web platform does forms. That's going to be awesome. We'll handle errors really well as well.

02:09 So you'll learn all about error boundaries and handling rendering errors and other errors, asynchronous errors and stuff like that with error boundaries. Pretty crucial aspect of building any application. And then we'll wrap things up with the key prop from React and help you really understand what is the key prop even and why does it matter

02:29 and how we can use it effectively to even reset the state of some of our React tree, which I think will be fun. So I'm excited to get into things. We'll start here with the hello world and we'll get all the way over there. It is a lot of content and an important knowledge for you to understand that I think you're really going to enjoy.

02:48 So thank you for coming. We'll see you in the exercises.