0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

Dockerで遊んで、Docker構築を身近なものにする!

Posted at

経緯

Dockerは、様々な開発現場で使われるが
初期メンバーが設定後、ほとんど触ることがない。

環境構築という大きな障害を取り払えてるのでいいことだと思う。

ただ、Dockerの学習コストや、開発言語の学習が優先されることが多いので
Dockerの学習が後回しになりがちになっていると思う。

なので、Docker学習の第一歩として簡単に環境構築が出来る成功体験を積むことができれば
Dockerへの学習への意欲が沸くのではと思い記載します。

Dockerで作成するもの

134461368-b513322c-e470-42fe-a281-fca4242a4aa5.png

「Reichat」というおえかきチャット。
ワコムのペンタブレットに対応しているらしい
複数人で同じ画面に絵を描くことが可能

環境構築手順

dockerのコマンドなどは後回しでコピペでOKです。
興味出たらぜひ、Dockerの学習してみてください

mac環境で作成してます。
Docker Desktopはインストール前提です

(1) 適当なディレクトリを作成。私の場合は、「Docker_test」

(2) Dockerfileを作成する。
cdコマンドで、 「Docker_test」ディレクトリに移動
touchコマンドで「Dockerfile」作成
vimで記述

FROM node
RUN npm install -g reichat
EXPOSE 10133
CMD reichat

(3)docker-composeを作成する
touchコマンドで「Dockerfile」作成
vimで記述

# docker-composeのバージョン
version: "3" 

services:
  # コンテナの作成
  reichat:
    container_name: 'reichat'
    # このコンテナで使用するDockerイメージの指定
    build:
      context: . 
      dockerfile: "./Dockerfile"
    # ホスト側のポート:コンテナ側のポートを指定
    ports:
      - "10133:10133"

ここまでのディレクトリの状態

スクリーンショット 2023-03-21 15.26.50.png

(4)dockerのコマンドを叩く

docker-compose up -d 

(5) ブラウザを開いて
 http://localhost:10133/
 にアクセス

これが出てくればOK!
名前を入れて入室してください。
スクリーンショット 2023-03-21 15.14.38.png

完成!!
(ゲンガー描いてみました。....いや、フリーハンドだし?タッチパッドだし?)

スクリーンショット 2023-03-21 15.17.35.png

(6) dockerを止める

docker-compose down

はまりポイント

アクセスできない

docker-compose ps

でstateを確認してみてください。
stateが「Exit」になっていたら、環境構築に失敗してます。
スクリーンショット 2023-03-21 15.30.03.png

docker-compose logs

でエラー内容を確認して、google先生に聞いてみましょう!

nodeのバージョンが古い

Dockerfileのこの部分で、nodeをインストールしているのですが、

FROM node:1.1.1

みたいにバージョンを指定している場合、古い可能性があります。

自分の場合は、古かったのでバージョン指定を消しました。

Dockerfileのバージョンを変えた場合は、imagesファイルというものを一回消してから再度構築した方がいいです。
なので、

docker-compose down --rmi local -v 

[参考URL]
https://blog.ryou103.com/post/docker-compose-down/

で綺麗にして、

docker-compose up -d 

で再構築!

docker-compose.ymlファイルの書き方が間違っている

インデントがずれていないかよく確認すること!

あと、context: .の記述が漏れているとbuildが通らないこともあるので注意

    build:
      context: . 

[参考]
https://itenblog.com/docker-compose-up%E3%81%A7%E3%82%A8%E3%83%A9%E3%83%BC/

まとめ

コピペだけで簡単に環境構築できた!!!....と思ってます。

これを機会にdockerに興味を持っていただければ幸いです。
これでお絵描きクイズとかしてください。

参考URL

本記事を書くきっかけ
https://qiita.com/y_hokkey/items/406b5a8c4bc15354d069#reichat

公式サイト
https://github.com/kanreisa/reichat

dockerの基礎の基礎
https://zenn.dev/naoyuki42/articles/ae215286ba92b2

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?