showKs開発の舞台裏

Japan Container Days v18.12の主催者企画 "showKs"。
開発の経緯と実装についてまとめました。
http://showks.containerdays.jp/

showKs Team
@jacopen @jyoshise @amsy810 @makocchi @kojiha @inductor @tsukaman

Transcript

1. showKs 開発の舞台裏
2. 触れる・作れる・持って帰れる 参加型ショーケース [ showKs ] 必要なのは「やってみるか」の気持ちだけ
3. フォームに入力したら
4. あなた専用のキャンバスができていて
5. GitHubリポジトリや
6. CIパイプラインや
7. CDパイプラインができている
8. ポータルでみんなの絵が見られる
10. いろんなことがありました
11. 発端
12. 発端
13. 停滞
14. 停滞
15. 救世主現る
16. 再起動
17. 9/6 第1回 ミーティング
20. コンセプト決定
21. ✔ クラウドネイティブ開発の体験ができる ✔ アプリごとのリポジトリ ✔ CI/CDパイプライン ✔ PRを活用した開発 ✔ お絵かきアプリというテーマで共同作業感出す ✔ アプリ・マニフェスト・ドキュメント 　全てお持ち帰り可能
22. スペシャルチーム結成 jacopen amsy180 jyoshise makocchi kojiha inductor tsukaman
23. 10/11 よっしゃ開発だ！
25. こんな感じだよね ポータル キャンバス キャンバス キャンバス git git git CI
26. って思うじゃん？
27. 打ち合わせのたびに複雑化する構成
28. 打ち合わせのたびに複雑化する構成
29. CDやりたいよね ポータル キャンバス キャンバス キャンバス git git git CI
30. あ、申し込みフォームいるね。Google Formsとかで ポータル キャンバス キャンバス キャンバス git git git CI Google Form
31. でも重複チェックとか要るよね･･･ ポータル キャンバス キャンバス キャンバス git git git CI Form
32. StagingとProductionわけたいよね Stg ポータル Stg キャンバス Stg キャンバス Stg キャンバス git git git CI Form Stg ポータル Prod キャンバス Prod キャンバス Prod キャンバス git git git
33. てかGitHubに自動でリポジトリ作成しないとね Stg ポータル Stg キャンバス Stg キャンバス Stg キャンバス git git git CI Form Stg ポータル Prod キャンバス Prod キャンバス Prod キャンバス git git git
34. SpinnakerとConcourseのパイプラインも生成要るね Stg ポータル Stg キャンバス Stg キャンバス Stg キャンバス git git git CI Form Prod ポータル Prod キャンバス Prod キャンバス Prod キャンバス git git git
35. アプリ連携アーキテクチャ変えないとね・・・ Stg アグリゲータ Stg キャンバス Stg キャンバス Stg キャンバス git git git CI Form Stg アグリゲータ Prod キャンバス Prod キャンバス Prod キャンバス git git git Stg ポータル Prod ポータル
36. ポータルもちょっと分けて作るわ Stg アグリゲータ Stg キャンバス Stg キャンバス Stg キャンバス git git git CI Form Stg アグリゲータ Prod キャンバス Prod キャンバス Prod キャンバス git git git Stg ポータル Frontend Stg ポータル Backend Prod ポータル Frontend Prod ポータル Backend
37. あ、無くてもうまいこといったわ Stg アグリゲータ Stg キャンバス Stg キャンバス Stg キャンバス git git git CI Form Stg アグリゲータ Prod キャンバス Prod キャンバス Prod キャンバス git git git Stg ポータル Prod ポータル
38. メトリクスをダッシュボードで見たいよね Stg アグリゲータ Stg キャンバス Stg キャンバス Stg キャンバス git git git CI Form Stg アグリゲータ Prod キャンバス Prod キャンバス Prod キャンバス git git git Stg ポータル Prod ポータル
40. 活動時間 22:00〜28:00
44. なんとか完成
45. 各所解説
46. showks-terraform K8sで開発するとしても、k8s外に必要なものが沢山出てき ます。 - k8sそのもの - DNS - オブジェクトストレージ - 踏み台サーバー - スタティックIP ついつい気が緩んで手作業しがちですが、しっかりとコード 化して Infrastructure as codeやりましょう https://github.com/containerdaysjp/showks-terraform
47. showks-form https://github.com/containerdaysjp/showks-form Stg ポータル Stg キャンバス Stg キャンバス Stg キャンバス git git git CI Form Prod ポータル Prod キャンバス Prod キャンバス Prod キャンバス git git git
48. showks-form https://github.com/containerdaysjp/showks-form • ユーザーからの入力に応じて ◦ バリデーション ◦ GitHubにリポジトリ作成 ◦ ベースCanvasのPush ◦ Webhookの設定 ◦ Collaboratorの設定 ◦ Protected Brachの設定 ◦ Concourse Pipelineの生成と反映 ◦ Spinnaker Pipelineの生成と反映
49. showks-form https://github.com/containerdaysjp/showks-form • Rails3くらいまで触ったことがあったので、さっくり作るにはいい よねと採用。Rails5.2 • バリデーション楽ちんで助かった • GitHubはOctokit、GitはRuggedで操作。割と楽だった • 依存するものが多いので、安直にイメージ作るとデカい • Sidekiqで非同期にしたかったけど時間切れで同期処理
50. Concourse Pipeline https://github.com/containerdaysjp/showks-concourse-pipelines showKs関連コンポーネント • showks-form • showks-portal-frontend • showks-aggregator ユーザーのCanvas • showks-canvas-USERNAME これらの • Unit test • Dockerイメージ作成とpush • Prodリリース時はタグの付け替え • k8sマニフェスト作成
51. Concourse Pipeline https://github.com/containerdaysjp/showks-concourse-pipelines
52. GitOps的アプローチ showks-manifest-stg Object Storage manifest-committer pipeline showks-form-stg pipeline showks-aggregator-stg pipeline showks-portal-stg pipeline showks-canvas-USER pipeline
53. よかったこと • 知っているけど試したことがなかった技術を試せた • すごいチームで一緒に作業できた • さび付きがちな『現場感』の維持に役立った
54. 反省点 • テストがないコードはやはりクソ ◦ 時間が無い･･･の言い訳あぶない • プロマネ的な大人が1人くらいは欲しい • ちゃんと寝よう！！！！！
55. showKs’ Continuous Delivery with Spinnaker
56. 俺的showKsのコンセプト（なんとなく結果的に） • 参加者になるべく負担をかけず、かつ「マイクロサービスの開発プロジェクト」の オーナー体験をしてもらう • アプリ自体そこそこ遊べて、かつ大人数で参加して面白いものにする • クラウドネイティブ技術全開で行く • すべて公開/再利用可能なものとする そのために • スケーラビリティ • CI/CDのフルオートメーション • GitHubをSingle source of truthとする
57. 作ったCD環境 stg prod ns: spinnaker ns: showks ns: showks Halyardで デプロイ Terraformで デプロイ
58. CDパイプライン概要(Portal, Aggregator) deploy-to-stg canary-to-prod deploy-to-prod stg cluster prod cluster stg manifest stg image prod manifest prod image CI (stgブランチへ の merge) CI (masterブランチ への merge)
59. CDパイプライン概要(canvas) deploy-to-stg deploy-to-prod stg cluster prod cluster stg manifest stg image prod manifest prod image CI (stgブランチへ の merge) CI (masterブランチ への merge) このパイプライン自体が自動 生成される
60. なぜSpinnakerか
61. なぜSpinnakerか • プラットフォームに依存しない
62. なぜSpinnakerか • プラットフォームに依存しない • なんかクラウドネイティブ感ある
63. なぜSpinnakerか • プラットフォームに依存しない • なんかクラウドネイティブ感ある • 流行ってるしモテそう
64. CDこだわりの攻めポイント （守りに入った途端人は年老いていくのだよ） • Kubernetes V2 Providerの採用 • Pipeline as Codeによるイミュータブルかつ自動的/継続的パ イプライン適用 • Canary release
65. Spinnakerのターニングポイント： Kubernetes V2 Provider Kubernetesの基本的な考え方： • Kubernetes上で動作するワークロードの全ての真実はManifests(YAML)に記述さ れる • Kubernetesは自律的に、適用されたManifestsに記述されている状態に実際のク ラスタの状態を追従させる • 宣言的デプロイ、GitOpsといったCloud Nativeベストプラクティスの根本 Spinnaker Kubernetes V2 Providerは上記を尊重→従来のコンテナイメージ中心の CDパイプラインから、Manifest中心のCDパイプラインへの転換期
66. Pipeline as Codeによるイミュータブルかつ自動的/継続 的パイプライン適用 • もともとSpinnakerに欠けていると言われていたところ ◦ WebUIからしかパイプラインの管理ができない ◦ パイプラインがどのように定義されているのかはブラックボックス だった。
67. Spin CLI • 大したことはできない • でもそれによってむしろ Immutableなパイプライン が実現できるのかも やったこと • Web UIから雛形パイプラ インを作成 • それをspin pipeline getで JSONファイル化 • Pythonでパラメータを置換 して複製
68. カナリアリリース 当初やりたかったこと https://www.spinnaker.io/concepts/pipelines.png
69. カナリアリリース ただしこれは従来のSpinnakerの世界観 ArtifactはDocker Image
70. つまり現状これはうまくいかないようだ（やりかたがわからなかった） カナリアリリース stgクラスタで動い ている deploymentをstg クラスタのアカウ ントで取ってく る？ stgクラスタで動い ている deploymentを prodクラスタのア カウントでデプロ イする？
71. 困った ちなみに先々週の状況です
72. そんな僕の前に天使が舞い降りた
73. annotation書いとくだけで！
74. nginx-ingress-controller 0.21.0で機能リリース
75. CDパイプライン概要(Portal, Aggregator) deploy-to-stg canary-to-prod deploy-to-prod stg cluster prod cluster stg manifest stg image prod manifest prod image CI (stgブランチへ の merge) CI (masterブランチ への merge)
76. その他ハマったこと • 認証でドハマり ◦ Spinnaker自体はユーザー認証の機能を持っていない ◦ 当初GitHub OAuthを使おうとしたがGitHub TeamsのOrganizationじゃないとダメっぽい ◦ Google OAuthにしようとしたらG SuiteのOrganizationじゃないとダメっぽい ◦ 仕方なく単一のgoogleアカウントのみアクセスできるようにした ◦ などなど • Credential管理問題 ◦ Kubernetes各クラスタのCredential、GCSのCredential、GitHubのCredentialなどいろんなところに とっ散らかってしまった ◦ 最初になにか管理手段を確立すべきだった • Spinnakerのドキュメントが謎だらけ ◦ 特にKubernetes V2 Providerは従来のコンセプトをがらりと変えるので既存のドキュメントとの矛盾 が多い、かつ実装が文書化されていないので結局コードを読む羽目に
77. showKsの アプリケーション 実装について @inductor(Twitter: @_inductor_) Kohei Ota @ ZOZO Technologies, Inc
78. アプリで実現したかったこと - ユーザーにただ見せるだけではなく、何らかの形で参加させたい - お絵かきのアプリ！！ - マイクロサービスが動いてることを可視化 - ただ一覧を出すだけじゃなくて、それぞれが独立していること - 管理画面的なもの（ポータルアプリ）を作成してそれぞれのアプリ ケーションにアクセスできるように - （当たり前だけど）コンテナで動くやつ
79. アプリケーションのアーキテクチャ
80. できたもの - Aggregator - Node.jsのKubernetesクライアントを使って、他のPodの情報を取 得、JSONに出力 - Socket通信でサムネなどの情報をリアルタイムに取得して描画 - Canvasからデータを取ってフロントに投げる
81. できたもの - Canvas - お絵かきアプリ - 各コンテナは完全に独立して動く（マイクロサービス的なナニカ） - gRPC等内部のAPI通信は今回要件的に不要だったのためやっていない - データの永続化はスケジュールの都合と要件的にやらず - BFF的な何か
82. できたもの - Portal - シンプルなNuxt.jsベースのアプリ - APIとって表示するだけの簡単な処理とBulmaを使った一覧表示 - 無駄にPWA対応（簡単すぎた） - Universal App的な何かができた - なぜNuxtにしたのか？ - 使ってみたかったから！！！！！ - という気軽な気持ちでやってみれるのがこういうプロジェクトのいいところ
83. 結果的に - マイクロサービス的な何か - マイクロサービスからデータを取ってきていい感じにフロントに投げるBFF的な 何か - APIと通信してデータを表示するUniversalアプリ の3つからなる今っぽい典型的なアプリケーション構成ができた！
84. やりたかったけどやれなかったこと - やっぱデータの永続化やりたかった（要件と時間が主に足りなかった） - RDBもだけどAPIのあたりでメモリキャッシュとか使う案もあるにはあった - パフォーマンスとキャパシティの兼ね合いとかまで詰める時間がなかった - Nuxtというかフロントの勉強不足でデータの動的書き換え処理が間に合わなかった - あんまり普段手を動かさないことをやってみるの面白いのでいいですね - アプリ書ける人の割合少ない問題 :innocent:
85. つらみ
86. やってよかったこと - 日本の中ではK8sに関することをいろいろ知ってるメンツがそこそこ集合しながらいろ んな事ができたというのは本当によかった - 今まで知識では知っていたけど机上の空論でしか話せていなかったことを実際に実現 しながらいろいろハマって学ぶことができた - それぞれみんなが、自分のできることでお互いに貢献できた
87. showKsのこれから
88. やりたいこと沢山ある - サービスメッシュもやりたい - もっとk8sネイティブにしたいし - いろんなアプリを載せてみたいし - アプリ・インフラどちらのエンジニアも学びがある - もっといろんな人に楽しさを分かって欲しい
89. 次回もやります
90. 最後に - We are hiring! - 一緒にshowKsを発展させられる人を募集しています - アプリ書けるって人一緒にやりましょう！！！！！