Get Started with Modern React: Step by Step
S02・V01: CRA Setup
- We will scaffold our game using “Create React App”. Create React App is a way to build React apps with no build configuration, which is ideal for this course.
- After creating our game in Create React App, we will verify that the process was successful by starting the app.
- Once we have verified the app works, we will delete all the source files created by Create React App, so that we can start from scratch.
Welcome to the “Step-by-Step” section of the course.
On our screen, we have 3 apps open for development. On the top left, we have the Atom code editor. On the bottom left, we have the Terminal app. And, on the right, we have the Google Chrome browser.
We will start off by using “Create React App” to bootstrap our project. We will create our project in Terminal, and call it
We will use the
npx create-react-app [project name] command.
npx create-react-app step-by-step
This will take a few seconds. Now, change directory into the project folder.
Open the project in Atom.
We can click on the
public/ folder to see the public files generated by “Create React App”. And, we can click on the
src/ folder to see the source files generated by “Create React App”.
Next, we will delete all the files in the
src/ folder. In Terminal, we will use the command
rm -f on all the files in the
src/ folder, which will forcibly remove the files without prompting for confirmation.
rm -f src/*
Next, we will create an empty
index.js file inside that folder. We will use the command-line
touch command, followed by the file name we want to create.
Now, delete all files in the
rm -f public/*
Create an empty
index.html file inside the
Let’s run our app using Yarn.
After a few seconds, we will see our project open at
localhost:3000 in our browser. We should see a blank white page. Our setup was successful.
We used “Create React App” to bootstrap our React application and run a local development server. We started the app on our local computer. And, we deleted all the source files to start with a blank slate.