Nginx Tutorial (1) — Start a static web server using Nginx and Docker

Chuan Zhang
4 min readOct 17, 2021

--

In this tutorial, I am going to demonstrate how to deploy a toy static web server using Nginx and Docker container.

First, we need docker installed on our working machine. There have been a lot of materials (documents, tutorials, etc) available online demonstrating how to install docker in different operating systems. Here we just simply assume we have docker installed already.

Prepare web page, nginx configuration file and dockerfile

As the main goal of this tutorial is to demonstrate how to deploy a static web server, I am going to use a very simple web page. To deploy webs with much more abundant contents, the underlying process is essentially the same. Below is the content of the web page.

Nginx is an open source software, which can be used for different purposes, such as web server, reverse proxy, load balancer, api gateway, media streaming server, and so on. Nginx was written by Igor Sysoev originally to solve the C10K problem. Different from Apache, Nginx has event-driven, asynchronous architecture. It has become the fastest web server and widely used by many users. The diagram below illustrates the architecture of Nginx.

Nginx Architecture

The snippet below demonstrates an example configuration file for nginx.

In the above configuration file, we specified the root directory of our static web server is: /usr/share/nginx/html, and the index web page is: index.html, which we have provided above. Now to complete our demo, we need to configure our docker container. Again, in this first demo, we only use the simplest (minimal) configuration, just to demonstrate how it works.

Deploying the static web server

Now we are ready to deploy our toy static web server. First, simply copy the three files onto the host machine, if it is not the machine on which we prepared the files. Then build the docker image as follows:

$ docker build . -t nginx-demo-01
[+] Building 3.6s (8/8) FINISHED
=> [internal] load build definition from Dockerfile 0.0s
=> => transferring dockerfile: 37B 0.0s
=> [internal] load .dockerignore 0.0s
=> => transferring context: 2B 0.0s
=> [internal] load metadata for docker.io/library/nginx:1.21.3-alpine 1.1s
=> [1/3] FROM docker.io/library/nginx:1.21.3-alpine@sha256:1ff1364a1c4332341fc0a854820f1d50e90e11bb0b93eb53b47dc5e10c680116 2.2s
=> => resolve docker.io/library/nginx:1.21.3-alpine@sha256:1ff1364a1c4332341fc0a854820f1d50e90e11bb0b93eb53b47dc5e10c680116 0.0s
=> => sha256:1ff1364a1c4332341fc0a854820f1d50e90e11bb0b93eb53b47dc5e10c680116 1.43kB / 1.43kB 0.0s
=> => sha256:af466e4f12e3abe41fcfb59ca0573a3a5c640573b389d5287207a49d1324abd8 1.57kB / 1.57kB 0.0s
=> => sha256:513f9a9d8748b25cdb0ec6f16b4523af7bba216a6bf0f43f70af75b4cf7cb780 8.25kB / 8.25kB 0.0s
=> => sha256:a0d0a0d46f8b52473982a3c466318f479767577551a53ffc9074c9fa7035982e 2.81MB / 2.81MB 0.6s
=> => sha256:4dd4efe90939ab5711aaf5fcd9fd8feb34307bab48ba93030e8b845f8312ed8e 7.15MB / 7.15MB 1.3s
=> => sha256:c1368e94e1ec563b31c3fb1fea02c9fbdc4c79a95e9ad0cac6df29c228ee2df3 602B / 602B 0.6s
=> => sha256:3e72c40d0ff43c52c5cc37713b75053e8cb5baea8e137a784d480123814982a2 891B / 891B 0.8s
=> => extracting sha256:a0d0a0d46f8b52473982a3c466318f479767577551a53ffc9074c9fa7035982e 0.6s
=> => sha256:969825a5ca61c8320c63ff9ce0e8b24b83442503d79c5940ba4e2f0bd9e34df8 663B / 663B 0.8s
=> => sha256:61074acc7dd227cfbeaf719f9b5cdfb64711bc6b60b3865c7b886b7099c15d15 1.39kB / 1.39kB 1.1s
=> => extracting sha256:4dd4efe90939ab5711aaf5fcd9fd8feb34307bab48ba93030e8b845f8312ed8e 0.4s
=> => extracting sha256:c1368e94e1ec563b31c3fb1fea02c9fbdc4c79a95e9ad0cac6df29c228ee2df3 0.0s
=> => extracting sha256:3e72c40d0ff43c52c5cc37713b75053e8cb5baea8e137a784d480123814982a2 0.0s
=> => extracting sha256:969825a5ca61c8320c63ff9ce0e8b24b83442503d79c5940ba4e2f0bd9e34df8 0.0s
=> => extracting sha256:61074acc7dd227cfbeaf719f9b5cdfb64711bc6b60b3865c7b886b7099c15d15 0.0s
=> [internal] load build context 0.1s
=> => transferring context: 3.89kB 0.0s
=> [2/3] COPY ./nginx.conf /etc/nginx/nginx.conf 0.1s
=> [3/3] COPY ./*.html /usr/share/nginx/html 0.0s
=> exporting to image 0.0s
=> => exporting layers 0.0s
=> => writing image sha256:a6ac65f0f3377fa69a3987ecf94656d6b1725db5544a0ad8c06f63a0a9e91da8 0.0s
=> => naming to docker.io/library/nginx-demo-01 0.0s
Use 'docker scan' to run Snyk tests against images to find vulnerabilities and learn how to fix them
$

Then start a docker container. Here we run our container in detached mode.

$ docker run -d --rm -p 8081:80 --name nginx-demo-01 nginx-demo-01
2be38a6f0fcd0979e0a025d2913d8a1365ae8330a1384c8d3fc22eda1dd0e838
$
$ docker ps
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES
2be38a6f0fcd nginx-demo-01 "/docker-entrypoint.…" 2 seconds ago Up 2 seconds 0.0.0.0:8081->80/tcp, :::8081->80/tcp nginx-demo-01
$

To check the status of the docker container, we can check the logs as follows.

$ docker logs --details nginx-demo-01
/docker-entrypoint.sh: /docker-entrypoint.d/ is not empty, will attempt to perform configuration
/docker-entrypoint.sh: Looking for shell scripts in /docker-entrypoint.d/
/docker-entrypoint.sh: Launching /docker-entrypoint.d/10-listen-on-ipv6-by-default.sh
10-listen-on-ipv6-by-default.sh: info: Getting the checksum of /etc/nginx/conf.d/default.conf
10-listen-on-ipv6-by-default.sh: info: Enabled listen on IPv6 in /etc/nginx/conf.d/default.conf
/docker-entrypoint.sh: Launching /docker-entrypoint.d/20-envsubst-on-templates.sh
/docker-entrypoint.sh: Launching /docker-entrypoint.d/30-tune-worker-processes.sh
/docker-entrypoint.sh: Configuration complete; ready for start up
172.17.0.1 - - [17/Oct/2021:01:16:18 +0000] "GET / HTTP/1.1" 304 0 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/94.0.4606.61 Safari/537.36" "-"
$

We can also directly log into the docker container, and check the status of nginx too.

$ docker exec -it nginx-demo-01 sh
/ # ls
bin etc mnt run tmp
dev home opt sbin usr
docker-entrypoint.d lib proc srv var
docker-entrypoint.sh media root sys
/ # which nginx
/usr/sbin/nginx
/ #
/ #
/ # nginx -v
nginx version: nginx/1.21.3
/ #
/ # nginx -t
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful
/ #
/ #

Finally, we can check out our static web server directly in the web browser.

--

--

Chuan Zhang
Chuan Zhang

No responses yet