プログラミング＆実行できるWEBアプリを手作り

PyCon Kyushu 2024 KAGOSHIMA
https://kyushu.pycon.jp/2024/?param=TimeTable

Transcript

1. #PyConK #PyConK_A プログラミング＆実行 できるWEBアプリを手作り PyCon Kyushu 2024 KAGOSHIMA うーたん
2. #PyConK #PyConK_A 自己紹介 2
3. #PyConK #PyConK_A 自己紹介 • うーたん ◦ X：@uutan1108 • 株式会社ゆめみ ◦ 新卒２年目 ◦ サーバーサイドエンジニア • 趣味 ◦ アニメを観ること • お仕事 ◦ サーバーサイド Kotlin 3
4. #PyConK #PyConK_A 栃木から来ました！鹿児島初上陸です！ 4
5. #PyConK #PyConK_A #PyConKyushu をつけて 鹿児島の食べ物、観光地を教えてください！ 5
6. #PyConK #PyConK_A 「プログラミング＆実行できるWEBアプリを手作り」 していきます！ 6
7. #PyConK #PyConK_A 「プログラミング＆実行できるWEBアプリ」 とは 7
8. #PyConK #PyConK_A paiza.io のようなWEBアプリケーション 1. ブラウザ上のエディタに コードを入力 2. 指定された言語をサーバー で実行 3. 結果をブラウザに表示 するアプリケーション 8 https://paiza.io
9. #PyConK #PyConK_A ざっくり構成図 9
10. #PyConK #PyConK_A ざっくり構成図 10 https://paiza.io あらゆる言語を実行する 複雑そうなバックエンド
11. #PyConK #PyConK_A 多分こんな感じ 11
12. #PyConK #PyConK_A ざっくり構成図 12 https://paiza.io あらゆる言語を実行する 複雑そうなバックエンド バックエンドが難しそう なので作ってみる！
13. #PyConK #PyConK_A 目標 13
14. #PyConK #PyConK_A 目標 14 Python でバックエンドを書いて Ruby, Rust のコードの 実行結果をフロントエンドで表示する ※ Ruby, Rust なのは動的型付けと静的型付けの両方動くように作りたかったため
15. #PyConK #PyConK_A 試作品１号 15
16. #PyConK #PyConK_A 16 言語を指定 コードを入力 標準入力を入力 実行結果を出力
17. #PyConK #PyConK_A 実装方針 17
18. #PyConK #PyConK_A 1つのコンテナに Python, Ruby, Rust の 実行環境を作る 18
19. #PyConK #PyConK_A コンテナとは 19
20. #PyConK #PyConK_A コンテナとは コンピューター上に作成された 仮想環境。 コンテナを用いると１つのコン ピュータ上に複数の仮想環境を 作成することができる。 20 コンテナーを使用してアプリケーションを構築、共有、実行する https://www.docker.com/ja-jp/resources/what-container/
21. #PyConK #PyConK_A 1つのコンテナに Python, Ruby, Rust の実行環境を作る 21
22. #PyConK #PyConK_A 1つのコンテナに Python, Ruby, Rust の実行環境を作る 22 １つのコンテナにPython, Ruby, Rust の実行環境がある
23. #PyConK #PyConK_A 試作品１号 1. FastAPI でフロントエンドからコードを受け取る 2. 受け取ったコードをファイルに書き込む 3. FastAPI から ファイルを実行する Shell を実行 4. Ruby, Rust がファイルを実行する 5. Shell の実行結果をフロントエンドに返す 23 ※ FastAPI は Python の Web フレームワーク
24. #PyConK #PyConK_A 作ってみる 24
25. #PyConK #PyConK_A FastAPI でフロントエンドからコードを受け取る 25
26. #PyConK #PyConK_A 受け取ったコードをファイルに書き込む 26
27. #PyConK #PyConK_A FastAPI から ファイルを実行する Shell を実行 27
28. #PyConK #PyConK_A FastAPI から ファイルを実行する Shell を実行 28
29. #PyConK #PyConK_A Python から Shell を実行する # dateコマンドを実行して文字列として結果を得る import subprocess from subprocess import PIPE proc = subprocess.run("ruby main.rb", shell=True, stdout=PIPE, stderr=PIPE, text=True) date = proc.stdout print(data) # Hello World! 29
30. #PyConK #PyConK_A Shell の実行結果をフロントエンドに返す 30
31. #PyConK #PyConK_A できた 31
32. #PyConK #PyConK_A Ruby は動作した 32 $ ruby main.rb < input.txt Python から実行したコマンド
33. #PyConK #PyConK_A Rust も動作した 33 $ rustc main.rs && ./main < input.txt Python から実行したコマンド
34. #PyConK #PyConK_A エラー時も表示される 34 } の忘れ
35. #PyConK #PyConK_A 補足 • input.txt にはフロントエンドから受け取った標準入力の 値を書き込んでいる • input.txt を実行コマンドにリダイレクトさせている 35
36. #PyConK #PyConK_A 何とかできたが、 36
37. #PyConK #PyConK_A 万能な Docker コンテナが出来上がった 37 ※ 後から言語を追加した結果の Dockerfile
38. #PyConK #PyConK_A Dockerfile とは 38
39. #PyConK #PyConK_A Dockerfile とは 39 Docker初心者がDockerfile,Image,Containerの関係を感覚的に理解する https://cpptake.com/archives/491
40. #PyConK #PyConK_A Dockerfile とは 40 Docker初心者がDockerfile,Image,Containerの関係を感覚的に理解する https://cpptake.com/archives/491 Dockerfile が大きくなるとイメージも 大きくなる
41. #PyConK #PyConK_A Dockerfile とは 41 Docker初心者がDockerfile,Image,Containerの関係を感覚的に理解する https://cpptake.com/archives/491 Dockerfile が大きくなるとコンテナも 大きくなる
42. #PyConK #PyConK_A 万能な Docker コンテナが出来上がった 42 ※ 後から言語を追加した結果の Dockerfile
43. #PyConK #PyConK_A イメージもコンテナも大きくて多機能 43 ※ 後から言語を追加した結果の Dockerfile
44. #PyConK #PyConK_A イメージもコンテナも大きくて多機能だが... 44
45. #PyConK #PyConK_A 「Dockerfile を書くベストプラクティス」 を無視していた 45
46. #PyConK #PyConK_A 「不要なパッケージのインストール禁止」 ができていない 46
47. #PyConK #PyConK_A 「不要なパッケージのインストール禁止」ができていない 余分な、又は、あったほうが良いだろうという程度の必須は ないパッケージのインストールを避けてください。例えば、 データベースのイメージであれば、テキストエディタは不要 です。 余分な又は不要なパッケージのインストールを避ければ、イ メージの複雑さ、依存関係、ファイルサイズ、構築時間をそ れぞれ減らせます。 47 Dockerfile を書くベストプラクティス https://docs.docker.jp/develop/develop-images/dockerfile_best-practices.html
48. #PyConK #PyConK_A • イメージのビルドが長すぎる • 少し変更したらビルド失敗 • イメージが大きい 48 ※ 後から言語を追加した結果の Dockerfile
49. #PyConK #PyConK_A 「アプリケーションを切り離す」 もできていない 49
50. #PyConK #PyConK_A 「アプリケーションを切り離す」もできていない 各コンテナはただ１つだけの用途を持つべきです。アプリ ケーションを複数のコンテナに切り離すことで、水平スケー ルやコンテナの再利用がより簡単になります。 コンテナを綺麗（クリーン）に保ち、可能であればモジュー ル化します。コンテナがお互いに依存する場合は、 Docker コンテナ・ネットワーク を使い、それぞれのコンテナを通信 可能にします。 50 Dockerfile を書くベストプラクティス https://docs.docker.jp/develop/develop-images/dockerfile_best-practices.html
51. #PyConK #PyConK_A • １コンテナの複数の機能 • コンテナ間通信なし • 再利用可能なコンテナなし 51 ※ 後から言語を追加した結果の Dockerfile
52. #PyConK #PyConK_A 試作品２号 52
53. #PyConK #PyConK_A ブラウザの画面に変化なし バックエンドを改善する 53
54. #PyConK #PyConK_A 実装方針 54
55. #PyConK #PyConK_A 「Dockerfile を書くベストプラクティス」を意識して 言語ごとにコンテナを分けて実行環境を作る 55
56. #PyConK #PyConK_A 言語ごとにコンテナを分けて実行環境を作る 56
57. #PyConK #PyConK_A 言語ごとにコンテナを分けて実行環境を作る 57 別なコンテナにPython, Ruby, Rust の実行環境がある
58. #PyConK #PyConK_A 複数のコンテナを管理するために Docker Compose を使う 58
59. #PyConK #PyConK_A Docker Compose とは 59 【入門】Docker Composeとは？インストールと使い方 https://www.kagoya.jp/howto/cloud/container/dockercompose/
60. #PyConK #PyConK_A Docker Compose とは Docker Compose によって、複数の コンテナを1度に操作できるように なる。 あらかじめ compose.yaml 上に複数 の Docker コンテナを起動させる定 義をする。 60 【入門】Docker Composeとは？インストールと使い方 https://www.kagoya.jp/howto/cloud/container/dockercompose/
61. #PyConK #PyConK_A 試作品２号 1. FastAPI でフロントエンドからコードを受け取る 2. 受け取ったコードをファイルに書き込む 3. FastAPI から ファイルを実行する Shell を実行 4. Ruby, Rust がファイルを実行する 5. Shell の実行結果をフロントエンドに返す 61
62. #PyConK #PyConK_A 実装方針は変わらないが、 Python, Ruby, Rust のそれぞれのコンテナ間で ファイルの共有しなければならない 62
63. #PyConK #PyConK_A 通常、別コンテナ内のファイルにアクセスできない 63
64. #PyConK #PyConK_A 別コンテナのファイルにアクセスするために 64
65. #PyConK #PyConK_A データ・ボリューム 65
66. #PyConK #PyConK_A データ・ボリュームとは データの保持や共有のために、複数の便利な機能を提供します。 66 コンテナでデータを管理する https://docs.docker.jp/engine/userguide/dockervolumes.html
67. #PyConK #PyConK_A データ・ボリュームとは[図解] 67 複数のコンテナからアクセス 可能なディレクトリ
68. #PyConK #PyConK_A 68 services: web: build: ./server container_name: playground-web volumes: - ./server/app:/app - /var/run/docker.sock:/var/run/docker.sock ports: - 80:8000 ruby: build: ./docker/ruby container_name: playground-ruby volumes: - ./server/app/share:/user/share tty: true compose.yaml
69. #PyConK #PyConK_A 69 services: web: build: ./server container_name: playground-web volumes: - ./server/app:/app - /var/run/docker.sock:/var/run/docker.sock ports: - 80:8000 ruby: build: ./docker/ruby container_name: playground-ruby volumes: - ./server/app/share:/user/share tty: true compose.yaml コンテナ間でボリュームを 共有している
70. #PyConK #PyConK_A もう一つ考えなければならない 70
71. #PyConK #PyConK_A Python のコンテナからRuby, Rust の コンテナに命令しなければならない 71
72. #PyConK #PyConK_A 通常、別コンテナに対してコマンドは実行できない 72
73. #PyConK #PyConK_A 別コンテナに対してコマンドを実行するために 73
74. #PyConK #PyConK_A Docker outside of Docker 74
75. #PyConK #PyConK_A Docker outside of Docker とは コンテナ内からホストマシンのコンテナを操作する方法 75
76. #PyConK #PyConK_A Docker outside of Docker とは[図解] 76 Docker ソケットをホスト OS とコンテナで 共有することでホスト OS を介して命令可能
77. #PyConK #PyConK_A Docker ソケットを共有しているコンテナ version: "3" services: web: build: ./server volumes: - ./server/app:/app - /var/run/docker.sock:/var/run/docker.sock ports: - 80:8000 77 compose.yaml
78. #PyConK #PyConK_A Docker ソケットを共有しているコンテナ version: "3" services: web: build: ./server volumes: - ./server/app:/app - /var/run/docker.sock:/var/run/docker.sock ports: - 80:8000 78 compose.yaml volumes に Docker ソケットを 共有していることを書く
79. #PyConK #PyConK_A Docker outside of Docker の実用例 79
80. #PyConK #PyConK_A 別コンテナに Selenium を分ける • Python のコンテナから Selenium を切り出して テストすることができる • コンテナを分けることで コンテナの起動の時間を 短縮 80 自動テストの実行環境を Dockerでお気軽引っ越し https://techblog.zozo.com/entry/testauto_env_rebuild
81. #PyConK #PyConK_A これで、 コンテナ間でファイルを共有、 コンテナから別コンテナに命令が可能に 81
82. #PyConK #PyConK_A Docker outside of Docker 、データ・ボリューム使えば 言語ごとにコンテナを分けて実行環境を作れる 82
83. #PyConK #PyConK_A 作ってみる 83
84. #PyConK #PyConK_A FastAPI でフロントエンドからコードを受け取る 84
85. #PyConK #PyConK_A 受け取ったコードをファイルに書き込む 85
86. #PyConK #PyConK_A FastAPI から ファイルを実行する Shell を実行 86
87. #PyConK #PyConK_A FastAPI から ファイルを実行する Shell を実行 87
88. #PyConK #PyConK_A Shell の実行結果をフロントエンドに返す 88
89. #PyConK #PyConK_A できた 89
90. #PyConK #PyConK_A 言語ごとにコンテナを分けて作れた • コンテナを役割で分割できた • それぞれのコンテナのイメージが 小さくなった • １つのコンテナが停止しても全て が停止しなくなった 90 Dockerfile
91. #PyConK #PyConK_A Python の話がなかったので Python の話を 91
92. #PyConK #PyConK_A Docker SDK for Python 92
93. #PyConK #PyConK_A Docker SDK for Python Docker Engine API用のPythonライブラリです。コンテナの 実行、コンテナの管理、Swarmsの管理など、dockerコマン ドでできることは何でもPythonアプリの中でできるように なります。 A Python library for the Docker Engine API. It lets you do anything the docker command does, but from within Python apps – run containers, manage containers, manage Swarms, etc. 93 Docker SDK for Python https://docker-py.readthedocs.io/en/stable/
94. #PyConK #PyConK_A このライブラリで コンテナからコンテナに命令をしています 94
95. #PyConK #PyConK_A 95 Docker SDK for Python で操作
96. #PyConK #PyConK_A Docker SDK for Python の使い方 96
97. #PyConK #PyConK_A 97 import docker def run_code(code, language): client = docker.from_env() result = client.containers.get(f"playground-{language}").exec_run(cmd=get_cmd(language)) output = result.output.decode('utf-8') exit_code = result.exit_code return { "result": output, "exit_code": exit_code } def get_cmd(language): if language == "ruby": return ["sh", "-c", "ruby main.rb"] elif language == "rust": return ["sh", "-c", "rustc main.rs && ./main"] ※ Docker SDK for Python に関係がないコードは省略 Python アプリのコード
98. #PyConK #PyConK_A 98 import docker def run_code(code, language): client = docker.from_env() result = client.containers.get(f"playground-{language}").exec_run(cmd=get_cmd(language)) output = result.output.decode('utf-8') exit_code = result.exit_code return { "result": output, "exit_code": exit_code } def get_cmd(language): if language == "ruby": return ["sh", "-c", "ruby main.rb"] elif language == "rust": return ["sh", "-c", "rustc main.rs && ./main"] ※ Docker SDK for Python に関係がないコードは省略 インポート
99. #PyConK #PyConK_A 99 import docker def run_code(code, language): client = docker.from_env() result = client.containers.get(f"playground-{language}").exec_run(cmd=get_cmd(language)) output = result.output.decode('utf-8') exit_code = result.exit_code return { "result": output, "exit_code": exit_code } def get_cmd(language): if language == "ruby": return ["sh", "-c", "ruby main.rb"] elif language == "rust": return ["sh", "-c", "rustc main.rs && ./main"] ※ Docker SDK for Python に関係がないコードは省略 クライアントをインスタンス化 DockerソケットをホストOSと 共有しているので他のコンテナを操作可能
100. #PyConK #PyConK_A 100 import docker def run_code(code, language): client = docker.from_env() result = client.containers.get(f"playground-{language}").exec_run(cmd=get_cmd(language)) output = result.output.decode('utf-8') exit_code = result.exit_code return { "result": output, "exit_code": exit_code } def get_cmd(language): if language == "ruby": return ["sh", "-c", "ruby main.rb"] elif language == "rust": return ["sh", "-c", "rustc main.rs && ./main"] ※ Docker SDK for Python に関係がないコードは省略 コンテナ名を指定してコンテナを取得 フロントエンドからの入力で動的に language 変数が変化
101. #PyConK #PyConK_A 101 言語を指定 language 変数
102. #PyConK #PyConK_A 102 language 変数で指定するコンテナを 変える
103. #PyConK #PyConK_A 103 import docker def run_code(code, language): client = docker.from_env() result = client.containers.get(f"playground-{language}").exec_run(cmd=get_cmd(language)) output = result.output.decode('utf-8') exit_code = result.exit_code return { "result": output, "exit_code": exit_code } def get_cmd(language): if language == "ruby": return ["sh", "-c", "ruby main.rb"] elif language == "rust": return ["sh", "-c", "rustc main.rs && ./main"] ※ Docker SDK for Python に関係がないコードは省略 language 変数を元に実行する コマンドを変化させる
104. #PyConK #PyConK_A 104 import docker def run_code(code, language): client = docker.from_env() result = client.containers.get(f"playground-{language}").exec_run(cmd=get_cmd(language)) output = result.output.decode('utf-8') exit_code = result.exit_code return { "result": output, "exit_code": exit_code } def get_cmd(language): if language == "ruby": return ["sh", "-c", "ruby main.rb"] elif language == "rust": return ["sh", "-c", "rustc main.rs && ./main"] ※ Docker SDK for Python に関係がないコードは省略 指定されたコンテナに対して コマンドを実行
105. #PyConK #PyConK_A 105 import docker def run_code(code, language): client = docker.from_env() result = client.containers.get(f"playground-{language}").exec_run(cmd=get_cmd(language)) output = result.output.decode('utf-8') exit_code = result.exit_code return { "result": output, "exit_code": exit_code } def get_cmd(language): if language == "ruby": return ["sh", "-c", "ruby main.rb"] elif language == "rust": return ["sh", "-c", "rustc main.rs && ./main"] ※ Docker SDK for Python に関係がないコードは省略 コマンドの実行結果を取得
106. #PyConK #PyConK_A 106 import docker def run_code(code, language): client = docker.from_env() result = client.containers.get(f"playground-{language}").exec_run(cmd=get_cmd(language)) output = result.output.decode('utf-8') exit_code = result.exit_code return { "result": output, "exit_code": exit_code } def get_cmd(language): if language == "ruby": return ["sh", "-c", "ruby main.rb"] elif language == "rust": return ["sh", "-c", "rustc main.rs && ./main"] ※ Docker SDK for Python に関係がないコードは省略 フロントエンドに実行結果と Exit コードを返す
107. #PyConK #PyConK_A ブラウザに結果が表示 107 実行結果が表示される
108. #PyConK #PyConK_A ブラウザに結果が表示 108 } の忘れ 実行結果が表示される Exit コードが 0 以外の場合は赤文字
109. #PyConK #PyConK_A まとめ 109
110. #PyConK #PyConK_A 試作品２号を作るハンズオンは本にあります！ 110
111. #PyConK #PyConK_A コードの詳細などは本に書きました！買ってください！ 111 月刊I/O 3月号、4月号に 「プログラミング& 実行できるWEBアプリを手作り」 掲載されたので読んでね
112. #PyConK #PyConK_A ソースコード https://github.com/OHMORIYUSUKE/io-book-playground 112
113. #PyConK #PyConK_A 宣伝 113
114. #PyConK #PyConK_A ゆめみ大技林 '24 技術書典で頒布している技術同人誌に 寄稿したので読んでください！ダウン ロードできます！ 「読むとLTがしたくてたまらなくなる マニュアル」で書きました！ 114
115. #PyConK #PyConK_A 115
116. #PyConK #PyConK_A 116
117. #PyConK #PyConK_A 117
118. #PyConK #PyConK_A 118 エンジニア募集中です ご清聴ありがとうございました