🔯

RailsでGraphQL APIを開発する時によく使うGem

2023/08/13に公開

はじめに

最近、業務の中でRailsを使用してGraphQL APIを開発することが増えました。取得するデータをフロントエンド側から柔軟に変更できるGraphQLは非常に使い勝手が良く、今後も積極的に使っていきたい技術です。
今回は、RailsでGraphQL APIを開発するための個人的によく利用するGemやツールを共有しようと思います。

また、これらのGemを組み込んだ、すぐにRailsでGraphQLの開発を始められるテンプレートリポジトリも公開しています。興味があれば以下のリンクをご覧ください。

👉 hideki-okawa/rails-graphql-template: Rails GraphQL API Template

注: この記事には、GraphQL開発に直接関係のないGemも紹介しています。その点、ご理解のほどよろしくお願いします。

対象読書

  • Railsを使ってGraphQL APIの開発を始める方
  • すでにRailsとGraphQLを組み合わせてAPIを開発している方

🔯 GraphQL関連

graphql-ruby

RubyでGraphQL APIを開発する上でデファクトスタンダートとなっているGemです。
このGemは、GraphQLのスキーマやリゾルバ、ミューテーションなどを効率的に開発するための多くの機能を提供しています。
また、GraphQLの開発サポートする ジェネレータ も利用でき、GraphQL導入時は graphql:install コマンドを実行することで一通り開発に必要なファイルが作成されます。

graphiql-rails

GraphQLの開発やデバッグを効率的に行うために、実際にクエリをブラウザ上で試すことができます。
このGemを導入すると、ローカル環境で http://localhost:3000/graphiql からGraphiQLを利用でき、リアルタイムでGraphQLクエリを試行錯誤しながら開発することが可能です。また、APIドキュメントも同画面上で閲覧できるため非常に便利です。

GitHubリポジトリ: rmosolgo/graphiql-rails: Mount the GraphiQL query editor in a Rails app

別のGraphQL Clientとして Altair GraphQL も高機能で使いやすいです。
ドキュメントから自動でクエリを生成する機能など、便利な機能を持っています。特にChrome拡張はお手軽に利用できお気に入りです。

公式ページ: Altair GraphQL Client
Chrome拡張: Altair GraphQL Client - Chrome ウェブストア

graphql-batch

GraphQLには、クライアントが必要なデータを柔軟に取得できる特徴があります。
しかしその反面、ネストされたデータの取得に伴い、しばしばN+1問題が発生してしまいます。
graphql-batchはこのような問題を解決するためのGemで、DataLoaderという仕組みを導入することで、複数のクエリを最適化し、一度のクエリで関連データをまとめて取得します。

GitHubリポジトリ: Shopify/graphql-batch: A query batching executor for the graphql gem

rubocop-graphql

この後に紹介するのですが、静的コード解析ツールとしてRuboCopを採用しています。しかし、標準のRuboCopではGraphQL特有のベストプラクティスをカバーできていません。
rubocop-graphqlはRuboCopの拡張として提供されており、graphql-rubyのコードベースに対して、ベストプラクティスを適用することができます。

GitHubリポジトリ: DmitryTsepelev/rubocop-graphql: Rubocop extension for enforcing graphql-ruby best practices

🔧 静的コード解析ツールとコードフォーマッタ

RuboCopとPrettier

静的コード解析ツールとしてはRuboCop、コードフォーマッタとしてはPrettierの合わせ技を採用しています。
PrettierはもともとJavaScriptやTypeSciprt向けのコードフォーマッタとして知られていますが prettier/plugin-ruby を導入することでRubyのコードに対しても適用することができます。
また、RuboCopとPrettierのルールが衝突しないよう、.rubocop.yml に以下の設定を加えることでPrettierが提供するRuby用のスタイルガイドをRuboCopにも適用することができます。

.rubocop.yml
inherit_from:
  - node_modules/@prettier/plugin-ruby/rubocop.yml

VSCodeにおける自動フォーマット設定

普段はVSCodeを利用しているので、Prettierの拡張 をインストールすることでコードの保存時にPrettierによる自動コードフォーマットが走るように設定しています。
詳しい設定手順は README に記載していますので気になる方はご覧ください。

参考サイト: 【VSCode+Prettier】Railsのコードを自動フォーマットする - あまブログ

👌 テスト

テストに関連するGemとしては、rspec-railsfactory_bot を採用しています。広く使われているGemなので、ここでは特段記載しません。

🤖 CI

CIツールとしてはGitHub Actionsを利用しており、プルリクエストの変更をトリガーに

  • RSpecによるテスト
  • RuboCopによる静的解析

を実行しています。

RuboCopの実行環境としては reviewdog/action-rubocop を採用しています。これにより、RuboCopの結果をもとにGitHub上に直接コメントが付与されます。また、結果によってはSuggestionも自動で作成されるため、数クリックで修正を行うこともできます。まだ導入しても間もないですが、便利に利用しています。

その他

Annotate

各モデルのスキーマ情報をファイルの先頭に書き出してくれるGemです。実装時にカラムの情報を瞬時に確認できるため重宝しています。

GitHubリポジトリ: ctran/annotate_models: Annotate Rails classes with schema and routes info

最後に

RailsでGraphQL APIを開発する時によく使うGemを紹介してみました。まだまだ、自分の知らないような便利なGemやツールはたくさんあると思いますので、皆さんのおすすめがありましたら、コメント等で教えていただけますと嬉しいです。

Discussion