After getting the fundamentals of JavaScript down, it's time to finally dig into React.
We'll start from the building blocks of React, which are elements and see how they are alike and different from plain HTML. JSX might appear a bit unusual at first, but we'll learn to appreciate its dynamic nature, by giving us everything in JavaScript.
Then, we'll see how to cluster elements to create our own "custom" React elements known as components. They'll look very familiar to plain JavaScript functions, but with some quirks, such as how "render" or update the DOM and require a predictable data input and output of only JSX with no side effects.
Next, we'll cover how to pass data to React components via props. To make any component dynamic, we need to use props. We'll get comfortable using props and the process of how to create them and pass them down to our components to consume them. You'll learn essential props patterns such as prop destructuring and composition with the help of the children prop.
Then we'll work with the "memory" of any React app: state. State is necessary for tracking data over the lifecycle of a component, plus updating state makes it possible for our components to re-render. We'll see how to create local state using the useState hook, work with multiple state variables, use arrays and objects as state variables and learn patterns like "lifting state up" to share state between components.