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
アプリエンジニアのためのGraphQL入門.pdf
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
spycwolf
November 19, 2024
Technology
350
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
アプリエンジニアのためのGraphQL入門.pdf
spycwolf
November 19, 2024
More Decks by spycwolf
See All by spycwolf
デザインシステムを利用したSwiftUIによるアプリ開発事情
spycwolf
1
880
Other Decks in Technology
See All in Technology
記録をかんたんに、提案をパーソナルに ── AIであすけんが目指すもの
oprstchn
0
110
AI Agentをシステムに組み込む前にゆるく向き合ってみる
hayama17
0
190
product engineering with qa
nealle
0
140
“詰む”前に仕組みを作れ 〜技術の波に溺れないためのキャッチアップ術〜
takasyou
8
5k
開発組織のAI活用レベルを可視化する「エンジニア版AI番付」の取り組み
fuzzy31u
0
110
Text-to-SQLをAgentCoreで実現し、生成されるSQLの精度を定量的に評価する
yakumo
2
390
認証認可だけじゃない! ID管理の構成要素と ライフサイクルを意識しよう
ritou
1
450
水を運ぶ人としてのリーダーシップ
izumii19
4
1.2k
時期が悪い!それでもRaspberry Piを買って遊んで活用するには / 20260627-osc26do-rpi-jikigawarui
akkiesoft
1
960
ゼロをイチにする仕事が終わったあと
smasato
0
200
GitHub Copilot運用のリアル ~AI Credit時代にどう向き合うか~
takafumisu2uk1
0
600
飲食店もAIで。レジ締めやハンディシステムをつくってる話 / Using AI for restaurant management
vtryo
0
230
Featured
See All Featured
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.5k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
GraphQLとの向き合い方2022年版
quramy
50
15k
What does AI have to do with Human Rights?
axbom
PRO
1
2.2k
The Invisible Side of Design
smashingmag
301
52k
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
67
56k
Heart Work Chapter 1 - Part 1
lfama
PRO
8
36k
HTML-Aware ERB: The Path to Reactive Rendering @ RubyCon 2026, Rimini, Italy
marcoroth
2
280
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.9k
Making the Leap to Tech Lead
cromwellryan
135
9.9k
How to audit for AI Accessibility on your Front & Back End
davetheseo
0
450
Tips & Tricks on How to Get Your First Job In Tech
honzajavorek
1
550
Transcript
アプリエンジニアのための GraphQL⼊⾨
note inc. ‧2024年2⽉にnoteにジョイン ‧note Appチームリーダー ‧2015年〜モバイルアプリを専⾨に扱うようになる ‧それ以前はPHPやRubyでのバックエンド開発がメイン Spycwolf Kota KANEKO
2
note inc. GraphQLとは https://graphql.org/ • API のクエリ⾔語であり、既存のデータを使⽤してそれらのクエリを実⾏するた めのランタイムです。GraphQL は API
内のデータの完全でわかりやすい説明を 提供し、クライアントが必要なものだけを正確に要求できるようにします。 • GraphQL クエリを API に送信すると、必要なものだけが正確に取得されます。 それ以上でもそれ以下でもありません。GraphQL クエリは常に予測可能な結果 を 返します。 • GraphQL クエリは、1 つのリソースのプロパティにアクセスするだけでなく、そ れらの間の参照もスムーズに追跡します。⼀般的な REST API では複数の URL か らの読み込みが必要ですが、GraphQL API では 1 回のリクエストでアプリに必要 なすべてのデータを取得します。
note inc. GraphQLとの出会い • GraphQLは元々Facebookの内部で開発されたもので、2015年に⼀般に公開さ れ、その後、2018年に現在のGraphQL Foundationに移譲された • 2017年に新規アプリサービスの開発に伴い、当時のチームメンバーとGraphQL の導⼊を決めた
• APIとクライアントアプリとを並⾏してゼロから開発するタイミングで、関係す るエンジニア4⼈全員がAPIもアプリも両⽅を開発していった GraphQL導⼊の判断 • 実装する前段階の設計についてほぼ検討する箇所がない • REST APIは会社ごと、チームごとに設計が異なり、新規に開発するにも設計部分 に検討が必要そうだった • 単純に新しいものを使ってみたかった!
note inc. 当時の感想 • 当時はまだ細かい配慮が必要ではあったが、とにかく直感的に実装しやすい • indexとshowの区別を厳密に考慮しなくても後々困ることが少ないため、クライ アント側の画⾯要件が固まっていなくてもAPI側の開発を進められる • REST
APIに対しても当時からCodegeneratorはあったが、Apolloが扱いやすい • Grapiqlのようなプレイグラウンド環境が標準で備わっていて、クライアントか らのスキーマ確認&レスポンス確認がしやすい サーバーサイドの開発に慣れていないモバイルアプリエンジニアで も実装しやすい!
note inc. 覚えておくべきことはたった3つ
note inc. Schemaを定義する • 取得系はQuery、更新系はMutationという概 念 • 基本的にはリソースごとに取得できるカラム 情報を定義する •
ここで定義するスキーマは、そのままクライ アントからクエリとして指定できるものにな る • QueryもMutationもinputとして引数を設定 できる • 基本的にはこれだけ
note inc. Resolverを定義する • Resolverはリソースとスキーマとの関連を定 義する • データベースから取得したデータをそのまま スキーマに当てはめる場合が多いが、取得し たデータを加⼯して返却する場合もある
• UseCase的なレイヤー
note inc. Serviceを定義する • データベースとのやり取りは別定義にする ケースが多い • ここで定義したデータ取得する、もしくは更 新系の処理を⾏う •
Repository、DataSource的な役割
note inc. プロジェクトの覗きかた • graphqlはエンドポイントが1つなので、/grapql というディレクトリを探す • その配下に schema や
resolver などが⾒つかるはず • データリソースへのアクセスは resolverから辿れるはず • レスポンスを確認したいときは schema のネーミングから、該当する resolver を探す • resolver の定義を確認すれば何をしているのか、どこからデータを持ってきてい るのか、どこでデータを処理しているのかがわかるはず
note inc. 実際にプロダクトで扱うには3つ だけ理解しておけばいいなんてこ とはありません!
note inc. 普段あまりAPIの実装をしたこと がない⽅もチャレンジしてみてく ださい
Thank you !