Setting up a React project with the “Create React App” package

Create React App provides a way to quickly setup a React app using a single terminal command. It’s great for when you want to jump in and start coding without having to mess around with configuration. The only prerequisite is to have a recent version (8.10+) of Node.js installed.

To get started with Create React App open terminal and run the create-react-app command:

npx create-react-app hello-world

This will create a new React application in a hello-world folder. It’ll take a couple of minutes to download all assets. Once the installation is complete switch to the newly created directory and start the project:

cd hello-world && npm start

This will open the below page in a browser on a live development server at localhost:3000.

At this point you can make code edits and the project will automatically recompile and reload the browser. If for some reason the live reloading isn’t working for you try running the following command:

npm cache clean --force

That concludes the setup, when your app is ready for deployment run the following command:

npm run build

This will create a new “build” folder in the project with the optimised code and assets to deploy.

One of the drawbacks of Create React App is that you cant fully customize the build process. For most projects this isn’t a problem, however if customization is required you can use the eject command to remove the project from the Create React App integrated toolchain:

npm eject

Create React App is used as a starting point for all the React tutorials published on this site. If you’re interested in completing any of these tutorial it’s worthwhile familiarising yourself with the file and folder structure as it’ll make following along a whole lot easier.