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
390
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
RESTからGraphQL APIへの移行で学んだこと
めぐろLT会#4にて発表しました。
https://meguro-lt.connpass.com/event/286892/presentation/
inoway46
June 22, 2023
More Decks by inoway46
See All by inoway46
CodexではじめるOSSコントリビューション
inoway46
0
53
フロントエンドでもテストを書きたいのでJestに入門してみた
inoway46
1
1.4k
Other Decks in Technology
See All in Technology
2026-09-04 SRE Tech Talk #15 怠惰なTerraform / Lazy Terraform
masasuzu
0
170
DINO-EdgeQuery:Edge-First Polygon Decoding for Building Footprint Extraction from Satellite Imagery
lehupa
0
140
少人数データチームのDevin活用実践事例
runandy16
2
430
Claude Codeで開発以外の業務も爆速化しよう!
minorun365
PRO
12
9.6k
Does an AI Watermark Survive Translation?
machinetranslation
0
520
DMMブックスのNext.js化を加速させるAI活用 / Migrating DMM Books to Next.js with AI
kentarom
1
330
Nav2、Nav3 ... はたまた自作?〜 作って理解する Nav3 の設計意図 〜 / Nav2, Nav3 ... or Build Your Own? — Understanding Nav3's design intent by building it from scratch
yanzm
0
200
どんな手を使っても絶対間に合わせるスケジューラ
asari194617
0
1.5k
作り直せるコードは迅速に 作り直せないDBは慎重に - AI時代のプロダクトエンジニアが「判断の不可逆性」で開発速度を変える話
kinosuke01
0
180
Instana&Bob トラブルシュートハンズオン
mayamasaki68
0
110
AIで実装は速くなった。なのにプロダクトは速くならない。職能の壁を越えて価値のフローを設計する
nwiizo
6
6.7k
KAEN Company Deck
kaen
PRO
0
290
Featured
See All Featured
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
katarinadahlin
PRO
2
3.8k
Getting science done with accelerated Python computing platforms
jacobtomlinson
2
470
Chasing Engaging Ingredients in Design
codingconduct
0
300
From π to Pie charts
rasagy
0
350
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
tomoyanonymous
3
1.2k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
249
1.3M
Site-Speed That Sticks
csswizardry
13
1.5k
The Cost Of JavaScript in 2023
addyosmani
55
10k
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
680
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
230
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
Have SEOs Ruined the Internet? - User Awareness of SEO in 2025
akashhashmi
0
490
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社の事例
以上です!ありがとうございました!