いまからでも遅くない！コンテナでWebアプリを動かしてみよう！コンテナハンズオン編

Slide 1

Slide 1 text

Slide 2

Slide 2 text

© 2024 IBM Corporation 2 いまからでも遅くないシリーズ •（1）Gitハンズオン •（2）WebAPIハンズオン •（3）コンテナハンズオン •（4）Reactハンズオン •（5）データベースハンズオン •（6）コンテナオーケストレーションハンズオンコンテナオーケストレーション（OpenShift） Web サーバー API サーバー DB サーバー Gitサーバー Push Deploy PC ベースになる技術「コンテナ」

Slide 3

Slide 3 text

Slide 4

Slide 4 text

© 2024 IBM Corporation 4 免責事項本資料に含まれる情報は可能な限り正確を期しておりますが、記載された内容に関して、日本アイ・ビー・エム株式会社が何ら保証するものではありません。従って、本資料の情報の利用は使用者の責任において為されるものであり、資料の内容によって受けた如何なる被害に関しても一切の補償をするものではありません。アンケートのご協力よろしくおねがいいたします！各セッションに皆さんのご意見を取り入れてアップデートしていきます！ https://app.sli.do/event/cTACof7b2VQSibgykyAH2e

Slide 5

Slide 5 text

Slide 6

Slide 6 text

Slide 7

Slide 7 text

前回の復習 1

Slide 8

Slide 8 text

© 2024 IBM Corporation 8 8 Customer Success, IBM Technology, Japan / © 2024 IBM Corporation コンテナ基礎コンピュータの仮想化の方式の一つで、稼働中のオペレーティングシステム（OS）の一部を分離して他と隔離された専用のエリアを用意し、その上でソフトウェアを動作させる方式をコンテナ型仮想化という。隔離された領域のことをコンテナという。出典：IT 用語辞典 e-Words

Slide 9

Slide 9 text

Slide 10

Slide 10 text

© 2024 IBM Corporation 10 10 Customer Success, IBM Technology, Japan / © 2024 IBM Corporation コンテナ基礎コンテナがないとき（仮想マシン）ハードウェア OS ハイパーバイザーゲストOS ミドルウェアライブラリアプリゲストOS ミドルウェアライブラリアプリゲストOS ミドルウェアライブラリアプリリソース効率起動の遅さ一貫性管理の複雑さサーバー仮想化

Slide 11

Slide 11 text

Slide 12

Slide 12 text

Slide 13

Slide 13 text

© 2024 IBM Corporation 13 13 Customer Success, IBM Technology, Japan / © 2024 IBM Corporation Docker/podman基礎コマンドで表現（podman） Dockerfile Dockerイメージコンテナレジストリ podman build podman push podman pull podman start ※pull + start = run

Slide 14

Slide 14 text

© 2024 IBM Corporation 14 14 Customer Success, IBM Technology, Japan / © 2024 IBM Corporation Dockerfile Dockerコンテナイメージを作成するための設計図や手順書として機能するテキストファイル例）index.htmlにアクセスすると「Hello from Dockerfile」と表示する Apacheサーバー # This is a commant line FROM rhel9:latest MAINTAINER Noriaki Murata LABEL description="A custom Apache container image" RUN yum install -y httpd && ¥ yum clean all ADD training.repo /etc/yum.repo.d/training.repo RUN echo "Hello from Dockerfile" > /var/www/html/index.html EXPOSE 80 ENTRYPOINT ["httpd","-D","FOREGROUND"]

Slide 15

Slide 15 text

Slide 16

Slide 16 text

Slide 17

Slide 17 text

© 2024 IBM Corporation 17 17 Customer Success, IBM Technology, Japan / © 2024 IBM Corporation Docker(podman) Compose Web3層アプリケーションを表現してみる Ngnix Node.js MySQL 8080 ポート 80 ポート 3306 ポート 3000 ポート data 例えば・・・ network host1 host2 host3 /home/hoge/data 3306 ポート

Slide 18

Slide 18 text

© 2024 IBM Corporation 18 18 Customer Success, IBM Technology, Japan / © 2024 IBM Corporation Docker(podman) Compose podmanコマンドで実施 #network作成 $ podman network create --subnet=192.168.100.0/24 --gateway=192.168.100.254 test_network1 # host1起動 $ podman run -d --name host1 --net test_network1 -p 8080:80 ngnix:latest # host2起動 $ podman run -d --name host2 --net test_network1 node:latest # host3起動 $ podman run -d --name host3 --net test_network1 -e MYSQL_USER=mysql -e MYSQL_PASSWORD=password – e ¥ -e MYSQL_DATABASE=my_database MYSQL_ROOT_PASSWORD=password ¥ -v /home/hoge/data/:/var/lib/mysql mysql:latest コマンド複雑標準化デプロイ効率化・自動化マイクロサービスアーキテクチャの台頭 DevOps 促進

