DEV Community

Cover image for Deploying a Full-Stack App on AWS ECS with Docker: From Code to Cloud
Sherif sani
Sherif sani

Posted on

Deploying a Full-Stack App on AWS ECS with Docker: From Code to Cloud

In the ever-evolving world of web development, one of the most empowering things you can do is take your application from local development all the way to the cloud — and that’s exactly what I did.

Over the past few days, I built and deployed a full-stack application consisting of a React frontend and an Express.js backend, fully containerized and hosted on AWS ECS using Fargate. Here’s a look behind the scenes of how I transformed lines of code into a cloud-native, production-grade deployment.

The Stack

  • Frontend: React (built with Vite) repo
  • Backend: Node.js + Express repo
  • Containerization: Docker
  • Cloud Hosting: Amazon ECS with Fargate
  • Container Registry: Amazon ECR

Building the Application

The architecture was simple but effective: a React frontend communicating with an Express backend. I began by developing both apps locally and testing them with Docker to ensure container compatibility.

Frontend Setup Highlights

  • Built using Vite for lightning-fast bundling
  • Dockerized into a lightweight Nginx container
  • Served static files from /usr/share/nginx/html

Backend Setup Highlights

  • RESTful API built with Express
  • Dockerized using a minimal Node Alpine base image
  • Exposed port 3000 for requests

Dockerization

Each app was placed in its own Docker container with production-ready configurations.

# Build images
docker build -t doot-frontend .
docker build -t doot-backend .

# Authenticate to ECR
aws ecr get-login-password --region us-east-1 \
  | docker login --username AWS --password-stdin <account-id>.dkr.ecr.us-east-1.amazonaws.com

# Tag and push
docker tag doot-backend <account-id>.dkr.ecr.us-east-1.amazonaws.com/doot-backend
docker push <account-id>.dkr.ecr.us-east-1.amazonaws.com/doot-backend
Enter fullscreen mode Exit fullscreen mode

☁️ Deploying with Amazon ECS + Fargate

Here’s where the magic happened:

🔹 Step 1: Create ECS Cluster

Created a new cluster using Fargate launch type. No EC2 instances needed!

🔹 Step 2: Task Definitions

Defined a task for both the frontend and backend:

  • ECR container image
  • Port mappings
  • Memory/CPU settings

🔹 Step 3: ECS Services

Deployed tasks as services, enabling auto-restarts, load balancing (optional), and easier scaling.

🔹 Step 4: Networking & Security

  • Placed tasks in public subnets
  • Enabled auto-assign public IP
  • Allowed traffic on ports 80 (frontend) and 3000 (backend) using security groups

Going Live

Once deployed, I could access the React frontend via the public IP of the ECS task. It successfully made API calls to the backend.

The satisfaction of seeing everything work together — no server to maintain, fully cloud-native — was amazing.

Key Takeaways

  • Fargate removes the burden of server management.
  • Properly configuring networking and security groups is crucial.
  • Dockerizing both frontend and backend simplifies deployment.
  • Amazon ECR is a reliable and scalable container registry.
  • You don't have to be a cloud expert to get started — just patient and persistent.

Final Thoughts

This project was more than just deploying an app — it was about leveling up.

I bridged the gap between development and DevOps, and it deepened my confidence in building, shipping, and scaling full-stack applications in a modern, cloud-native way.

Top comments (0)