Sign in Subscribe
Nginx

How to Install Nginx as a Reverse Proxy in Docker-Compose on Ubuntu

David Lam

David Lam

— 3 min read
How to Install Nginx as a Reverse Proxy in Docker-Compose on Ubuntu

This guide will show you how to set up Nginx as a reverse proxy using Docker Compose. The reverse proxy will route incoming requests for specific domain names to corresponding internal IP addresses and ports.

Prerequisites:

Before starting, ensure the following conditions are met:

  1. Docker and Docker Compose are installed and running on your Ubuntu system.
  2. Subdomains are properly configured with A records pointing to your server's IP address.
    • For example:
      • n8n.domain.com → 192.168.1.156
      • kuma.domain.com → 192.168.1.156

Step 1: Create directory for Nginx and navigate into it:

mkdir nginx && cd nginx

Step 2: Create Required Subdirectories:

mkdir -p html conf.d logs

Step 3: Create a docker-compose.yml file:

sudo nano docker-compose.yml

Add the following content to the docker-compose.yml file:

version: '3.9'

services:
  nginx:
    image: nginx:latest
    container_name: nginx-reverse-proxy
    ports:
      - "80:80"   # Map HTTP traffic
      - "443:443" # Map HTTPS traffic (if needed in the future)
    volumes:
      - ./html:/usr/share/nginx/html
      - ./conf.d:/etc/nginx/conf.d:ro
      - ./logs:/var/log/nginx
    restart: always

Explanation:

- version: '3.9' : Docker Compose file format
- image: nginx:latest: specifies that the latest official Nginx image from Docker Hub will be used.
- container_name: nginx: assigns a name to the container.
- ports: "80:80": maps port 80 of the container to port 80 on the host machine.
- volumes:
./html:/usr/share/nginx/html : mounts the local html folder to the container’s Nginx web directory, allowing you to serve your own HTML files.
./conf.d/nginx.conf:/etc/nginx/conf.d:ro : mounts the local Nginx configuration files to the container's Nginx configuration directory and make it read only (:ro), ensuring your configuration persists and is not lost when the container is reset or deleted.
./logs:/var/log/nginx: mounts the local logs folder to container's Nginx logs directory. Allows easy access to Nginx logs (e.g., error logs, access logs) from the host system.
- restart: always ensures that the container restarts automatically if it stops or when Docker restarts. ( Auto run when docker startup )

Step 4: Create a HTML Content:

Add an index.html file to this directory:

sudo nano html/index.html

Example HTML content: 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Welcome to Nginx</title>
</head>
<body>
    <h1>Hello, Nginx in Docker Compose!</h1>
</body>
</html>

Step 5: Configure Nginx as a Reverse Proxy:

Create a file default.conf in the conf.d directory to handle reverse proxying:

sudo nano conf.d/default.conf

Add the following configuration:

# Reverse proxy for n8n
server {
    listen 80;
    server_name n8n.domain.com;

    location / {
         proxy_pass http://192.168.1.156:5678;
        proxy_http_version 1.1;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        client_max_body_size 10M; # Adjust as needed for large payloads
    }
}

# Reverse proxy for Kuma
server {
    listen 80;
    server_name kuma.domain.com;

    location / {
         proxy_pass http://192.168.1.156:3001;
        proxy_http_version 1.1;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        client_max_body_size 10M; # Adjust as needed for large payloads
    }
}

Step 6: Verify The Directory Structure: 

nginx/
├── docker-compose.yml
├── html/
│   └── index.html
└── conf.d/
    └── default.conf

Once verified, proceed to start the container!

Step 7: Start the Nginx Container:

Launch Nginx using Docker Compose:

sudo docker-compose up -d

This will start the Nginx container in detached mode.

Step 8: Test the Setup:

  1. Access the Default Page: Open your browser and visit your server's IP address or domain (e.g., http://your-server-ip). You should see the sample HTML page with "Hello, Nginx in Docker Compose!".
  2. Test Reverse Proxy:
    • Visit http://n8n.domain.com to check if it routes to 192.168.1.156:5678.
    • Visit http://kuma.domain.com to check if it routes to 192.168.1.156:3001.

Step 9: Monitor Logs (Optional)

To troubleshoot or monitor Nginx activity, view the logs:

docker-compose logs -f nginx
Breakdown of the Command:
- docker-compose logs : Displays the logs generated by containers in the Docker Compose application. Each container writes logs (such as access logs, error messages, or custom application logs), which can be monitored with this command.
- -f: Short for "follow." This option allows you to view log output in real-time. As new log entries are generated, they are immediately displayed in the terminal.
- nginx: The service name defined in the docker-compose.yml file. In this case, it's the nginx service.

Congratulations! You’ve successfully installed and configured Nginx in Docker Compose as a reverse proxy on Ubuntu. 🎉

Do you enjoy this blog post?

Read more