Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
RESTからGraphQL APIへの移行で学んだこと
Search
inoway46
June 22, 2023
Technology
1
330
RESTからGraphQL APIへの移行で学んだこと
めぐろLT会#4にて発表しました。
https://meguro-lt.connpass.com/event/286892/presentation/
inoway46
June 22, 2023
Tweet
Share
More Decks by inoway46
See All by inoway46
フロントエンドでもテストを書きたいのでJestに入門してみた
inoway46
1
1.1k
Other Decks in Technology
See All in Technology
Oracle Base Database Service:サービス概要のご紹介
oracle4engineer
PRO
2
20k
サイボウズフロントエンドの横断活動から考える AI時代にできること
mugi_uno
4
1.4k
AWSの最新サービスでAIエージェント構築に楽しく入門しよう
minorun365
PRO
10
600
モダンな現場と従来型の組織——そこに生じる "不整合" を解消してこそチームがパフォーマンスを発揮できる / Team-oriented Organization Design 20250825
mtx2s
4
480
Claude Code x Androidアプリ 開発
kgmyshin
1
530
GCASアップデート(202506-202508)
techniczna
0
240
AIとTDDによるNext.js「隙間ツール」開発の実践
makotot
4
170
Delegate authentication and a lot more to Keycloak with OpenID Connect
ahus1
0
240
datadog-distribution-of-opentelemetry-collector-intro
tetsuya28
0
240
我々は雰囲気で仕事をしている / How can we do vibe coding as well
naospon
2
210
Rethinking Incident Response: Context-Aware AI in Practice - Incident Buddy Edition -
rrreeeyyy
0
130
Mackerel in さくらのクラウド
cubicdaiya
1
430
Featured
See All Featured
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
44
2.4k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.4k
jQuery: Nuts, Bolts and Bling
dougneiner
64
7.9k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
23
1.4k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
50
5.5k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
1k
Why Our Code Smells
bkeepers
PRO
338
57k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
470
Code Review Best Practice
trishagee
70
19k
Designing Experiences People Love
moore
142
24k
Making the Leap to Tech Lead
cromwellryan
134
9.5k
Transcript
RESTからGraphQL API への移行で学んだこと @inoway46
自己紹介 ・GMOペパボにて主にRailsでECアプリの開発をしてます Twitter: @inoway46 ・Web広告の営業から1年半前にWebエンジニアになりました ・最近は英会話をがんばってます ・麻雀が特技です
技術スタック(簡易版) サーバーサイド ・Rails 7.0、Ruby 3.1、graphql-ruby クライアントサイド ・Web -> Next.js(一部はRailsのview) ・Android
・iOS
なぜGraphQLに移行したのか iOS、Android、Next.jsで使用するAPIを共通化し、開発 効率を高めたい
GraphQLの利点 ・オーバーフェッチ、アンダーフェッチを防げる ・1回のリクエストで必要なデータを取ってこれる ・リクエスト数が少なくなるので、アプリのパフォーマンスがよくなる GraphQLの開発秘話:https://youtu.be/783ccP__No8
GraphQLのキャッチアップ - はじめてのGraphQLを読む - zennのチュートリアルなどで書いてみる - 他社事例を学ぶ - メルカリ社、ZOZO社 -
既存コードを読む - graphiqlで既存のクエリを叩いてみる - 後は開発する中で理解していく https://www.oreilly.co.jp/books/9784873118932/
学びになったこと 1. 型の定義が重要 2. セキュリティの観点 3. クライアントサイドとの調整
1. 型の定義が重要 - 命名を間違えると後々面倒なことになる - もし間違えていたら、@deprecatedディレクティブを生やし た上で、新規追加する
2. セキュリティの観点 1. 直接型を参照されてしまわないように、self.authorized?を設定する https://graphql-ruby.org/authorization/authorization 2. 型定義を循環させる(再帰的に解決できるスキーマが存在する)と意図的にネストを深くしたクエリをリクエス トされDos攻撃されるリスクがある https://github.com/WebAppPentestGuidelines/graphQLGuideLine/blob/master/docs/specific/dos.md 3.
viewerパターンを採用し、個人情報の不正取得を防ぐ current_userを起点に各情報を取ってくるようにする。 self.authorized?で対象オブジェクトがcurrent_userのものでなければ認可エラーを返す
3. クライアントサイドとの調整 - 現状のUIと整合性のある形でmutationを定義しないと、自然な形でリク エストが送れない - ex. 親リソースと子リソースを同じ編集画面で操作する場合、子リソー スの削除mutationだけ分離すると、違和感のある動きになってしまうこと があった
その他、実装で難しかった点 ・ページネーションの書き方が独特 ・既存のAPI仕様を理解した上で、壊さないようにしないといけない ・graphiqlの扱いに最初慣れなかった ・RSpec(テスト)でテストデータを準備するやり方 ・例外処理 参照: ZOZO社の事例
以上です!ありがとうございました!