Dockerの構築方法①(環境構築からDockerfileの作成まで)

# 参考動画
Youtuberの山浦さんの動画を参考にDockerを構築していきます。
今回自分はDocker構築初めてです。


https://www.youtube.com/playlist?list=PLs3eD4QT7ow6O5wyRRnRCvB7JMuq_D3-D

# この記事と動画で身に付くこと

- ***Dockerの使い方***
- ***周辺ツール***
- ***Webアプリ環境***
- ***CI/CD***
- ***Linux***
- ***Git***

# 注意
この記事では、***Macで作業***をしていきます。

# Dockerとは
***1台のPCで仮想環境を作り、違うPCでも同じ環境で開発ができます***。
これによって、***アプリを簡単に開発、デプロイができる仕組み***です。
Web系の企業では、ほぼ使っています。Dockerによって
1.***開発環境を簡単に作れる***
2.***開発メンバーの中で、開発環境を統一できる***
3.***テスト環境や本番環境の統一***
ができます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1748789/d6371d7d-ab20-c750-cc0b-f22f0b4f6d8b.png)

> 引用　https://qiita.com/etaroid/items/b1024c7d200a75b992fc

### Dockerがないとなぜ困るのか？
環境構築が大変です。💦みんなそれぞれPCの環境は違います。
人によってエラーが出たり、バージョンが違ったり、OSが違ったりして、
環境構築や開発、デプロイなどが効率悪くなってしまいます。😭

# 環境構築(Mac)
ここで必要なツールは、

1.***iTerm2(ターミナル)***

2.***VSCode***

3.***Docker***

4.***Git***

です。もう入っている方は、作業は不要です。まだの方は下の動画を参考に。

https://www.youtube.com/watch?v=OQ5m9iEbRu0&list=PLs3eD4QT7ow6O5wyRRnRCvB7JMuq_D3-D&index=3&t=477s

### Linuxについて
ここでは解説を省きます。Linuxを全くわからない場合は山浦さんのUdemyをやってみてください。

https://www.udemy.com/course/unscared_linux/?couponCode=ST6MT42324

Linutとシェルについても紙に書いてみました。絵が下手ですみません😭
![IMG_3667.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1748789/49e54dbe-a508-3f3f-c1c0-198e380a350a.jpeg)


# Dockerの使い方、仕組み
Dockerの仕組みを書いていきます。これはYoutubeの動画を引用していきます。

```
docker run hello-world
```
でコマンドを実行します。その時以下の画像のようなことが起こっています。
Dockerはまず、***イメージ(コンテナに必要なものを記載した雛形)から
コンテナ(Dockerの実行環境)を作成***して、***コンテナを起動***させています。

![IMG_3669.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1748789/6346a119-5c3f-adbd-bc74-748dd66fbdc4.jpeg)


上のコマンドの詳細についてです。

①***docker run　hello-worldを実行***
②***実行したコマンドをデーモン(イメージやコンテナを操作するアプリケーション)が受け取って、コマンドを実行する***ように指示
③***hello-worldのdockerのイメージをDockerレジストリから取得。イメージをオンライン上で保存するのがレジストリ***
④***取得したイメージからコンテナ作成***
⑤***コンテナを起動させてHello from dockerと表示***される

![スクリーンショット 2024-04-25 12.29.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1748789/c073dad9-134d-d204-7c34-4c1e303ddb05.png)

> 引用　https://www.youtube.com/watch?v=oHcLtX_DPko&list=PLs3eD4QT7ow6O5wyRRnRCvB7JMuq_D3-D&index=6


# アプリ作成
ここではDockerのイメージとコンテナの基本的な操作をやっていきます。
以下の順番でやっていきます。

![IMG_3670.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1748789/7294b5fd-3408-06ca-7654-5d3f98931692.jpeg)

まずは何かディレクトリを作っていきます。ここではサンプルコードはRubyにします。

まずはWebサーバーを作ります。
```main.rb
require 'webrick'

server = WEBrick::HTTPServer.new(
    DocumentRoot: './',
    BindAddres: '0.0.0.0',
    Port:8000
)

server.mount_proc('/') do |req, res|
    res.body = 'hello'
end

server.start
```

次に```Dockerfile```を作ります。

```Dockerfile
FROM ruby:2.7  

RUN mkdir /var/www
COPY main.rb /var/www

CMD ["ruby","var/www/main.rb"]
```
イメージとしてこんな感じです。

![スクリーンショット 2024-04-25 18.07.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1748789/7a60cb6c-f872-ff38-ea71-4d8531db3fd8.png)

> 引用　　https://www.youtube.com/watch?v=ZxwHVaq7FJo&list=PLs3eD4QT7ow6O5wyRRnRCvB7JMuq_D3-D&index=7

これでイメージの元が完成しました。ここから実行していきます。

- ***イメージ作成***
```
docker image build -t sample/webrick:latest .
```
⚫︎補足
```-t```は***タグ***
***.は今いるディレクトリ***
***sampleが名前空間***
webrickはイメージのタグ名
latestは最新バージョン

