How to Install ReactJS on Debian 11 

how to install reactjs on debian 11

In this tutorial, we are going to explain in step-by-step detail how to install ReactJS on Debian 11 OS. React is an open-source Javascript library used in web development. You can use the User Interface (UI) library to build interactive elements based on UI components. React has broad community support, and it was voted the 2nd most popular web framework in 2022.

It was created by Facebook (now Meta) in 2011 for their own use, and it was initially released to the public in 2013. Installing React.js is fairly straightforward and quick, and it shouldn’t take more than 10 minutes, so let’s get started.

Prerequisites

  • A server with Ubuntu 22.04 as OS and a Minimum of 4GB of RAM
  • Valid hostname and domain pointed to the servers IP address
  • User privileges: root or non-root user with sudo privileges

Step 1. Update the System

First, we will update and upgrade the system packages to the latest version available.

# apt update
# apt upgrade

Step 2. Install the required packages

If you don’t have the following packages pre-installed on your Debian 11 host, you can install them using the following command.

 # apt install build-essential sudo git

Step 3. Install ReactJS

Next, we will download the script in the node.sh file, and we will give the execute permissions for this file.

# curl -fsSL https://deb.nodesource.com/setup_19.x > node.sh
# chmod +x node.sh

Now we can run the script using the command:

# bash node.sh

Once this is completed, you can go ahead and install nodejs:

# apt-get install -y nodejs

To test if the node was installed successfully, you can run the node version command:

# node -v
v19.7.0

You can also check if npm was installed and what is the npm package versions with:

# npm -v
9.5.0

Now you can switch to the non-root user with the command:

# su - user

Please note “user” will depend on the username used on your system; we have used “user” as a generic example.

Now you can install create-react-app using npm

Need a fast and easy fix?
✔ Unlimited Managed Support
✔ Supports Your Software
✔ 2 CPU Cores
✔ 2 GB RAM
✔ 50 GB PCIe4 NVMe Disk
✔ 1854 GeekBench Score
✔ Unmetered Data Transfer
NVME 2 VPS

Now just $43 .99
/mo

GET YOUR VPS
$ sudo npm install -g create-react-app

And you can create a new react project:

$ create-react-app reactapplication

You should receive similar output once you run the “create-react-app reactapplication” command:

 
Creating a new React app in /home/user/reactapplication.

Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template...
 
 
added 1416 packages in 1m
 
231 packages are looking for funding
  run `npm fund` for details
 
Installing template dependencies using npm...
 
added 62 packages in 18s
 
231 packages are looking for funding
  run `npm fund` for details
Removing template package using npm...
 
 
removed 1 package, and audited 1478 packages in 3s
 
231 packages are looking for funding
  run `npm fund` for details
 
6 high severity vulnerabilities
 
To address all issues (including breaking changes), run:
  npm audit fix --force
 
Run `npm audit` for details.
 
Success! Created reactapplication at /home/antonio/reactapplication
Inside that directory, you can run several commands:
 
  npm start
    Starts the development server.
 
  npm run build
    Bundles the app into static files for production.
 
  npm test
    Starts the test runner.
 
  npm run eject
    Removes this tool and copies build dependencies, configuration files
    and scripts into the app directory. If you do this, you can’t go back!
 
We suggest that you begin by typing:
 
  cd reactapplication
  npm start
 
Happy hacking!

As you can see, the React project is set up, and you can enter the “reactapplication” directory and start serving the site on http://localhost:3000.

$ cd reactapplication 
$ npm start 0.0.0.0

Once you run the command, you should receive similar output.

Compiled successfully!
 
You can now view reactapp in the browser.
 
  Local:            http://localhost:3000
  On Your Network:  http://192.168.100.9:3000
 
Note that the development build is not optimized.
To create a production build, use npm run build.
 
webpack compiled successfully

The application is now running in development mode, and you can now access it on your browser. To run your application in production mode, you will have to use npm run build. Once the project is compiled, the build directory can then be deployed. You can also serve it using the static server suggested in the output of the command “npm run build”.

# npm install -g serve
# serve -s build

This will install “serve,” and then the second command will serve your site on port 3000.

Congratulations! You successfully installed ReactJS on Debian 11. You can contact our support if you find any difficulties installing this software and service. All you need to do is to sign up for one of our NVMe VPS plans and submit a support ticket. We are available 24/7.

Leave a Comment