Efficient development with GraphQL

My talk at GraphQL Osaka 2019

Transcript

1. Efficient development with GraphQL GraphQL Osaka 2019
2. { me: { name, avatar, jobs, communities } } { me: { name: “murajun1978”, avatar: , jobs: [“Web developer”], communties: [ “Shinosaka.rb”, “Rails Follow-up Osaka”, “Osaka Web Developers Meetup”, “Open Source Software Developers Osaka” ] } }
3. リーンソフトウェア開発 • ムダを排除する • 知識を作り出す • 決定をできるだけ遅らせる • できるだけ早く提供する • チームに権限を移譲する • 全体を最適化する • 品質を作り込む
4. いかに効率よく最速で かつ 必要最低限のコストで 高品質なアプリケーションを 継続的に開発できるのか
5. ムダを排除する
6. アプリケーションを開発するたびに フロントエンドで バックエンドAPIのClientを作る
7. まじめんどくさいし コストもかかる
8. Apollo GraphQL
9. Apollo Server • GraphQL.jsベースのGraphQL Server • Web Frameworkに対応 ◦ Express ◦ Koa ◦ Hapi ◦ Hastify ◦ Amazon Lambda ◦ Micro ◦ Azure Functions ◦ Google Cloud Functions • OSS
10. Apollo Server Demo
11. アプリケーションを開発するたびに フロントエンドで バックエンドAPIのClientを作る
12. GraphQL Code Generator https://graphql-code-generator.com/
13. GraphQL Code Generator • GraphQLのschemaから型定義やクライアント用のコードを生成 • ResolverのTypeScript型定義 • React Apolloのコード生成 • 他にもpluginがある ◦ https://graphql-code-generator.com/docs/plugins/
14. GraphQL Code Generator Demo
15. できるだけ早く提供する
16. バックエンドの開発が終わるまで フロントエンドの開発に着手できない もしくは できるけど手戻りがあったりする
17. Mocking
18. Apollo Server Mocking • Apollo Serverをモックサーバにできる • 実装が終わったResolverを順次適用していくことができる
19. Apollo Server Mocking Demo
20. 品質を作り込む ✨
21. Apollo Server Integration Testing • 結合テスト用のクライアントを提供 • Jestのスナップショットを使って、Apollo Serverの振る舞いをテストする
22. Apollo Server Integration Testing Demo
23. 開発初期は資金も不足がち 最低限のインフラコストで運用したい
24. Apollo Serverは関係ない？
25. Apollo ServerはServerlessとお友達です
26. Google Cloud Functions
27. Google Cloud Functions • Googleのサーバレスコンピューティング • 毎月無料枠があって、お金がないプロジェクトにはやさしい料金体系 • Node.js v8, v10 (beta) 環境で実行できる • Firebase Toolsで簡単デプロイ
28. Firebase Hosting
29. Firebase Hosting • Googleのホスティングサービス • CloudflareなどのCDNに配信できる • Firebase Toolsで簡単デプロイ
30. まとめ • GraphQL Code Generatorで型定義、クライアントコードを自動生成してくれるの で、めんどうな実装やコストを削減できる • 開発初期はモックサーバとして活用し、実装が終わったResolverを適用していくこ とができるので、フロントエンドとバックエンドが同時に開発できる • フロントエンド、バックエンドともTypeScriptでかけるので、学習コストを抑えることが できる • Serverlessで動作可能なので、インフラコストも削減できる • 運用面でもServerlessはメリット大です
31. Thank you