カスタムDockerイメージの作成

Transcript

1. 1 カスタム Dockerイメージの作成 CircleCIを学ぼうシリーズ　第１弾 舟木 将彦(Masahiko Funaki) Developer Advocate まもなく開始いたします。そのままお待ちください。
2. プレゼンター 舟木 将彦 @mfunaki , @CircleCIJapan CircleCI Developer Advocate 開発者をインスパイヤする お仕事(推し事)です 2 mfunaki /in/mfunaki
3. 3 アジェンダ Dockerコンテナで何が嬉しいのか コンテナの基本 1 2 開発用コンテナの構築 チーム内で開発環境を共通化 3 開発用コンテナ上での開発 アプリ開発、およびテスト 4 CircleCIによる自動化 テスト～デプロイ用コンテナ作成 5 Q&A 時間がない場合はブログにて回答
4. 4 この Webinar を受講すると Dockerコンテナ上で開発をするための環境構築・作業の進め方・ビルド～デプロイについて理解できる。 1. (Node.js + express)環境構築のCircleCIによる自動化 2. Dockerコンテナ上で開発・テストを進める方法 3. アプリ・サービスのDockerイメージ構築のCircleCIによる自動化 リポジトリ 本日使用しているリポジトリは、 - https://github.com/mfunaki/CCI-Img-Node - https://github.com/mfunaki/CCI-App-Node - https://github.com/mfunaki/CCI-App-Node_Work (作業用)の３つです おことわり 個々の操作を行う上で前提としているライブラリやコマンド、プラグインなののインストールや設定について触れておりません(gitコマ ンドのインストールなど)。別途、ブログにて環境構築も含めた説明を公開する予定です。http://circleci.com/ja/blog/
5. 5 Dockerコンテナで 何が嬉しいのか
6. 6 コンテナとは何か？ 一つ一つの荷物を運ばなくても、 箱単位で運ぶことができる (一人じゃなくてチームで ) 箱の大きさが揃っている (船や列車、トンネルの大きさも コンテナの大きさが基準になる ) 輸送効率がアップする
7. 7 コンテナを使った開発とは何か？ 一つ一つの成果物を合わせこまなくても 、 最初からチームで同じ場所で作業できる (一人じゃなくてチームで ) コンテナ内の環境が揃っている (同じコンテナを使っていれば、どの PC/ Mac/Linuxで動作していても同じことが できる) 開発・ビルド・テスト・デプロイ効率 がアップす る
8. 8 開発用コンテナの構築
9. 9 コンテナ作成の流れ 1. GitHub上でリポジトリ作成 2. ローカルPC上にclone 3. Dockerfile作成 4. コンテナ構築用config.yml作成 5. GitHub上のリポジトリ更新 6. CircleCIプロジェクト登録 (環境変数登録) →コンテナ作成 →Docker Hubへプッシュ
10. 10 コンテナ作成の流れ 1. GitHub上でリポジトリ作成 2. ローカルPC上にclone 3. Dockerfile作成 4. コンテナ構築用config.yml作成 5. GitHub上のリポジトリ更新 6. CircleCIプロジェクト登録 (環境変数登録) →コンテナ作成 →Docker Hubへプッシュ
11. 11 コンテナ作成の流れ 1. GitHub上でリポジトリ作成 2. ローカルPC上にclone 3. Dockerfile作成 4. コンテナ構築用config.yml作成 5. GitHub上のリポジトリ更新 6. CircleCIプロジェクト登録 (環境変数登録) →コンテナ作成 →Docker Hubへプッシュ
12. 12 コンテナ作成の流れ 1. GitHub上でリポジトリ作成 2. ローカルPC上にclone 3. Dockerfile作成 4. コンテナ構築用config.yml作成 5. GitHub上のリポジトリ更新 6. CircleCIプロジェクト登録 (環境変数登録) →コンテナ作成 →Docker Hubへプッシュ
13. 13 コンテナ作成の流れ 1. GitHub上でリポジトリ作成 2. ローカルPC上にclone 3. Dockerfile作成 4. コンテナ構築用config.yml作成 5. GitHub上のリポジトリ更新 6. CircleCIプロジェクト登録 (環境変数登録) →コンテナ作成 →Docker Hubへプッシュ
14. 14 コンテナ作成の流れ 1. GitHub上でリポジトリ作成 2. ローカルPC上にclone 3. Dockerfile(定義ファイル)の作成 (express, jest, supertest組込)＋ npm initでpackage.jsonの作成＋ .dockerignoreの作成 4. コンテナ構築用config.yml作成 5. GitHub上のリポジトリ更新 6. CircleCIプロジェクト登録 (環境変数登録) →コンテナ作成 →Docker Hubへプッシュ
15. 15 開発用コンテナ上での Webアプリ開発
16. 16 開発の流れ 1. GitHub上でリポジトリ作成 2. ローカルPC上にclone →VSCodeで開く 3. 先ほどのイメージを使用する Dockerfile作成 4. VSCodeを使い、フォルダを コンテナで開きなおす 5. Node.js(Express)のコード作成 6. 動作確認(コンテナ内から＋コンテナ外 から) 7. GitHub上のリポジトリをコンテナ内から 更新
17. 17 開発の流れ 1. GitHub上でリポジトリ作成 2. ローカルPC上にclone →VSCodeで開く 3. 先ほどのイメージを使用する Dockerfile作成 4. VSCodeを使い、フォルダを コンテナで開きなおす 5. Node.js(Express)のコード作成 6. 動作確認(コンテナ内から＋コンテナ外 から) 7. GitHub上のリポジトリをコンテナ内から 更新
18. 18 開発の流れ 1. GitHub上でリポジトリ作成 2. ローカルPC上にclone →VSCodeで開く 3. 先ほどのイメージを使用する Dockerfile作成 4. VSCodeを使い、フォルダを コンテナで開きなおす 5. Node.js(Express)のコード作成 6. 動作確認(コンテナ内から＋コンテナ外 から) 7. GitHub上のリポジトリをコンテナ内から 更新 8.
19. 19 開発の流れ 1. GitHub上でリポジトリ作成 2. ローカルPC上にclone →VSCodeで開く 3. 先ほどのイメージを使用する Dockerfile作成 4. VSCodeを使い、フォルダを コンテナで開きなおす 5. Node.js(Express)のコード作成 6. 動作確認(コンテナ内から＋コンテナ外 から) 7. GitHub上のリポジトリをコンテナ内から 更新 8.
20. 20 開発の流れ 1. GitHub上でリポジトリ作成 2. ローカルPC上にclone →VSCodeで開く 3. 先ほどのイメージを使用する Dockerfile作成 4. VSCodeを使い、フォルダを コンテナで開きなおす 5. Node.js(Express)のコード作成 6. 動作確認(コンテナ内から＋コンテナ外 から) 7. GitHub上のリポジトリをコンテナ内から 更新
21. 21 開発の流れ 1. GitHub上でリポジトリ作成 2. ローカルPC上にclone →VSCodeで開く 3. 先ほどのイメージを使用する Dockerfile作成 4. VSCodeを使い、フォルダを コンテナで開きなおす 5. Node.js(Express)のコード作成 6. 動作確認(コンテナ内から) 7. GitHub上のリポジトリをコンテナ内から 更新
22. 22 開発の流れ 1. GitHub上でリポジトリ作成 2. ローカルPC上にclone →VSCodeで開く 3. 先ほどのイメージを使用する Dockerfile作成 4. VSCodeを使い、フォルダを コンテナで開きなおす 5. Node.js(Express)のコード作成 6. 動作確認(コンテナ内から＋コンテナ外 から) 7. GitHub上のリポジトリをコンテナ内から 更新
23. 23 テストの流れ 1. テスト用コード作成 2. テスト実行 3. GitHub上のリポジトリを コンテナ内から更新
24. 24 テストの流れ 1. テスト用コード作成 2. テスト実行 3. GitHub上のリポジトリを コンテナ内から更新
25. 25 テストの流れ 1. テスト用コード作成 2. テスト実行 3. GitHub上のリポジトリを コンテナ内から更新
26. 26 CircleCIによる自動化
27. 27 CircleCIによるCI/CD 1. VSCode上でコンテナから抜ける (ローカルのアプリディレクトリを 開く) 2. Dockerfile修正 3. コンテナ構築用config.yml作成 →コンテナ作成 →Docker Hubへプッシュ 4. GitHub上のリポジトリ更新 5. CircleCIプロジェクト登録 (環境変数登録) →CircleCI起動
28. 28 CircleCIによるCI/CD 1. VSCode上でコンテナから抜ける (ローカルのアプリディレクトリを 開く) 2. Dockerfile修正 3. コンテナ構築用config.yml作成 →コンテナ作成 →Docker Hubへプッシュ 4. GitHub上のリポジトリ更新 5. CircleCIプロジェクト登録 (環境変数登録) →CircleCI起動
29. 29 CircleCIによるCI/CD 1. VSCode上でコンテナから抜ける (ローカルのアプリディレクトリを 開く) 2. Dockerfile修正 3. コンテナ構築用config.yml作成 →コンテナ作成 →Docker Hubへプッシュ 4. GitHub上のリポジトリ更新 5. CircleCIプロジェクト登録 (環境変数登録) →CircleCI起動
30. 30 CircleCIによるCI/CD 1. VSCode上でコンテナから抜ける (ローカルのアプリディレクトリを 開く) 2. Dockerfile修正 3. コンテナ構築用config.yml作成 →コンテナ作成 →Docker Hubへプッシュ 4. GitHub上のリポジトリ更新 5. CircleCIプロジェクト登録 (環境変数登録) →CircleCI起動
31. 31 まとめ
32. 32 この Webinar を受講し終わって Dockerコンテナ上で開発をするための 環境構築・作業の進め方・ビルド～デプロイについてご理解いただけたでしょうか？ 1. (Node.js + express)環境構築のCircleCIによる自動化 2. Dockerコンテナ上で開発・テストを進める方法 3. アプリ・サービスのDockerイメージ構築の CircleCIによる自動化 ぜひご自身の環境での適用例や、修正箇所、ご質問等、 ハッシュタグ #CircleCIJp をつけてツイートください！ (@CircleCIJapan のフォローお願いします)
33. 33 Q&A
36. 36 今後のイベント情報通知を→ から登録して自動化しよう！ https://circleci.connpass.com/