アイザックでは新規事業を Hasura + NestJS + Next.jsのmonorepo構成 で開発しており、その概要について紹介します。
最短でのPMFを狙いたい
アイザックでは新規事業に力を入れており、頻繁に新規事業が立ち上がっています。
立ち上がった新規事業は、PMFを目指しPDCAを回していきます。
このPDCAを高速で回すため、エンジニアとしてはプロダクトを世の中に速くリリースすることが求められます。
開発スピードを上げる要因は様々あると思いますが、今回は実装コスト削減に焦点を当てて構成を検討しました。
全体構成
以下のような構成になっています。
実装コスト削減のポイント
少ないエンジニアでも速いスピードで世の中にプロダクトをリリースできることを目的としています。
HasuraやCodegenによる自動生成で、できるだけコードを書かずに動くものを作ろうがポイントです。
① TypeScriptに言語統一
開発で使用する言語をTypeScriptに統一しています。
これにより開発者の認知負荷を減らしています。
（ネイティブアプリのあるプロジェクトではReact Nativeを使用）
加えてmonorepo構成にすることで、バックエンド・フロントエンド間でコードを共有可能としています。
② API自動生成で、バックエンド実装の一部を実装コストゼロに
Hasuraはテーブル定義から、基本的なCRUDのGraphQL APIを自動生成してくれます。
シンプルな機能であれば自動生成されたAPIを使い、バックエンド実装コストゼロで開発が可能です。
ビジネスロジックはNestJSで
Hasuraが提供してくれるのは単純なCRUD APIなので、ビジネスロジックを含むAPIはNestJSに任せる形にしています。
Hasuraには Remote Schema というオプションがあり、自前のGraphQLサーバーとHasuraのスキーマを結合して、HasuraへのリクエストでNestJSのAPIを使用できるようになります。
③ コード自動生成で、フロントエンドの実装コストを削減
GraphQL Code Generatorは、GraphQLスキーマと欲しいデータのGraphQLクエリをもとに、TypeScriptコードを自動生成してくれるライブラリです。
特にhooks生成が便利で、生成されたhooksをフロントエンドで使うだけでバックエンドとの疎通が可能となります。
開発の流れ
① Hasuraでテーブル作成
HasuraコンソールからGUIでポチポチテーブルを作成します。
② Permissionsを設定
HasuraのPermissionsにてアクセスコントロールの設定をします。
APIを実行したユーザーのRoleごとにアクセス権限の設定ができます。
例えば、自分のユーザーIDと一致するレコードのみ取得可能としたり、あるRoleには一部カラムを見せないようにするなどが可能です。
③ (要すれば)NestJSでの実装
ビジネスロジックを含む場合は、NestJS側で実装します。
HasuraのRemote Schemaにより、NestJS側で実装したGraphQL APIのスキーマがHasuraのスキーマに結合されます。
④ GraphQL Code Generatorでコード自動生成
フロントで欲しいデータのGraphQLクエリを書いて、GraphQL Code Generatorを実行します。
⑤ 生成されたコードを使用してフロントエンド実装
フロント側で、生成されたhooksを呼ぶだけでバックエンドとの通信が可能となります。
まとめ
Hasura + NestJS + Next.jsのmonorepo構成で実装コスト削減を実現しました。
大きなポイントは以下。
- 言語の統一
- バックエンドAPIの自動生成
- フロントエンドコードの自動生成
HasuraやNestJSについての具体的な内容の記事も今後書いていきたいと思います。
👇 aisaac に興味をお持ちの方は、こちらの記事もぜひ。
👇 コーポレートサイト、最近リニューアルしました 💯
