Docker Compose with Nginx - Step-by-Step Execution

Process Flow - Docker Compose with Nginx

Write docker-compose.yml

↓

Run 'docker-compose up'

↓

Docker Compose reads config

↓

Create Nginx container

↓

Start Nginx service

↓

Nginx listens on port 80

↓

Access Nginx via browser

↓

See Nginx welcome page

This flow shows how Docker Compose reads the configuration, creates and starts an Nginx container, and serves the default page accessible via browser.

Execution Sample

Nginx

version: '3'
services:
  web:
    image: nginx
    ports:
      - "8080:80"

This Docker Compose file defines a service named 'web' using the official Nginx image and maps host port 8080 to container port 80.

Process Table

Step	Action	Evaluation	Result
1	Read docker-compose.yml	Valid YAML and service defined	Configuration loaded
2	Pull Nginx image	Image not present locally	Image downloaded
3	Create container	Using Nginx image	Container created but not started
4	Start container	Container starts successfully	Nginx service running inside container
5	Map ports	Host 8080 to container 80	Port forwarding active
6	Access http://localhost:8080	Browser sends request	Nginx welcome page served
7	Stop container	User stops with Ctrl+C or command	Container stopped
8	Exit	No more commands	Docker Compose session ends

💡 Docker Compose session ends after container is stopped or user exits

Status Tracker

Variable	Start	After Step 3	After Step 4	After Step 6	Final
docker-compose state	Not started	Container created	Container running	Container running	Stopped
Nginx container status	None	Created	Running	Running	Stopped
Port mapping	None	Configured	Active	Active	Inactive

Key Moments - 3 Insights

Why does Docker Compose pull the Nginx image before creating the container?

Docker Compose needs the image locally to create a container. If the image is not found on your machine, it downloads it first as shown in step 2 of the execution table.

What happens if port 8080 on the host is already in use?

Docker Compose will fail to start the container because it cannot bind host port 8080. This would stop the process at step 4 when starting the container.

Why do we map port 8080 on the host to port 80 in the container?

Nginx listens on port 80 inside the container. Mapping port 8080 on the host allows you to access Nginx via localhost:8080 in your browser, as shown in step 6.

Visual Quiz - 3 Questions

Look at the execution table, at which step is the Nginx container actually running?

A Step 4

B Step 2

C Step 3

D Step 6

💡 Hint

Check the 'Result' column for when the container status changes to running.

According to the variable tracker, what is the port mapping status after step 4?

A None

B Configured

C Active

D Inactive

💡 Hint

Look at the 'Port mapping' row and the column for 'After Step 4'.

If you change the port mapping from "8080:80" to "9090:80", what will change in the execution flow?

A Nginx will listen on port 9090 inside the container

B You will access Nginx via http://localhost:9090

C Docker Compose will fail to start

D No change in how you access Nginx

💡 Hint

Refer to the explanation about port mapping in the key moments section.

Concept Snapshot

Docker Compose with Nginx:
- Define service in docker-compose.yml
- Use 'image: nginx' to get official Nginx
- Map host port to container port (e.g., 8080:80)
- Run 'docker-compose up' to start
- Access Nginx via localhost and mapped port
- Stop with Ctrl+C or 'docker-compose down'

Full Transcript

This visual execution shows how Docker Compose uses a simple YAML file to run an Nginx web server inside a container. First, the compose file is read and validated. Then Docker Compose pulls the Nginx image if not present locally. Next, it creates a container from the image and starts it. The container listens on port 80 internally, which is mapped to port 8080 on the host machine. When you open a browser to http://localhost:8080, you see the Nginx welcome page served from inside the container. Finally, stopping the container ends the session. The variable tracker shows the container status and port mapping changing step-by-step. Key moments clarify why image pulling happens first, the importance of port mapping, and what happens if ports conflict. The quiz tests understanding of container states, port mapping, and access URLs.

Practice

1. What is the main purpose of using Docker Compose with Nginx?

easy

A. To replace Nginx with a different web server

B. To run Nginx and other services together easily using a YAML file

C. To write Nginx configuration files in JSON format

D. To compile Nginx from source code automatically

Solution

1. Step 1: Understand Docker Compose role

   Docker Compose helps run multiple services together using a simple YAML file.

2. Step 2: Connect with Nginx usage

   Using Docker Compose with Nginx lets you start Nginx and other needed services easily.

3. Final Answer:

   To run Nginx and other services together easily using a YAML file -> Option B

4. Quick Check:

   Docker Compose + Nginx = easy multi-service setup [OK]

