What Docker beginners did before setting up the nginx learning environment

What to write in this article

As a front-end engineer, I thought that I should have an understanding not only of coding but also of Web servers, so I wanted to study while playing with nginx. However, I was reluctant to install a web server on my Mac computer and mess with the settings, so I decided to take this opportunity to get started with Docker. While learning the basics of Docker, I record what I did when building the learning environment of nginx.

Register on the official website Docker download

Download and install Docker Desktop from [Docker Official Get Started] 3. There is nothing particularly difficult.

Conducted Docker tutorial

When I started the downloaded Docker, the tutorial screen started. Docker_tutorial.png

You can even clone the tutorial repository, build a docker image and share it to docker hub. When you press the blue button with the command written on it, it will be executed on the console on the right side of the screen. If I press it without knowing it, I started cloning the repository to the Home directory. I have to clean it later.

It takes less than 5 minutes to finish. Read a little explanation and press the button 4 times. That said, little is known about Docker.

Read docker / getting-started

When I thought the tutorial was over, the container itself was documented. The docker-tutorial container is running and can be accessed at http: // localhost.

I will read it because it is written in various ways スクリーンショット 2020-08-24 13.25.51.png

I felt it was a little troublesome because there was a certain amount of sentences, but it contains quite useful information. There are also items that intentionally generate an error and tell you how to deal with it, and it also teaches you how to solve problems that beginners tend to fall into, so let's read it from the beginning without any hassle.

What you can learn from Getting Started

--How to start / stop the container --How to make a simple web application into a docker image --How to use docker hub and play with docker --How to use Volume (Named Volumes, Bind Mounts) --Creating a network --Sample using Node.js and mysql on docker --Using Docker Compose --Docker-compose.yml description --Optimized with build cache --Optimization by Multi-Stage Builds

I read everything properly and spent two days off, but it was well worth reading. We recommend that you do not just read it, but proceed while actually executing the command.

Actually build nginx learning environment

Now that we've finished Getting Started, we're ready to go into action.

Drop the image of nginx

Download the image of [nginx] 1 from Docker Hub There is a quick launch command at the bottom of the nginx image page. Since the / some / content part becomes the so-called hthome, create an appropriate directory and replace / some / content with that path to test. Execute the following command with the -p option and 8080: 80 added to associate with the port of the host machine.

docker run --name some-nginx -v /some/content:/usr/share/nginx/html:ro -dp 8080:80 nginx

When I launch the browser and access http: // localhost: 8080, it becomes 403 Forbidden, but I can confirm that nginx can be started safely. 403 will be resolved later.

Launch from docker-compose

It is difficult to type a long command like the one above every time, and in the future I want to link with other containers, so I will make it possible to start from docker-compose. Create a PJ directory with the following configuration

ProjectRoot/ ┣ docker-compose.yml ┗ static-html-directory/

Write docker-compose.yml, remembering the contents of Getting Started.

version: "1.0"

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

Then, when you hit docker-compose up, the following error occurs

ERROR: Version "1.0" in "./docker-compose.yml" is invalid.

I thought that the version was the version of my system and set it to 1.0, but remembering that it was the schema version of docker-compose at getting started, I rewrote the version to 3.8 and the startup was completed successfully

When I launch the browser and access http: // localhost: 8080, it becomes 403 Forbidden again, and the following error is displayed on the console.

nginx_1  | 2020/08/27 06:59:58 [error] 23#23: *5 directory index of "/usr/share/nginx/html/" is forbidden, client: 172.20.0.1, server: localhost, request: "GET / HTTP/1.1", host: "localhost:8080"

Since / usr / share / nginx is the area Bind Mounted to ./static-html-directory, check the permissions of static-html-directory.

kontam> ls -l
total 16
-rw-r--r--  1 kontam  staff  150  8 27 16:48 docker-compose.yml
drwxr-xr-x  3 kontam  staff   96  8 27 15:56 static-html-directory

All users have read permission, so there seems to be no problem. I thought, I named the following file test.html and stored it under static-html-directory.

<html>
  <body>
    <h1>kontam added this</h1>
  </body>
</html>

After that, when you access http: //localhost:8080/test.html with a browser, the HTML is returned successfully and "kontam added this" is displayed. Since there was no index.html under static-html-directory, when accessing the root, the file list will be displayed, but it seems that it was 403 because the list is disabled by default.

Practice changing settings by connecting to an nginx container

I decided to change the setting to allow this file list display for learning nginx. As a result of google, the basic configuration file of nginx is /etc/nginx/nginx.conf. Let's open the configuration file with vim immediately.

root@d46b1cf2dadf:/etc/nginx# vim /etc/nginx/nginx.conf
bash: vim: command not found

There is no vim ...? If you don't have it, you have no choice but to put it in. I found out that it is a debian system with debian_version under / etc, so install it with apt-get.

apt-get update
apt-get install vim

You can now use Vim safely.

Change settings in nginx.conf

For the setting of autoindex, which is a file list, you can see how to specify it by looking at [nginx official document] 4. To allow nginx to display the file list, specify autoindex on in the location block of the configuration file. When I opened nginx.conf with vim, there was such a description in the http block.

http {
    ...
    include /etc/nginx/conf.d/*.conf;
}

Includes other conf files. Isn't the server block there? I will try to find it. There is a configuration file called default.conf under /etc/nginx/conf.d, so open it. Then, as I expected, the whole server block was written here, and the path specification of hthome was also written. Add the following line here

autoindex on;

This will restart the nginx container

docker-compose down
docker-compose up

When I tried to access http: // localhost: 3000 again, the file list was displayed as I expected. スクリーンショット 2020-08-27 18.06.58.png

It can be said that the learning environment has been set up so that you can safely check the changes while playing with the nginx settings.

Manage configuration files outside the container with Bind Mounts

The learning environment of nginx has been created, but if you just rewrite the configuration file in the container, all the settings will be returned when you recreate the container. It is convenient to be disposable if you learn with the intention of breaking it, but in practice such as building a system, when the container breaks, all the work up to that point may be lost and it is difficult to manage git. I think that the configuration file should be manageable on the file system of the host machine.

I created an nginx directory to store the nginx config files and stored a copy of each config file in it. The PJ directory has the following structure.

ProjectRoot/ ┣ docker-compose.yml ┣ static-html-directory/  ┗ test.html ┗ nginx/  ┣ nginx.conf  ┗ conf.d/   ┗ default.conf

If you specify this nginx directory as volume, the changed settings can be retained even if the container is recreated. Add the volumes part of docker-compose.yml.

version: "3.8"

services:
  nginx:
    image: nginx
    ports: 
      - "8080:80"
    volumes:
      - ./static-html-directory:/usr/share/nginx/html
      - ./nginx/conf.d:/etc/nginx/conf.d
      - ./nginx/nginx.conf:/etc/nginx/nginx.conf

Since it refers to the conf of the host machine, it is easy because you do not have to connect to the docker container each time you change the settings. After that, you can study while changing or breaking the settings as you like.

Summary

--Docker beginners are advised to do [docker / getting-started] 1 first --Getting-It's easy to set up an nginx environment with the knowledge of started

that's all. If you have any mistakes or points for improvement, please comment.

Recommended Posts

What Docker beginners did before setting up the nginx learning environment
What Android development beginners did before releasing the app in 2 weeks
Setting up the FreeBSD desktop environment on Ubuntu + qemu
Setting the baseURL in the axios module of Docker environment Nuxt
What I did when the DB did not start with docker-compose up
Set up a Wordpress Docker environment without using the Worpdress image
Environment construction with Docker for beginners