ReactJS is a JavaScript library for creating attractive user interfaces, with this library we can build single-page applications. React is easy to learn and use for creating projects. Nowadays, the demand for React is growing rapidly. However, to start using React, we need to follow a few key steps.

 

Each operating system requires slightly different steps for installing React. In this article, we'll tell you everything from scratch to how to install ReactJS on a Linux system and how to use it in our first project.

 

 

Guide Outline
 

Step 1: Install Node.js and npm

 

• Download and Install node.js
    
• Verify Installation
   

Step 2: Install Create React App

 

Step 3: Create Your First React Project

 

• Navigate to the Desired Directory
   
• Create a React App
   
• Navigate to the Project Directory
   
• Start the Development Server

 

 

Step 1: Install Node.js and npm

 

It's important because Node.js allows you to run JavaScript on your computer, not just a web browser. You also get npm (Node Package Manager) when you install Node.js, which helps you install and manage all the libraries and tools your projects require.

 

Download and Install node.js

 

Open your terminal and follow these steps to download and install Node.js:

 

//  Update your package list
sudo apt update

//  Install curl if not already installed
sudo apt install -y curl

//  Download and install Node.js using the NodeSource repository
curl -fsSL https://deb.nodesource.com/setup_lts.x | sudo -E bash -
sudo apt-get install node.js

 

Verify Installation

 

Once the installation is complete, you can check that Node.js and npm are installed by verifying their versions:

 

// For nodejs
node -v
//You should see the Node.js version number.

// For npm 
npm -v 
//You should see the npm version number.

 

These commands will show the version numbers if the installation was successful.

 

 

Step 2: Install Create React App

 

Creating a React App is recommended to start building React applications with a modern build setup and no configuration.

 

It sets everything up for you automatically, saving time and effort and giving you a quick start.

 

Use npm to install Create React App globally:

 

sudo npm install -g create-react-app

 

 

Step 3: Create Your First React Project

 

Now that we have Node.js and npm installed, we can create a new React app using the create-react-app tool. Let's do it.

 

Navigate to the Desired Directory

 

Open your terminal and change to the directory where you want to create your React project.

 

cd /path/to/your/directory

 

Create a React App

 

To start a new React project, open your terminal and go to the folder where you want to create your project. Then, use this command:

 

npx create-react-app my-app

 

You can replace my-app with your preferred project name. This command sets up a new directory with all necessary files and dependencies. Kindly be patient because this command takes some time to set up the project.

 

If you've already created a folder and want to install all the required files and dependencies directly into that folder, without creating a new one, use the command "npx create-react-app ." instead of specifying a folder name. This command will initialize the React project in the current directory.

 

Important: If you have already installed Create React App globally using sudo npm install -g create-react-app, you can use npx create-react-app my-app to create a new project. Using npx create-react-app my-app ensures that you use the latest version of Create React App, even if you have a global installation of an older version.

 

Navigate to the Project Directory

 

Once the project is created, change into the project directory using the cd command:

 

cd my-app

 

Start the Development Server

 

To start the React application, run the following command:

 

npm start

 

This will launch the development server, and your default web browser will automatically open the new React application at localhost:3000.

 

 

When you make changes to your app's source files, the development server will automatically reload your app in the browser. This makes it very easy to iterate on your application’s design and functionality during development.

 

I hope you've successfully installed React on your Linux system and created your first React project.

 

Conclusion

 

In this guide, we have covered the basics of installing React on a Linux system. We have walked through the process of installing Node.js and npm, creating a new React application, and running the development server.

 

When installing React.js for your first project in Linux system, begin by installing it globally with the command 'sudo npm install -g create-react-app'. Afterward, there's no need to install React globally again for future projects. Simply create a folder for your new project, navigate to it in the terminal using 'cd', and then run 'npx create-react-app my-app'. This command will set up your new React project.

 

If you have any questions about this topic or related to web development, you can ask them in the question box given below, and you will get the answer soon.