Deploy a 3 Tier container application with Docker Compose

In this project, I am deploying a 3 Tier container application with Docker Compose. The application will have the following:

Tier 1: Frontend: What users see in the browser (like a website).

Tier 2: Backend: The brain of the app, handles requests and talks to the database.

Tier 3: Database Stores actual data like user info, products, etc.

The Application Architecture Diagram:

Components in Our Stack:

Components in Our Stack

How Do The Different Containers Talk to Each Other?

All components are in Docker containers and connected via Docker Compose.

Here’s what happens behind the scenes:

A. User opens the app in a browser (http://ip-of-the-server:80)

B. Frontend (React) is served by Nginx (a lightweight web server)

C. When the user does something (like clicking a button), the frontend makes an HTTP request to the backend (e.g., GET /api/users)

D. Backend (Node.js) receives the request, processes it, and talks to the PostgreSQL database

E. The database sends back the requested data

F. Backend sends that data to the Frontend, which displays it to the user

They all run in separate containers but are connected via a shared Docker network, so they can “talk” to each other using service names (e.g., backend, db).

Why are we using Docker Compose?

1. One command to spin everything up: docker-compose up -d

2. No dependency conflicts, everything runs in containers

3. Easy to replicate across teams or environments

4. It looks like a mini version of how real production apps run in the cloud

Summary of Each Service:

1. Frontend: Built using React + Tailwind CSS. Served with Nginx for speed and production readiness. React app talks to backend using fetch/AJAX requests

2. Backend: Built using Node.js + Express. Exposes REST API endpoints. Connects to Postgres. Contains business logic (like authentication, validation, etc.)

3. Database: Using PostgreSQL 15 official Docker image. Stores data persistently

Steps to deploy the application (All commands are in Italic font):

1. SSH to the machine (I am using AWS EC2 Instance and Amazon-provided Ubuntu 24.04 LTS AMI). Install docker and docker compose. If you need help, refer to:

Docker Installation: https://youtu.be/onF8QS9DMQA

Docker compose installation: https://youtu.be/JAzg2TjuyRI

1. mkdir project

2. sudo apt install git -y # For ubuntu and sudo yum install git -y # For rpm-based OS like RHEL, CentOS Fedora etc

3. cd project

4. Setup SSH-Based authentication to GitHub (optional)

5. For SSH-Based authentication: git clone -b react-tailwind-website git@github.com:bhavukm/3tier-react-tailwind.git

6. For HTTP-Based authentication: git clone -b react-tailwind-website https://github.com/bhavukm/3tier-react-tailwind.git

7. cd 3tier-react-tailwind

8. docker compose up -d

9. docker compose ps

10. docker ps

11. Open a browser and access the application: http://server-ip:80

12. docker images

13. To destroy all resources created by docker compose: docker compose down — rmi all -v

YouTube Video for step-by-step-instructions: https://youtu.be/IfninEwngMU

GitHub Repo: https://github.com/bhavukm/3tier-react-tailwind.git

Note Please change the branch to: react-tailwind-website