DEV Community

Cover image for Deploying a react quiz app on EC2
Lajpat Gautam
Lajpat Gautam

Posted on

Deploying a react quiz app on EC2

#aws #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(if you don't have dev then direct run "npm start")
Enter fullscreen mode Exit fullscreen mode

Start the React App

npm run dev
Enter fullscreen mode Exit fullscreen mode

Screenshot aws react

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.

✍️ Author: Lajpat Gautam

Top comments (0)