Okayama-2018winter-gae-public.pdf

Cookbook 'App Engine' 合同勉強会in大都会岡山 2018/12/22 Masayuki Hayashida ( @hayashiki )

自己紹介 key value 名前林田賢行 Name Hayashida Masayuki Github
@hayashiki 所属 BULB株式会社 VR/機械学習/IoT コミュニティ GCPUGオーガナイザーその他フルリモートワーカー

話すこと AppEngine(GAE) Overview 構成パターン API Endpoint Webhook SPA With Firebase

AppEngineとは GoogleCloud（GCP）の提供するPaaSサービス・Web アプリケーションに設定ファイルを書くだけですぐにデプロイ可能・サーバメンテナンス不要・オートスケール、圧倒的スピンアップの速さ・独自ドメインが割り振られる

で、大事なポイントが

無料で運用できる枠がわりとある個人でのサービス開発スタートアップでの新規開発検証用プロタイプ社内の業務ハックツールなどなど

AppEngine ランタイム環境対応言語 [Java, Python, PHP, Go, Nodejs] 例としてGoであれば、GAE/Goといった表記がされることが多い正確にいうと、FlexibleEnvironment
は自由度の高いGAE 環境がある例えばRuby といった言語サポートも増えるのだが、無料枠がないこともあり、今回の話の対象外としている

Hello World app.yaml runtime: go111 app.go func main() { http.HandleFunc("/",
indexHandler) port := os.Getenv("PORT") log.Printf("Listening on port %s", port) log.Fatal(http.ListenAndServe(fmt.Sprintf(":%s", port), } func indexHandler(w http.ResponseWriter, r *http.Request) { if r.URL.Path != "/" { http.NotFound(w, r) return } fmt.Fprint(w, "Hello, World!") }

デプロイ $ gcloud app deploy

その他機能 Name Description Datastore NoSQLデータベース TaskQueue(Cloud Tasks) 非同期処理ができるタスクキュー Cron(Cloud Sheduler)
スケジューラ GCPのAPI GCP全般 Logging,Debug機能も実はすごいんだが割愛・・・

Demo解説

構成パターン

APIエンドポイントパターン API開発効率が非常にいいバージョン, サービス単位でエンドポイントを付与してデプロイが可能カジュアルにエンドポイントがたてられる

エンドポイント命名 https://[VERSION]‑dot‑[SERVICE]‑dot‑[PROJECT].appspot.com

エンドポイント例 $ gcloud app deploy --version feature $ gcloud app
deploy --version master target service: [base] target version: [feature] target url: [https://base-dot-goa-api01.appspot.com] target service: [base] target version: [master] target url: [https://base-dot-goa-api01.appspot.com]

なにがいいの？個人,開発機,モバイル向け,Mock用ロールバックトラフィック分割（A/B Test）

API開発はgoa使おう goa はGo で実装されたDSL API 雛形( コード) やSwagger( ドキュメント) を生成してくれる
すぐにAppEngine にのせてデプロイすることができる。

まとめサーバ構築、運用しなくていいとかもう色々とびこえている感ありコアなビジネスロジック書くところに集中できる環境

Webhook / Bot パターン Webhookを介してWebサービス同士をつなぐイベント駆動でなく、定期処理も行うBot

Lineだとこんな設定画面

Slackだとこんな画面

Githubだとこんな画面

GithubでのBot・Webhook例 ‑ PRの緊急重要ラベルを定期監視してSlackにPostするBotマン ‑ GithubとSlackのコメントのメンションをSyncさせる

まとめスケジューラ機能をつかった定期Bot としても実装しやすい FaaS でよく使われる使い方であるアプリケーション単位でサービス管理したい場合に有効

SPA パターン HTML,CSS,JavaScriptといったStaticファイルも一緒にデプロイ可能だがリッチなUI/UXがほしい

Vuejsが手っ取り早い index.htmlにVuejsのCDNを組み込めば簡単にSPAが実現可能

index.htmlにCDNをくみこむ <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-s
<title>Okayama!</title> <script src="http://unpkg.com/vue/dist/vue.js"></script <script src="https://unpkg.com/axios/dist/axios.min.js" </head>

データバインディング var app = new Vue({ el: '#app', data: {
tasks: [], newTask: "", }, created: function() { axios.get('/tasks') .then((response) => { this.tasks = response.data.items || [] })}, methods: { addTask: function(task) { let params = new URLSearchParams() params.append('body', this.newTask) axios.post('/tasks', params) .then((response) => { ...

React, AngularでもSPA使いたい Webpack build ビルド先をAppEngineのビルド先に出力

まとめ BackendとFrontend、両方をデプロイすることが可能

With Firebase パターン

FirebaseAuthだけお借りするパターン AppEngine のアプリをFirebase で認証する Firebase が使用するユーザーID を借りてそれ以外の永続化データはDatastore で管理する

FirebaseのFirestore FirebaseのDataBase Firestoreを利用する

AppEngine + Firebase お互いに得意な領域で役割をわける Frontend側はUIを作り込むトコロバッチ処理、複雑なビジネスロジックを含む処理例：1日1回バッチで数万件のアイテムを一括で情報更新、 XXば場合なレポートを作成し、全文検索Index更新し、さらにビジネスロジックが云々・・・

・フロントエンドで、こみいった非同期処理、並行処理など辛みならばAppEnging/GOでGoroutinesをつかう

まとめ FirebaseとAppEngineをハイブリッドに使おう

DDD!!!（どんどんデプロイ）岡山AppEngineハンズオン https://gcpug‑okayama.connpass.com 岡山Go勉強会 https://okayamago.connpass.com/ https://okayamago.connpass.com/event/112138/

ref Next Currency‑GAEGo https://speakerdeck.com/sonatard/next‑currency‑gaego GolangのgoaでAPIをデザインしよう https://tikasan.hatenablog.com/entry/2017/05/08/190000 App Engine アプリのユーザーを Firebase
で認証する https://cloudplatform‑jp.googleblog.com/2016/10/app‑engine‑ firebase.html

Okayama-2018winter-gae-public.pdf

Okayama-2018winter-gae-public.pdf

More Decks by hayashiki

Featured

Transcript