Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
RESTからGraphQL APIへの移行で学んだこと
Search
inoway46
June 22, 2023
Technology
1
290
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
900
Other Decks in Technology
See All in Technology
GitHub Copilot全社導入のその後とGitHub×ZOZOTOWNコラボレーションの舞台裏 / GitHub ZOZOTOWN
ikkou
0
290
LINEヤフーにおける超大規模プラットフォーム実現への挑戦と学び / Challenges and Lessons in Building an Ultra-Large-Scale Platform at LY Corporation
hhiroshell
2
980
Microsoft 365と開発者ツールの素敵な関係
kkamegawa
1
1.4k
プロダクトマネージャーは 事業責任者の夢をみるのか pmconf2024
gimupop
1
2.5k
プロダクトの爆速開発を支える、 「作らない・削る・尖らせる」技術
applism118
5
1.2k
ファインディの4年にわたる技術的負債の返済 / Repaying 4 Years of Technical Debt at Findy
ma3tk
6
3.1k
MediaPipe と ML Kit ってどう ちがうの? / What is the difference between MediaPipe and ML Kit?
yanzm
0
290
RAMP2024
takeyukitamura
3
240
品質管理チームのEMとして大事にしていること / QA EM
nihonbuson
0
340
プロセス改善とE2E自動テストによる、プロダクトの品質向上事例
tomasagi
1
870
Engineer Recruting Deck
siva_official
PRO
1
3.3k
12/2(月)のBedrockアプデ速報(re:Invent 2024 Daily re:Cap #1 with AWS Heroes)
minorun365
PRO
2
280
Featured
See All Featured
How to Ace a Technical Interview
jacobian
276
23k
Statistics for Hackers
jakevdp
796
220k
The Pragmatic Product Professional
lauravandoore
32
6.3k
Fashionably flexible responsive web design (full day workshop)
malarkey
405
65k
GitHub's CSS Performance
jonrohan
1030
460k
Ruby is Unlike a Banana
tanoku
97
11k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
44
6.8k
BBQ
matthewcrist
85
9.3k
Building a Scalable Design System with Sketch
lauravandoore
459
33k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
How GitHub (no longer) Works
holman
310
140k
Testing 201, or: Great Expectations
jmmastey
40
7.1k
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社の事例
以上です!ありがとうございました!