Hosting a Full-Stack React App on AWS: A Beginner’s Guide (EC2 & EKS)

What is AWS?

Amazon Web Services (AWS) is a cloud computing platform that provides servers, storage, networking, and tools to help you deploy applications without managing physical infrastructure. Whether you’re building a hobby app or launching a SaaS startup, AWS scales with your needs.

Think of AWS as renting computing power instead of owning a data center.

Hosting Options on AWS (Quick Comparison)

Service	Ideal For	Pros	Cons
EC2	Custom server setup	Full control	Manual setup & scaling
EKS	Containerized microservices	Kubernetes orchestration	Complex to configure
Amplify	Static & serverless apps	Easy CI/CD & hosting	Limited backend control
Elastic Beanstalk	Simple Node apps	Auto handles infra	Less granular control
Lightsail	Small predictable apps	Fixed pricing & simplicity	Not as scalable

In this article, we’ll dive into EC2 (low-level control) and EKS (scalable Kubernetes-based orchestration).

Deploying a Full-Stack App on EC2 (Step-by-Step)

1. Launch an EC2 Instance

Go to EC2 on AWS Console
Choose Ubuntu (or Amazon Linux)
Pick a type (t2.micro is free-tier eligible)
Allow inbound ports: 22 (SSH), 80 (HTTP)
Create a key pair (for SSH access)

2. SSH into Your Server

ssh -i your-key.pem ubuntu@<your-ec2-public-ip>

3. Install Software

sudo apt update
sudo apt install -y nodejs npm nginx git

4. Deploy Backend

git clone https://github.com/your-user/your-app.git
cd your-app/backend
npm install
npm start

5. Configure Nginx for the API

server {
  listen 80;
  location /api/ {
    proxy_pass http://localhost:3000;
    proxy_set_header Host $host;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection 'upgrade';
  }
}

6. Deploy Frontend

cd ../frontend
npm run build
sudo cp -r build/* /var/www/html/

Update Nginx:

location / {
  root /var/www/html;
  index index.html;
  try_files $uri /index.html;
}

Now your app is live at your EC2’s public IP.

Containerized Deployment with EKS

1. Dockerize Your App

Backend Dockerfile:

FROM node:18-alpine
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
EXPOSE 4000
CMD ["npm", "start"]

Frontend Dockerfile (optional if separate):

FROM node:18-alpine
WORKDIR /app
COPY . .
RUN npm install && npm run build
RUN npm install -g serve
EXPOSE 3000
CMD ["serve", "-s", "build"]

2. Push to ECR

eval $(aws ecr get-login-password --region us-east-1)
docker tag your-image:latest <aws-account-id>.dkr.ecr.us-east-1.amazonaws.com/your-repo

3. Create EKS Cluster

eksctl create cluster --name my-app --region us-east-1 --nodes 2

4. Deploy with kubectl

kubectl create deployment backend --image=<image-url>
kubectl expose deployment backend --type=LoadBalancer --port=80 --target-port=4000

5. Access the App

Use:

kubectl get services

Look for the EXTERNAL-IP — that’s your app’s public URL!

EC2 vs EKS — Which to Choose?

Scenario	Use This
Simple, low-traffic project	EC2
Need tight control over the server	EC2
Auto-scaling containers/microservices	EKS
Plan to scale and automate deployments	EKS