Next.js x GraphQL環境でのAPIモックについて調べる
目的
そもそもどんな選択肢があるのか調査する。
プロジェクトで使用されている方法（Apollo Server）についてハンズオンしたい。
モックの種類とそれぞれの特徴
Next.jsでのモックの選択肢を調べるとざっと下記が出てきた。
- Apollo Server
Playgroundで、APIをブラウザで直接実行・テストするためのツールを提供
モックの機能も提供しており、スキーマからモックデータを自動的に生成可能
- MSW
実際のAPIリクエストをインターセプトして任意のレスポンスを返すことができる。
App Routerにまだ対応していないのが欠点か...
- json-server
シンプルなREST APIサーバーだったら使い道がある？？
- API Routes
エンドポイントが実際のと異なるのでちょっと違うかも。
こうしてみると、Next.js(App Router) * GraphQL環境では今のところApollo Serverでモック作成するのが良いように思える。
感想・残課題
上記やってみたが、Apollo Serverの作成はモック作成とは言わない気がする...
GraphQLがちゃんと理解できていないので、まずは今回ハンズオンした内容が分かるくらいにはキャッチアップしたい。
GraphQLのフロントエンド作成の流れや、バックエンドとのつながり、あとBFFについて理解する。
