サーバーレス・アーキテクチャを用いたアプリケーションに関する技術カンファレンス “Serverlessconf Tokyo 2018” が開催されたので、昨年に引き続き参加してきました。弊社は「息をするようにサーバーレス」しているので開発手法などの話は食傷気味かもしれないな。。とも思っていたのですが、ところがどっこい多くの学びを得られた 10/30(土) のカンファレンスの総括は別途考えるとして、今回は 10/29(金) に参加した Serverless Tech Challenge — AWS Workshop の話を少し。
Serverless Tech Challenge はチームを組んで お題に沿ったアプリケーションを開発します。我々のチーム “チーム7” は Webチャットを作ることになりました。チャットは昨年もお題にあったようなのですが、今年は昨年にはなかった強い味方 “AWS AppSync” があります。この時点の私の心境を告白すると、「GitHub で AppSync を使ったチャットのサンプルが公開されているし、差別化が難しいかもな・・」と、今思えば随分と余裕ぶっこいていました。。
バックエンドを @k1nakayama さんと @seike460 さんにお任せして、@selmertsx さんと二人で Angular のチャットアプリサンプル を動かすことに。以前にこのサンプルを動かしたことがあったので問題ないだろうと思っていたのですが、取り組み始めてすぐに見たことのないエラーが出て思うように進まないことが分かり、@selmertsx さんには Lambda関数による画像の加工処理を実装していただき、私の方でトラブルシュートしつつ、並行で Vue.js の タスク管理サンプル をセットアップすることになりました。
Vue.js のサンプルも以前に何度も動かしたことがあるので問題ない・・と思ったら、その変化に戸惑う私。ワークショップのつい数日前に AWS Amplify の Vue.js 正式サポートが発表されており、サンプルが新しいツールチェーンである Amplify CLI と AWS AppSync ベースに置き換わっていたのです。
その他にも色々と罠に嵌り、気づいた時には残された作業時間は一時間ほど。。
ここからチャットの機能を実装していくなんて とても無理と思ったのですが、AWS AppSync が真価を発揮することになります。
Amplify に AppSync が統合されたことにより、JSから AppSync (GraphQL) の API を呼び出すのは
return await API.graphql(graphqlOperation(クエリ, パラメータ));
の一行書けば実行できるようになっていました。
実際には GraphQL クエリを書く必要がありますが、そこは Angular のチャットアプリサンプル から拝借して何とか間に合わせることが出来ました。
当日は間に合わなかった Subscription を合わせても 150行ほどしかありません。