次にイメージができたか確認していきます。
```
docker image ls
REPOSITORY                  TAG       IMAGE ID       CREATED              SIZE
sample/webrick              latest    44c9e23f04a0   About a minute ago   864MB
```
次は***イメージからコンテナを作成、起動***します。

```
docker-practice % docker container run -p 8000:8000 --name webrick sample/webrick:latest  
[2024-04-25 09:35:08] INFO  WEBrick 1.6.1
[2024-04-25 09:35:08] INFO  ruby 2.7.8 (2023-03-30) [x86_64-linux]
[2024-04-25 09:35:08] INFO  WEBrick::HTTPServer#start: pid=1 port=8000
```
⚫︎補足
***container runで作成と起動をセット***でやる。
***-pがポートの指定***
***-- name webrickという名前***をつける
***sample/webrick:latest***はイメージ名  

これで立ち上がっているか確認しましょう。ブラウザで、```localhost:8000```を起動。
ここで***helloと表示***されます。ここのhelloはmain.rbの
```rb
server.mount_proc('/') do |req, res|
    res.body = 'hello'
end
```
のレスポンスの部分です。

![スクリーンショット 2024-04-25 18.39.26.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1748789/e66c5ef8-8ac4-b79a-9e56-aedb46827468.png)

## コンテナのライフサイクル(作成、起動、停止、削除)
コンテナのライフサイクルを見ていきます。

1.***作成***
2.***起動***
3.***停止***
4.***削除***

***起動しているコンテナをCtr + cで一回止め***ています。コマンドで止めるなら
```
docker container stop webrick
```
です。停止したコンテナを確認してみましょう。
```
docker container ls -a
```
で***停止中のコンテナも出て***きます。そして***停止中のコンテナを削除***します。
```
docker container remove webrick
```

## コンテナのログ、コマンド実行、掃除
ログ、コマンド実行、掃除はよく使うみたいです。再度コンテナを実行します。
```
docker container run -d  -p 8000:8000 --name webrick sample/webrick:latest
f01e32ea6a2fd2d8e8debbd38f3c4b9b3106b1eccfbe187a99d3f44883f1568f
```
今回は```-d```を使います。***バックグラウンドでコンテナを実行***し、コンテナを停止するまでコンテナのログを表示しないようにするために使用されます。確認すると以下のようになります。

```
docker container ls     
CONTAINER ID   IMAGE                   COMMAND                  CREATED              STATUS              PORTS                    NAMES
f01e32ea6a2f   sample/webrick:latest   "ruby var/www/main.rb"   About a minute ago   Up About a minute   0.0.0.0:8000->8000/tcp   webrick
```

次にログを確認していきます。
```
docker container logs webrick
[2024-04-25 09:52:17] INFO  WEBrick 1.6.1
[2024-04-25 09:52:17] INFO  ruby 2.7.8 (2023-03-30) [x86_64-linux]
[2024-04-25 09:52:17] INFO  WEBrick::HTTPServer#start: pid=1 port=8000
```
実行中の***Dockerコンテナ内でコマンドを実行するためのコマンド***を使います。ここでは、ruby -vを実行します。
```
docker-practice % docker container exec webrick ruby -v
ruby 2.7.8p225 (2023-03-30 revision 1f4d455848) [x86_64-linux]
```

最後に***コンテナの掃除***です。使ってコンテナを一気に消します。
```
docker-practice % docker system prune -a
WARNING! This will remove:
  - all stopped containers
  - all networks not used by at least one container
  - all images without at least one container associated to them
  - all build cache

Are you sure you want to continue? [y/N] 
```
でyesをすると
```
Total reclaimed space: 3.471GB
```
みたいに掃除したコンテナのメモリが出てきます。3GBも使っていたのは、かなりPCを圧迫していました。😅

## dockerのコマンドを忘れたら？
下のコマンドで探すことができます。
```
docker --help
```
で探すことができます。

もしイメージを探す場合は
```
 docker image --help
```
で探すことができます。

# Dockerfile
ここでは***Dockerのイメージを用意***するところです。ここで***開発環境を作る***ことができます。
この画像ですね。

![スクリーンショット 2024-04-25 18.07.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1748789/7a60cb6c-f872-ff38-ea71-4d8531db3fd8.png)

新しく***srcディレクトリを作成***します。その中に、***Gemfileを作りました***。


ここでは、***sinatoraを使用***します。まずはGemfileを使います。
```Gemfile
# fronzen_string_literal: true

source "https://rubygems.org"

git_source(:github) {|repo_name| "https://github.com/#{repo_name}"}

gem 'sinatra'
```







# 資料

https://zenn.dev/norihashimo/articles/cdeed8525e7157


https://reffect.co.jp/laravel/finally-understand-laravel-on-docker#MySQL-2

https://www.amazon.co.jp/dp/B08T961HKP?&linkCode=sl1&tag=read007hhd-22&linkId=29bc109050fe108b456d2eddfd6deb25&language=ja_JP&ref_=as_li_ss_tl