React: Up & Running, 2nd Edition

Chapter 6. Setting Up for App Development

Now that you know a lot about React, JSX, and state management in both class-based and function components, it’s time to move on to creating and deploying a real-world app. Chapter 7 will start this process, but there are a few requirements you need to take care of first.

For any serious development and deployment outside of prototyping or testing JSX, you need to set up a build process. The goals are to use JSX and any other modern JavaScript without waiting on browsers to implement them. You need to set up a transformation that runs in the background as you’re developing. The transformation process should produce code that is as close to the code your end-users will run on the live site (meaning no more client-side transforms). The process should also be as unobtrusive as possible so you don’t need to switch between developing and building contexts.

The JavaScript community and ecosystem offers plenty of options when it comes to development and build processes. One of the easiest, most common approaches is to use the Create React App (CRA) utility (which has great documentation), so let’s go with that.

Create React App

CRA is a set of Node.js scripts and their dependencies that take the burden of setting up everything you require to get off the ground. So first you need to install Node.js.

Node.js

To install Node.js, go to https://nodejs.org and grab the installer for your operating system. Follow the instructions of the installer ...