DEV Community

Omkar Sharma
Omkar Sharma

Posted on • Edited on

1 1 1 1 1

Deploying a React+Vite App on AWS EC2

#aws #azure #ec2 #react

This guide will help you deploy your React app on an AWS EC2 instance using Ubuntu.

1️⃣ Launch an EC2 Instance

  • Go to AWS Console → EC2 → Launch Instance.
  • Choose an Ubuntu AMI (Ensure it's Free Tier Eligible if using Free Tier).
  • Select an instance type (e.g., t2.micro for Free Tier).
  • Create a Key Pair for SSH access.
  • Configure Security Groups:
    • Allow HTTP (Port 80) & HTTPS (Port 443) for public access.
    • Allow SSH (Port 22) for remote login.

2️⃣ Connect to Your EC2 Instance

Once your instance is running, connect via SSH using your key pair:

ssh -i your-key.pem ubuntu@your-ec2-public-ip
Enter fullscreen mode Exit fullscreen mode

3️⃣ Set Up the Environment

Update Ubuntu

Run the following command to update system packages:

sudo apt-get update && sudo apt-get upgrade -y
Enter fullscreen mode Exit fullscreen mode

By default, Ubuntu does not have npm installed. Install it using:

sudo apt install npm -y
Enter fullscreen mode Exit fullscreen mode

4️⃣ Deploy Your React App

Clone Your Repository

git clone <your-repository-link>
Enter fullscreen mode Exit fullscreen mode

Navigate to Your Project Directory

cd your-project-name
Enter fullscreen mode Exit fullscreen mode

Install Dependencies

npm install
Enter fullscreen mode Exit fullscreen mode

Use --host Flag to Expose Vite Server on EC2

npm run dev -- --host
Enter fullscreen mode Exit fullscreen mode

Start the React App

npm run dev
Enter fullscreen mode Exit fullscreen mode

5️⃣ Handling EC2 Public IP Changes

By default, AWS assigns a dynamic public IP that changes when the instance is restarted. To keep the same IP:

  • Attach an Elastic IP (AWS allows only 1 free Elastic IP in Free Tier).
  • Go to AWS Console → EC2 → Elastic IPs.
  • Allocate a new Elastic IP and associate it with your EC2 instance.

Now, your app will remain accessible even after a reboot.

Top comments (0)