Slide 19

Slide 19 text

© 2024 IBM Corporation 19 19 Customer Success, IBM Technology, Japan / © 2024 IBM Corporation Docker composeコマンドで実施 version: '3' services: host1: image: nginx ports: - "8080:80" networks: - test_network1 host2: image: node environment: MYSQL_ROOT_PASSWORD: password MYSQL_DATABASE: my_database MYSQL_USER: mysql MYSQL_PASSWORD: password networks: - test_network1 #host1, host2, host3起動 $ podman-compose up -d host3: image: mysql ports: - "3306:3306" environment: MYSQL_ROOT_PASSWORD: example networks: - test_network1 networks: test_network1: driver: bridge ipam: config: - subnet: 192.168.100.0/24 gateway: 192.168.100.254 ※事前にdocker-compose.ymlファイル準備 Docker(podman) Compose

Slide 20

Slide 20 text

ハンズオンする内容の確認 2

Slide 21

Slide 21 text

Slide 22

Slide 22 text

© 2024 IBM Corporation 22 22 Customer Success, IBM Technology, Japan / © 2024 IBM Corporation ハンズオンする内容の確認システム構成図 podmanコンテナ 8080ポート Webサーバー（WordPress） 80ポートブラウザデータベースサーバー（MariaDB） Wordpress-db Wordpress 3306ポート

Slide 23

Slide 23 text

ハンズオン 3

Slide 24

Slide 24 text

Slide 25

Slide 25 text

Slide 26

Slide 26 text

Slide 27

Slide 27 text

© 2024 IBM Corporation 27 Hello World ▼「Hello World」という文字が返ってくるWebサーバーのコンテナを作成以下コマンドを実行 $ podman run -d --name hello-web -p 8081:80 docker.io/nginx:latest $ podman exec hello-web sh -c “echo ‘Hello World Murata' > /usr/share/nginx/html/index.html" 以下コマンドを実行

Slide 28

Slide 28 text

© 2024 IBM Corporation 28 Hello World ▼「Hello World」という文字が返ってくるWebサーバーのコンテナを作成解説 $ podman run -d --name hello-web -p 8081:80 docker.io/nginx:latest $ podman exec hello-web sh -c "echo 'Hello World' > /usr/share/nginx/html/index.html" コンテナ名ポート番号ベースになるコンテナイメージコンテナ名「Hello World」という文字が書かれたhtmlファイルを保存起動裏でコンテナ内で実行

Slide 29

Slide 29 text

© 2024 IBM Corporation 29 Hello World ▼「Hello World」という文字が返ってくるWebサーバーのコンテナを作成後始末 $ podman stop hello-web $ podman rm hello-web $ podman images REPOSITORY docker.io/library/nginx latest b52e0b094bc0 3 weeks ago 196 MB $ podman rmi b52e0b094bc0

Slide 30

Slide 30 text

Slide 31

Slide 31 text

Slide 32

Slide 32 text

© 2024 IBM Corporation 32 データベースサーバーを立てる以下コマンドを実行 # ネットワークを作成 $ podman network create wordpress-network # データベースサーバーを作成 $ podman run -d --name wordpress-db ¥ --network wordpress-network ¥ -e MYSQL_ROOT_PASSWORD=rootpassword ¥ -e MYSQL_DATABASE=wordpress ¥ -e MYSQL_USER=wordpress ¥ -e MYSQL_PASSWORD=wordpress ¥ mariadb:latest ▼MariaDBサーバーのコンテナを作成

Slide 33

Slide 33 text

© 2024 IBM Corporation 33 データベースサーバーを立てる解説 # ネットワークを作成 $ podman network create wordpress-network # データベースサーバーを作成 $ podman run -d --name wordpress-db ¥ --network wordpress-network ¥ -e MYSQL_ROOT_PASSWORD=rootpassword ¥ -e MYSQL_DATABASE=wordpress ¥ -e MYSQL_USER=wordpress ¥ -e MYSQL_PASSWORD=wordpress ¥ mariadb:latest ▼MariaDBサーバーのコンテナを作成「wordpress-network」という名前のネットワークを作成コンテナ名：wordpress-db ネットワーク：wordpress-network に所属環境変数：以下を設定 MYSQL_ROOT_PASSWORD MYSQL_DATABASE MYSQL_USER MYSQL_PASSWORD コンテナイメージ：MariaDB最新版

Slide 34

Slide 34 text

Slide 35

Slide 35 text

Slide 36

Slide 36 text

