k3sとラズパイでフロントエンド開発に挑戦した話 / Frontend Development with k3s and rpi

https://rancherjp.connpass.com/event/130488/
https://cnjp.connpass.com/event/127545/

LT発表内容。

Transcript

1. Cloud Native Kansai #03 2019.06.07 @kenfdev k3sとラズパイで フロントエンド開発に挑戦した話
2. ⾃⼰紹介
3. ⾃⼰紹介 • 福⼭ 健 • エンジニア@サイダス@⼤阪
 フロントエンドもバックエンドも両⽅好き • Udemy講師 • JavaScriptエンジニアのためのES6完全ガイド • 実践！AngularJS講座 @kenfdev • OSS Contribution⼤好き • ブログ • https://kenfdev.hateblo.jp/
4. お詫び
5. 昨⽇発表した内容とほとんど同じです
6. やりたかったこと
7. ローカルで開発したNuxt.jsをラズパイにDeploy！
8. あえてk8s(k3s)上で…
9. ToDo https://k3s.io/
10. ToDo •ϥζύΠʹk3sΛΠϯετʔϧ •ARM༻ͷίϯςφΛ࡞੒ •σϓϩΠ༻ͷmanifest࡞੒ •ϥζύΠʹσϓϩΠ
11. ToDo •ϥζύΠʹk3sΛΠϯετʔϧ •ARM༻ͷίϯςφΛ࡞੒ •σϓϩΠ༻ͷmanifest࡞੒ •ϥζύΠʹσϓϩΠ
12. ラズパイにk3sをインストール https://kenfdev.hateblo.jp/entry/2019/03/11/193034
13. ToDo •ϥζύΠʹk3sΛΠϯετʔϧ •ARM༻ͷίϯςφΛ࡞੒ •σϓϩΠ༻ͷmanifest࡞੒ •ϥζύΠʹσϓϩΠ
14. ここで苦労しました…
15. ARM⽤のコンテナを作成 FROM arm32v7/node:12-alpine RUN mkdir -p /usr/src/nuxt-app WORKDIR /usr/src/nuxt-app RUN apk update && apk upgrade RUN apk add git COPY . /usr/src/nuxt-app/ RUN npm install RUN npm run build EXPOSE 5000 ENV NUXT_HOST=0.0.0.0 ENV NUXT_PORT=5000 CMD [ "npm", "start" ] ͜͜Ͱඞͣࢭ·Δɻɻɻ alpineͰϏϧυͰ͖ͳ͍ʂ
16. ARM⽤のコンテナを作成 FROM arm32v7/node:12 RUN mkdir -p /usr/src/nuxt-app WORKDIR /usr/src/nuxt-app RUN apt-get update && apt-get upgrade -y RUN apt-get install -y git COPY . /usr/src/nuxt-app/ RUN npm install RUN npm run build EXPOSE 5000 ENV NUXT_HOST=0.0.0.0 ENV NUXT_PORT=5000 CMD [ "npm", "start" ] WARNING͍ͬͺ͍ग़͚ͯͨͲɺ׬੒ʂ alpine͸அ೦…
17. マルチアーキテクチャなイメージも作成 ARMͰ΋x86Ͱ΋”kenfdev/multiarch-nuxt:1.0”ͰΠϝʔδࢦఆՄೳʂ ʢGrafana͔ΒύΫ͖ͬͯ·ͨ͠ʣ
18. ToDo •ϥζύΠʹk3sΛΠϯετʔϧ •ARM༻ͷίϯςφΛ࡞੒ •σϓϩΠ༻ͷmanifest࡞੒ •ϥζύΠʹσϓϩΠ
19. デプロイ⽤のmanifest作成 service.yaml deployment.yaml
20. ToDo •ϥζύΠʹk3sΛΠϯετʔϧ •ARM༻ͷίϯςφΛ࡞੒ •σϓϩΠ༻ͷmanifest࡞੒ •ϥζύΠʹσϓϩΠ
21. ラズパイからkubeconfigコピー ~/.kube/config(ϩʔΧϧ) ϥζύΠͷIPʹ͢Δʂ /etc/rancher/k3s/k3s.yaml(ϥζύΠ) →
22. ラズパイにデプロイ！
23. 終わらない！
24. コンテナイメージでかすぎ！ ʂ859MBʂ alpine͡Όͳ͍πέ͕·Θ͖ͬͯͨͷ͔…
25. 待つこと10分弱・・・
26. デプロイされた！
27. 助けてください
28. まとめ •k3s+ϥζύΠ্ʹNuxt.jsΛσϓϩΠͰ͖ͨ •1ϊʔυͳͷͰ͋Γ͕ͨΈ͸·ͩମݧͰ͖ͣ •DX(Developer Experience)͸·ͩ·ͩվળͷ༨஍͋ Γ •alpineͰnpm install੒ޭ͢Δํ๏஌Γ͍ͨ •ιʔεม͑ͯͳ͍ͷʹΩϟογϡ͖͔ͳ͍ཧ༝Λ ஌Γ͍ͨ
29. いっそのことやっぱりx86/x64 https://amzn.to/2MwZniV
30. ご清聴ありがとうございました！