2分コーディングで、Next.js + GraphQL Nexus + graphql-codegenを試したのでメモ。
試した様子は こちらに残しているので参考にしてください。
今回の構成でできること
- Next.jsのAPI RoutesでGraphQL Serverを実装
- GraphQLのサーバ側のSchemaや型定義などはGraphQL Nexusがコードから自動生成してくれる
- GraphQLのクライアント側の型定義はgraphql-codegenがコードから自動生成してくれる
感想
- GraphQL ServerはNext.jsのAPI Routesで実装されるので、Vercelとかにサクッとデプロイできるというのは良いと思った
- GraphQL Nexusはコードファーストの思想なので、コード側を書くだけでGraphQL Schemaは自動生成してくれるのは楽。ただし、スキーマファーストで作るとインタフェースが綺麗になり、スキーマ自体が分かりやすいAPIドキュメントになるメリットもあるので、それは失われがちかもと思った。他のGraphQLサーバのライブラリを触ってみないと良いかが判断つかない
- 特にexperimental featureであるnexus-plugin-prismaのcrudは、DBのスキーマが漏れすぎていて正直微妙だと思った
- crudは使わずに自分で実装するなら、インタフェースを綺麗に保ちつつ、手数少なく実装でき、スキーマとコードを合わせる手間も少ない。これなら良いかなと思った
- https://github.com/shibayu36/next-prisma-auth-tutorial/commit/3ec1517769691708914264d0b9a63f79cb5aa494
- https://github.com/shibayu36/next-prisma-auth-tutorial/commit/10d7e647955446d5e5821e9d649cb6a618c61447
- https://github.com/shibayu36/next-prisma-auth-tutorial/commit/c6eac23b3073b59b3c8403d049c4127006d02c06
- graphql-codegenによるクライアント側の型定義の自動生成はとにかく便利なので、基本は導入すべきと思う
メモ
Error: Cannot find module 'graphql'と言われる- peerDependenciesになってるので、
yarn add graphqlで解決
- peerDependenciesになってるので、
RangeError: Maximum call stack size exceededと言われる- next-authをアップデートしたら直った
- 多分 https://github.com/nextauthjs/next-auth/issues/1783
- Nexusの使い方はexamplesを見ると分かりやすい
