Help us understand the problem. What is going on with this article?

Docker で Web サーバを立てて検証環境を作る

概要

静的なサイトやちょっとした js を使ったサイトを作る時に、Web サーバ上でサイトを検証したい時なる事はよくあると思います。  
そんな時に一瞬で手元に Web サーバを作成し、てサクッとブラウザで確認する方法を記録しておきます。(ついでにDocker コンテナ入門もできます

対象

  • Web 開発始めたての人
  • Docker にあまり馴染みのない人

手順

作業時間: 5分位
必要なものは Docker だけです。
自分の OS に合ったものをインストールしてください。

作業

# Docker コンテナの起動
$ docker container run --name web -d -p 8888:80 -v $(pwd):/usr/share/nginx/html nginx:alpine

これでブラウザで localhost:8888 を開くとコンテンツが見れます。

# 停止
$ docker container stop web

# 削除
$ docker container rm web

これで、Docker コンテナが削除されます

解説

今回使っているコマンドは以下の役割を担っています。

docker                           # Docker コマンドです
container                        # コンテナ操作に関するサブコマンドです
run                              # コンテナが起動します
--name <container-name>          # コンテナに名前を付けます
-d                               # コンテナをバックグラウンドで起動します
-p <host-port>:<container-port>  # ホスト(今回は自分のPC)のポートとコンテナのポートをポートフォワーディングします
-v <host_path>:<container_path>> # ホストのボリュームをコンテナにマウントします(ファイルが共用になります
nginx:alpine                     # コンテナのイメージを選択します

docker-compose を使ったパターン

上記で紹介したコマンドを yaml コードにすると以下になります。
docker-compose というツールを使います。(Docker をインストールすると入ってます)
これは、複数のコンテナを操作するのに便利ですが、1つ以上のコンテナを管理するのに使えます。
コマンドを覚える必要がなくなるので、こちらもおすすめです。

使う場合は自分の作業ディレクトリに docker-compose.yaml を作成し、以下をコピペしてください。

docker-compose.yaml
version: "3"
services:
  web:
    image: nginx:alpine
    ports:
      - 8888:80
    privileged: true
    volumes:
      - "./:/usr/share/nginx/html"

操作は以下の通りです。

# Docker コンテナの起動
$ docker-compose up -d

# 停止
$ docker-compose stop

# 削除
$ docker-compose rm
Asuforce
こんにちは、本業は SRE ですが色々やってます
https://asuforce.com
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away