Introduction

React is a powerful JavaScript library for building user interfaces, particularly for web applications. React's main features include ability to create reusable components—small, self-contained pieces of code that define the structure, style, and behavior of a part of the user interface.

This guide shows you how to install React on Ubuntu 24.04 so that you can create web-based applications faster.

Prerequisites

Before you begin:

• Deploy a Digital Ocean VPS server running Ubuntu 24.04.
• Create a non-root sudo user. See our guide on How to create a non-root sudo user on Ubuntu 24.
• Install Node.js and NPM. See our guide on How to Install Node.js and NPM on Ubuntu 24.04.

Create a new React Project

Next.js is a powerful React framework that offers features like server-side rendering (SSR), static site generation (SSG), and optimized performance. Here's how to create a new React project using Next.js.

1. SSH to your server using your favorite application such as PuTTY (For Windows) and OpenSSH (For Linux and Mac).

2. Create a new React project.

   CONSOLE

   $ sudo npx create-next-app my-app
   

3. Navigate to the my-app directory

   CONSOLE

   $ cd my-app
   

4. Build the application.

   CONSOLE

   $ sudo npm run build
   

   Output:

   > my-app@0.1.0 build
   > next build
   
   ▲ Next.js 15.3.0
   
   Creating an optimized production build ...
   ✓ Compiled successfully in 2000ms
   ✓ Linting and checking validity of types
   ✓ Collecting page data
   ✓ Generating static pages (5/5)
   ✓ Collecting build traces
   ✓ Finalizing page optimization   
   ...
   ○  (Static)  prerendered as static content
   

5. Start the development server.

   CONSOLE

   $ sudo npm start
   

   Output:

   > my-app@0.1.0 start
   > next start
   
   ▲ Next.js 15.3.0
   - Local:        http://localhost:3000
   - Network:      http://192.168.0.1:3000
   
   ✓ Starting...
   ✓ Ready in 811ms
   

   Next.js now serves your React application on port 3000.

Allow the React App Through the Firewall

By default, your new application runs on port 30000. Follow the steps below to open the port through the firewall.

1. Add a new UFW rule to open port 3000 through the firewall

   CONSOLE

   $ sudo ufw allow 3000
   

2. Reload UFW to pick up the new changes.

   CONSOLE

   $ sudo ufw reload
   

Test the React Application

1. Navigate to the following URL on a web browser and change 192.168.0.1 with your server's public IP address

   http://192.168.0.1
   

2. Ensure you get the following default React web page powered by Next.js.

   

Your react application should now be working as expected.

Conclusion

In this guide, you've installed React on Ubuntu 24.04 to bootstrap a new project. You've also configured the firewall to allow access to the development server and verified that your React application runs successfully. With this setup, you're now ready to start building powerful web applications using React's component-based architecture.