- Overview
- What You’ll Need
- Step 0: Launch an Ubuntu Server on AWS EC2 and Connect via SSH
- Update the System
- Install Node.js and npm
- Install and Start Nginx
- Clone the React Application Repository
- Modify the React Application
- Install Dependencies and Build the Application
- Serve the React App via Nginx
- Configure Nginx for a React Single-Page Application
- Test the Deployment
- Conclusion
Overview
This guide walks through launching an Ubuntu server on AWS EC2, securely connecting to it via SSH, and deploying a real React application that is served using Nginx and accessible through the server’s public IP address.
What You’ll Need
Before starting, ensure you have:
An AWS account
Basic familiarity with the Linux command line
An SSH client (Git Bash, VS Code terminal, or WSL)
Internet access
Step 0: Launch an Ubuntu Server on AWS EC2 and Connect via SSH
0.1 Launch the EC2 Instance
Log in to the AWS Management Console
Navigate to EC2 → Instances → Launch instance
Configure the instance:
Name: react-nginx-server (or any preferred name)
AMI: Ubuntu Server 22.04 LTS
Instance type: t3.micro (eligible for free tier)
Key pair: Create or select an existing .pem key
Network settings:
Allow SSH (port 22) from your IP
Allow HTTP (port 80) from anywhere
Launch the instance and wait until its state shows Running
Note- when you click on the above , it will show the instance in a running state.
0.2 Retrieve the Public IP Address
From the EC2 instance details page, copy the Public IPv4 address. This IP will be used both for SSH access and later to view the deployed React app.
0.3 Connect to the Server via SSH
You may use Git Bash, VS Code terminal, or WSL. The command is the same.
ssh -i your-key.pem ubuntu@
Step 1: Update the System
Step 2: Install Node.js and npm
These are application dependencies.
Verify the installation
Step 3: Install and Start Nginx
check status
At this point, Nginx should already be serving the default welcome page on port 80.
Step 4: Clone the React Application Repository
This pulls the application source code to the server.
Step 5: Modify the React Application
Navigate to the source directory
(You may use vi or vim if preferred.)]
Replace the placeholder values with your own details:
Example
Save and exit the editor.
Step 6: Install Dependencies and Build the Application
Return to the project root directory
Install dependencies
Build the production bundle
This generates a build/ directory containing optimized static files.
Step 7: Serve the React App via Nginx
Clear the default web directory
Copy the build output to Nginx’s document root
Set correct permissions
This ensures Nginx can read and serve the files securely.
Step 8: Configure Nginx for a React Single-Page Application
Replace the default Nginx site configuration
Note- This should be ran directly on your terminal
Restart Nginx
Optional validation:
Step 9: Test the Deployment
Retrieve your public IP address
Access the application in your browser
Congratulations
You have successfully:
Launched an Ubuntu server on AWS EC2
Connected securely via SSH
Built a React application for production
Served it efficiently using Nginx
Top comments (0)