By Categories: Web DevelopmentTags: , , 0 Comments on How to Publish a React App on VPS Hosting without cPanel

Introduction

When it comes to deploying a React app on a VPS hosting without cPanel, the process may seem daunting at first. However, with the right steps and guidance, you can successfully publish your React app and make it accessible to users. This blog post will provide you with a step-by-step guide on how to publish a React app on VPS hosting without cPanel.

Step 1: Set Up Your VPS Hosting

The first step is to set up your VPS hosting. Choose a reliable hosting provider that offers VPS hosting services. Once you have signed up and logged into your VPS, you will be provided with the necessary credentials to access your server.

Step 2: Install Node.js and NPM

Before you can deploy your React app, you need to ensure that Node.js and NPM (Node Package Manager) are installed on your VPS. Connect to your VPS server using SSH and run the following commands:


$ sudo apt update
$ sudo apt install nodejs
$ sudo apt install npm

Step 3: Build Your React App

Next, you need to build your React app. Navigate to the directory where your React app is located and run the following command:


$ npm run build

This command will create an optimized production build of your React app.

Step 4: Install a Web Server

To serve your React app on the VPS, you need to install a web server. In this example, we will use Nginx as the web server. Run the following command to install Nginx:


$ sudo apt install nginx

Step 5: Configure Nginx

Once Nginx is installed, you need to configure it to serve your React app. Open the Nginx default configuration file using a text editor:


$ sudo nano /etc/nginx/sites-available/default

Replace the contents of the file with the following configuration:


server {
    listen 80;
    server_name your-domain.com;

    root /path/to/your/react/app/build;

    index index.html;

    location / {
        try_files $uri $uri/ =404;
    }
}

Replace “your-domain.com” with your own domain and “/path/to/your/react/app/build” with the actual path to your React app’s build directory.

Save the file and exit the text editor.

Step 6: Start Nginx

Start Nginx by running the following command:


$ sudo systemctl start nginx

If there are no errors, Nginx should start serving your React app.

Step 7: Configure DNS

Finally, you need to configure your domain’s DNS settings to point to your VPS. This step may vary depending on your domain registrar. Contact your domain registrar for instructions on how to set up DNS records.

Conclusion

Congratulations! You have successfully published your React app on VPS hosting without cPanel. By following these steps, you can make your React app accessible to users and enjoy the benefits of VPS hosting for your web application.

Remember to regularly update your React app and maintain the security of your VPS hosting to ensure a smooth and secure user experience.

Leave A Comment