In this video, Emmanuel Henri gives you a brief overview of the steps you take in this course to convert the Vanilla JS project into a React application. He covers the steps and then explains what is achieved.
- [Instructor] So, before we get started, let's take a look, briefly, at how we're going to convert our base project into a React one. First, we'll create a base React example and eject it. If you're not familiar with ejecting a React project, it means that we will uncover all the config files that aren't usually in a React project built from the CLI tool. Then, we'll copy over the config files. Most of these are webpack configurations, and since this isn't a course on webpack, we won't cover the details of these files.
However, feel free to take our course on the subject to get more details on webpack. Next, we'll dissect our HTML static files into multiple components and create the entry point for our project. After this, we'll set up our state and pass the required props to our child components and connect to an external database to our state so we can have a persistent store feeding our state as the application grows. We'll use Firebase for this. We'll also add routing to our application with React router, and create a few navigation links and the proper components to build a standard routing set-up.
Finally, we'll export good code practices with React and look at ESLint for code syntax and Flow for type checking. So this summarizes what and how we'll take this Vanilla JS project and convert it into a React application.
- Creating a new React project
- Installing and working with React Developer Tools
- Dissecting a project into components
- Setting up the state with static data
- Adding and finalizing CSS in components
- Setting up and leveraging Firebase
- Standard code best practices
- Installing and setting up Flow for type checking