react + graphql + apollo

graphql

APIのクエリ言語

REST APIの違い

• それぞれのAPIごとにエンドポイントを作成しなくても良い(1つのエンドポイントだけで良い)
• 必要なデータだけを取得できる

Apollo

• フロント・バックエンドライブラリ
  

npm install @apollo/server graphql graphql-tag

https://www.apollographql.com/docs/apollo-server/v2/getting-started

get started通りに作成していく.

• Query
  • select
• Mutation
  • insert, update, delete

入門：https://zenn.dev/yoshii0110/articles/2233e32d276551
コード自動生成：https://qiita.com/yoshii0110/items/b461e608dc0cff78982e
next.js(app routerでの動かし方): https://zenn.dev/yuta4j1/articles/nextjs-apollo-starter

コードの自動生成

REST APIなんかでは返ってきた値を元に型を作成しないといけないのでそこに主導ミスがあるかもしれない。