React is a Javascript library used to create fast interactive user interfaces. React was developed by Facebook in 2011 and has grown to the most popular Javascript library for developing web apps and mobile apps.
Prerequisites
Before we install React we need a few things first.
- A server running Ubuntu 20.04 or 18.04.
- About 10 minutes and a cup of coffee or hot tea. I prefer Vanilla Chai with a dash of whole milk or almond depending on my mood that day.
Step 1 — Install NPM
First, we need to install NPM (mode package manager), which is a command-line tool and registry that houses thousands of Node.js packages.
Install npm:
$ sudo apt install npm
Bam! That was easy. Npm is installed and now you can check the version using:
$ npm --version
$ node --version ← Installing npm also installed Node.js, this will check its version.
Step 2 — Install create-react-app
Now we need to install the create-react-app utility which gives you the tools needed to create React applications.
$ sudo npm -g install create-react-app
Confirm the version:
$ create-react-app --version
Step 3 — Create and launch a React application
Now to the fun stuff! Let’s create your first React app. The process is fairly simple and you can have an application up and running in a matter of minutes.
To create the React application input:
$ create-react-app [app-name] ← Replace ‘[app-name]’ with whatever you like. Go ahead, go crazy.
The system will begin to install all the necessary packages and tools which will take a few minutes.
After the application has been created you will be prompted with a list of commands to manage your application.
You can always copy/paste these commands in a text file on your desktop to save for later. My desktop is littered with random Linux notes!
Step 3 — Run your new application
You created your fancy new app in our last step, now we need to run the application. To do that, first navigate to the applications directory:
$ cd [app-name] ← Again replacing ‘[app-name]’ with your chosen name.
Issue this command:
$ npm start
You should see an output showing you the IPs and port number to view your application.
Open your chosen web browser, hopefully not Microsoft Edge, and navigate to:
After navigating to your React install, you should be greeted with the React default page. Congratulations! You just installed React and now you can develop to your heart's desire.