https://zenn.dev/katsukiniwa/articles/cbf19d2b09ed38

og-base_z4sxah.png

概要

2014年にFacebookがGraphQLを発表してからもう8年が経ちました。自分は今までRESTful APIをRailsやExpressで構築したことしかなかったので色々あって去年の年末から素振りしていたGrahpQLについて書いてみることにしました。 構築したアプリケーションはこちらです。素振り目的なので未完成な部分がありますがお許し下さい。ちなみにCSSはTailwind CSS(V2)を使っています。いい加減V3にアップデートしないと笑。

自分が読んだ記事

以前からGraphQLに関する記事は読んでいたので全くわからなった訳ではありませんでした。

構成

バックエンド

GraphQL Rubyを使ってRailsで構築したGraphQLサーバをHerokuにデプロイしています。ユーザのアイコン画像を設定できるようにしたかったのでストレージだけはAWSのS3を使っています。

フロントエンド

URLからわかる通りNext.jsをVercelにデプロイしています笑。 データ通信のコードは

を使って自動生成しています。これは感動しましたね・・・。.graphqlファイルを定義してコマンドを叩くだけで型安全なhooksのコードが自動で生成されてそれをコンポーネントから呼び出すだけで良いわけですから工数を大幅に削減することができました。

技術的な事

バックエンド

GraphQLに関しては全く触ったことがなかったのでとりあえず以下のリンクのtutorialをなぞりました。