© 2024 IBM Corporation 36 Hello World 以下コマンドを実行 # Webサーバー（WordPress）を立てる $ podman run -d --name wordpress ¥ --network wordpress-network ¥ -p 8080:80 ¥ -e WORDPRESS_DB_HOST=wordpress-db ¥ -e WORDPRESS_DB_USER=wordpress ¥ -e WORDPRESS_DB_PASSWORD=wordpress ¥ -e WORDPRESS_DB_NAME=wordpress ¥ wordpress:latest ▼Webサーバー（WordPress）のコンテナを作成

Slide 37

Slide 37 text

© 2024 IBM Corporation 37 Hello World 解説 # Webサーバー（WordPress）を立てる $ podman run -d --name wordpress ¥ --network wordpress-network ¥ -p 8080:80 ¥ -e WORDPRESS_DB_HOST=wordpress-db ¥ -e WORDPRESS_DB_USER=wordpress ¥ -e WORDPRESS_DB_PASSWORD=wordpress ¥ -e WORDPRESS_DB_NAME=wordpress ¥ wordpress:latest ▼Webサーバー（WordPress）のコンテナを作成コンテナ名：wordpress ネットワーク：wordpress-networkに所属ポート番号：8080ポートと80ポートを対応させる環境変数：以下を設定 WORDPRESS_DB_HOST WORDPRESS_DB_USER WORDPRESS_DB_PASSWORD WORDPRESS_DB_NAME コンテナイメージ：WordPress最新版

Slide 38

Slide 38 text

© 2024 IBM Corporation 38 Hello World 解説 # Webサーバー（WordPress）を立てる $ podman run -d --name wordpress ¥ --network wordpress-network ¥ -p 8080:80 ¥ -e WORDPRESS_DB_HOST=wordpress-db ¥ -e WORDPRESS_DB_USER=wordpress ¥ -e WORDPRESS_DB_PASSWORD=wordpress ¥ -e WORDPRESS_DB_NAME=wordpress ¥ wordpress:latest ▼Webサーバー（WordPress）のコンテナを作成コンテナ名：wordpress ネットワーク：wordpress-networkに所属ポート番号：8080ポートと80ポートを対応させる環境変数：以下を設定 WORDPRESS_DB_HOST WORDPRESS_DB_USER WORDPRESS_DB_PASSWORD WORDPRESS_DB_NAME コンテナイメージ：WordPress最新版

Slide 39

Slide 39 text

Slide 40

Slide 40 text

Slide 41

Slide 41 text

Slide 42

Slide 42 text

© 2024 IBM Corporation 42 まとめて立てる version: '3' services: db: image: mariadb:latest volumes: - db_data:/var/lib/mysql restart: always environment: MYSQL_ROOT_PASSWORD: rootpassword MYSQL_DATABASE: wordpress MYSQL_USER: wordpress MYSQL_PASSWORD: wordpress wordpress: depends_on: - db image: wordpress:latest ports: - "8080:80" restart: always environment: WORDPRESS_DB_HOST: db WORDPRESS_DB_USER: wordpress WORDPRESS_DB_PASSWORD: wordpress WORDPRESS_DB_NAME: wordpress volumes: db_data: ▼データベースサーバー、Webサーバー（WordPress）のコンテナを同時に作成 ➀ファイルの作成（docker-compose.yml） ➁ソースコードを貼り付け $ notepad docker-compose.yml $ podman-compose up –d (docker-compose up –d) ③起動！

Slide 43

Slide 43 text

© 2024 IBM Corporation 43 version: '3' services: db: image: mariadb:latest volumes: - db_data:/var/lib/mysql restart: always environment: MYSQL_ROOT_PASSWORD: rootpassword MYSQL_DATABASE: wordpress MYSQL_USER: wordpress MYSQL_PASSWORD: wordpress wordpress: depends_on: - db image: wordpress:latest ports: - "8080:80" restart: always environment: WORDPRESS_DB_HOST: db WORDPRESS_DB_USER: wordpress WORDPRESS_DB_PASSWORD: wordpress WORDPRESS_DB_NAME: wordpress volumes: db_data: 解説コンテナ名：wordpress ポート番号：8080ポートと80ポートを対応させる環境変数：以下を設定 WORDPRESS_DB_HOST WORDPRESS_DB_USER WORDPRESS_DB_PASSWORD WORDPRESS_DB_NAME コンテナイメージ：WordPress最新版まとめて立てる ▼データベースサーバー、Webサーバー（WordPress）のコンテナを同時に作成コンテナ名：db 環境変数：以下を設定 MYSQL_ROOT_PASSWORD MYSQL_DATABASE MYSQL_USER MYSQL_PASSWORD コンテナイメージ：MariaDB最新版