Bootstrapping A React Project

Installing dependencies

First step is to install the correct Node version using nvm:

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.34.0/install.sh | bash

Then you can install the latest LTS version of Node:

nvm install --lts

Install the package manager yarn:

curl -o- -L https://yarnpkg.com/install.sh | bash

Bootstrapping A Project

To create a new React project type the following:

npx create-react-app my-app

It will create a folder called my-app inside the current folder with the following structure:

my-app
├── .gitignore
├── package.json
├── package-lock.json
├── public
│   ├── favicon.ico
│   ├── index.html
│   ├── logo192.png
│   ├── logo512.png
│   ├── manifest.json
│   └── robots.txt
├── README.md
└── src
    ├── App.css
    ├── App.js
    ├── App.test.js
    ├── index.css
    ├── index.js
    ├── logo.svg
    ├── reportWebVitals.js
    └── setupTests.js

Note

We omit from the structure the files and directories inside the node_modules directory because there are too many to list.

Running The Project

To run the project you can type:

cd my-app
yarn start

This will start the server and open up the website in your preferred browser.