Hint: Docker Compose uses YAML to run multiple services together [OK]

Common Mistakes:

• Thinking Docker Compose changes Nginx config format
• Confusing Docker Compose with Nginx replacement
• Assuming Docker Compose compiles software

2. Which of the following is the correct way to expose port 80 of an Nginx container in a Docker Compose file?

easy

A. publish: 80

B. expose: 80:80

C. ports: - "80:80"

D. port: 80

Solution

1. Step 1: Recall Docker Compose port syntax

   To expose ports, use the 'ports' key with format "hostPort:containerPort" as a list item.

2. Step 2: Match correct syntax

   Only 'ports: - "80:80"' correctly exposes container port 80 to host port 80.

3. Final Answer:

   ports: - "80:80" -> Option C

4. Quick Check:

   Expose ports with 'ports: - "host:container"' [OK]

Hint: Use 'ports: - "hostPort:containerPort"' to expose ports [OK]

Common Mistakes:

• Using 'expose' with port mapping syntax
• Writing 'port' instead of 'ports'
• Using 'publish' which is invalid in Compose

3. Given this Docker Compose snippet, what will happen when you run docker-compose up?

services:
  web:
    image: nginx:latest
    ports:
      - "8080:80"
    volumes:
      - ./site-content:/usr/share/nginx/html:ro

medium

A. Nginx will serve files from /usr/share/nginx/html on port 80 only

B. Nginx will serve default content on port 80

C. Nginx will fail to start due to volume error

D. Nginx will serve files from ./site-content on port 8080

Solution

1. Step 1: Analyze port mapping

   Port 8080 on host maps to port 80 in container, so access via localhost:8080.

2. Step 2: Analyze volume mapping

   Local folder './site-content' is mounted read-only to Nginx's html folder, so custom files are served.

3. Final Answer:

   Nginx will serve files from ./site-content on port 8080 -> Option D

4. Quick Check:

   Port 8080 mapped and volume mounted = custom site served [OK]

Hint: Check ports and volumes to predict container behavior [OK]

Common Mistakes:

• Ignoring port mapping and assuming port 80
• Assuming volume mount fails without error
• Confusing container and host ports

4. You wrote this Docker Compose service for Nginx but after running docker-compose up the container starts but you cannot access Nginx on port 80:

services:
  nginx:
    image: nginx
    ports:
      - "80"
    volumes:
      - ./html:/usr/share/nginx/html

What is the likely cause?

medium

A. Port mapping "80" maps a random host port to container 80; should be "80:80"

B. Volume path './html' does not exist

C. Image name 'nginx' is invalid

D. Missing environment variables for Nginx

Solution

1. Step 1: Check port mapping syntax

   "80" is valid short syntax mapping random host port to container port 80; to bind host port 80 use "80:80".

2. Step 2: Confirm other parts

   Volume path and image name are valid; environment variables are optional for basic Nginx.

3. Final Answer:

   Port mapping "80" maps a random host port to container 80; should be "80:80" -> Option A

4. Quick Check:

   Port mapping must be "hostPort:containerPort" [OK]

Hint: Port mapping needs both host and container ports separated by colon [OK]

Common Mistakes:

• Using single port number without colon
• Assuming volume path error without checking
• Thinking image name 'nginx' is wrong

5. You want to run Nginx with Docker Compose and add a custom configuration file nginx.conf located in your project folder. Which Docker Compose volume setting correctly mounts this file to override the default Nginx config at /etc/nginx/nginx.conf?

hard

A. - ./nginx.conf:/etc/nginx/nginx.conf:ro

B. - ./nginx.conf:/usr/share/nginx/html/nginx.conf

C. - /etc/nginx/nginx.conf:./nginx.conf

D. - ./nginx.conf:/etc/nginx/conf.d/nginx.conf

Solution

1. Step 1: Identify correct Nginx config path

   The main Nginx config file is at /etc/nginx/nginx.conf inside the container.

2. Step 2: Match volume mount syntax

   Mount local nginx.conf to container path with read-only flag ':ro' to override default config safely.

3. Final Answer:

   - ./nginx.conf:/etc/nginx/nginx.conf:ro -> Option A

4. Quick Check:

   Mount local config to /etc/nginx/nginx.conf with ':ro' [OK]

Hint: Mount config file to /etc/nginx/nginx.conf with ':ro' for safety [OK]

Common Mistakes:

• Mounting to wrong container path
• Reversing source and target paths
• Omitting ':ro' for config files