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の負債と向き合うためにやっていること
Search
Kazuhito Hokamura
July 18, 2023
Programming
2
1.6k
GraphQLの負債と向き合うためにやっていること
Kazuhito Hokamura
July 18, 2023
Tweet
Share
More Decks by Kazuhito Hokamura
See All by Kazuhito Hokamura
TypeScriptとGraphQLで実現する 型安全なAPI実装 / TSKaigi 2024
hokaccha
5
5k
Kotlin製のGraphQLサーバーをNode.jsでモジュラモノリス化している話
hokaccha
0
3.8k
ユビーのアーキテクチャに対する取り組み
hokaccha
1
470
RailsエンジニアのためのNext.js入門
hokaccha
7
21k
Cookpad Summer Internship 2021 Web Frontend
hokaccha
0
7.3k
巨大なモノリシック Rails アプリケーションの マイクロサービス化戦略 / 2019 microservices in cookpad
hokaccha
3
4.1k
巨大なRailsアプリケーションを「普通」にするための取り組み
hokaccha
1
1.1k
Web Frontend Improvement in Cookpad
hokaccha
1
1.1k
cookpad summer internship 2018 - Git
hokaccha
1
9.8k
Other Decks in Programming
See All in Programming
API Platformを活用したPHPによる本格的なWeb API開発 / api-platform-book-intro
ttskch
1
150
AHC061解説
shun_pi
0
400
PHP 7.4でもOpenTelemetryゼロコード計装がしたい! / PHPerKaigi 2026
arthur1
1
130
20260315 AWSなんもわからん🥲
chiilog
2
160
Go 1.26でのsliceのメモリアロケーション最適化 / Go 1.26 リリースパーティ #go126party
mazrean
1
420
Rで始めるML・LLM活用入門
wakamatsu_takumu
0
190
AIに任せる範囲を安全に広げるためにやっていること
fukucheee
0
140
AWS Infrastructure as Code の新機能 2025 総まとめ 〜SA 4人による怒涛のデモ祭り〜
konokenj
10
3.4k
LangChain4jとは一味違うLangChain4j-CDI
kazumura
1
200
PHPのバージョンアップ時にも役立ったAST(2026年版)
matsuo_atsushi
0
140
[SF Ruby Feb'26] The Silicon Heel
palkan
0
110
米国のサイバーセキュリティタイムラインと見る Goの暗号パッケージの進化
tomtwinkle
2
610
Featured
See All Featured
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
100
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
141
35k
<Decoding/> the Language of Devs - We Love SEO 2024
nikkihalliwell
1
160
職位にかかわらず全員がリーダーシップを発揮するチーム作り / Building a team where everyone can demonstrate leadership regardless of position
madoxten
62
52k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
Pawsitive SEO: Lessons from My Dog (and Many Mistakes) on Thriving as a Consultant in the Age of AI
davidcarrasco
0
88
Visualization
eitanlees
150
17k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Why Our Code Smells
bkeepers
PRO
340
58k
Fashionably flexible responsive web design (full day workshop)
malarkey
408
66k
Reflections from 52 weeks, 52 projects
jeffersonlam
356
21k
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
apolaine
0
230
Transcript
GraphQLͷෛ࠴ͱ͖߹͏ͨΊʹ͍ͬͯΔ͜ͱ 2013/7/19 @hokaccha Findy / ٕज़తෛ࠴ɺͲ͏ͬͯղফͨ͠ʁϦΞʔΩςΫνϟɾϦϑΝΫλࣄྫ͔ΒֶͿLunch LT
2 About Me Kazuhito Hokamura software engineer @hokaccha @hokaccha
3 ϢϏʔͷϓϩμΫτ ੜ׆ऀ͚ ड૬ஊΞϓϦ (toC) ҩྍػ͚ؔ AIγεςϜ (toB) ঢ়͔Βडͷख͕͔Γ͕Θ͔Δ ར༻ऀ
݄ؒ ສਓ 700 ࣄΛ1/3ʹޮԽ ಋೖࢪઃ 47ಓݝ 1000
4 GraphQLͷෛ࠴ 😰 • άϥϑߏʹͳ͍ͬͯͳ͍ • Ұ؏ੑ͕ͳ͍ • ֦ுੑ͕ͳ͍
5 άϥϑߏʹͳ͍ͬͯͳ͍ 2ճϦΫΤετΛૹΒͳ͍ͱձ໊ࣾ ʹͨͲΓண͚ͳ͍ ΄ͱΜͲάϥϑߏʹͳͬͯΔ͕ɺҰ෦͜ͷΑ͏ͳεΩʔϚఆ͕ٛ͋Δ
6 άϥϑߏʹ͍ͨ͠ 1ճͰձ໊ࣾΛऔΕΔʂ
7 Ұ؏ੑ͕ͳ͍ id͕IntͩͬͨΓ StringͩͬͨΓ CamelCaseͩͬͨΓ UPPER_CASEͩͬͨΓ fetchͱ͍͏prefix͕͍ͭͯͨΓ ͍ͭͯͳ͔ͬͨΓ
8 ֦ுੑ͕ͳ͍ updateUserName ͕User Λฦ͢ͱɺޙ͔ΒUserҎ֎ ͷใΛฦͨ͘͠ͳͬͨͱ͖ʹ֦ுͰ͖ͳ͍
9 ֦ுੑΛͨͤΔ mutation͝ͱʹpayloadܕΛఆٛ͠ɺpayloadܕʹ userͳͲͷϦιʔεܕΛͨͤΔ มߋલͷ໊લΛฦ͢ͳͲͷ֦ு͕༰қʹͳΔ
10 ෛ࠴Λղফ͢ΔͨΊͷ औΓΈ 💪 • ՄೳͳݶΓ҆શʹεΩʔϚΛҠߦ͢Δ • ৽ͨʹෛ࠴Λੵ·ͳ͍ͨΊͷΈԽɺࣗಈԽ
11 εΩʔϚͷҠߦ • εΩʔϚఆٛͷ͋Δ͖࢟Λఆٛͯ͠ঃʑʹҠߦ͢Δ • ͔༷͠͠ʑͳ͕...ʂ ◦ ಉҰεΩʔϚͰͷҠߦ໊લͷॏෳͳͲ͕͋ͬͯେม ◦ εΩʔϚͷنࣗಈςετ͕ෆे
◦ ΫϥΠΞϯτଆͰͷܕ͚͕ෆेͰ҆શʹҠߦͰ͖ͳ͍
12 ಉҰεΩʔϚͰͷҠߦͷ͍͠ͱ͜Ζ • id Λ Int ͔Β ID ܕʹม͑ΔέʔεΛߟ͑Δ •
ΫϥΠΞϯτ id: number Ͱ͘ΔલఏͰίʔυ͕ॻ͔Ε͍ͯΔ • ͜ͷ··Կߟ͑ͣʹAPIͷ࣮͚ͩม͑ΔͱյΕΔ • ϑϩϯτΤϯυͱόοΫΤϯυΛಉ࣌ʹมߋͰ͖Δͱ͍͍͕ ϦϦʔεͷΈతʹෆՄೳʢଟগͷΤϥʔΛڐ༰Ͱ͖ΕՄೳʣ idͷܕΛม͑Δ
13 PrefixΛ͚ͭͳ͕Βগͣͭ͠Ҡߦ͢Δ • v2 ͷΑ͏ͳ prefix Λ͚ͭɺ໊લͷॏෳΛආ͚ͯ৽ن࡞ • ಉ࣌ʹσϓϩΠ͕ඞཁͳ͍ͷͰ҆શʹҠߦͰ͖Δ •
͕... ͻͱͭมߋ͢ΔͷʹϑϩϯτΤϯυؚΊΔͱ 5ճ͘Β͍σϓϩΠ͢Δඞཁ͕͋ͬͯେม
14 ସҊ • εΩʔϚͱΤϯυϙΠϯτΛ͚ͯ৽͘͠࡞Γ͢Ҋ: ◦ /v2/graphql ͷΑ͏ͳΤϯυϙΠϯτʹͯ͠εΩʔϚΛશʹ͚Δ ◦ ໊લͷॏෳ͕ͳ͍ͷͰଟগҠߦָ͕ʹͳΔ ◦
ར༻͍ͯ͠ΔDGS framework͕ରԠ͍ͯ͠ͳͯ͘அ೦...ʂ • Kotlin ͔Β Node.js Ͱॻ͖͢Ҋ: ◦ ϢϏʔٕज़ελοΫΛ Kotlin ͔Β Node.js ʹҠߦ͢ΔҙࢥܾఆΛͨ͠ ◦ εΩʔϚͷҠߦͷ͍ͭͰʹ Node.js Ͱॻ͖͢ͱ͍͏Ҋ ◦ ಉ࣌ʹେ͖͍มߋΛ2ͭΔͷةݥͳͷͰࠓճݟૹΓ Kotlin ͷ··Δ • … ͱ͍͏Θ͚Ͱ໘͚ͩͲ prefix ઓུͰҠߦத
15 نͷࡦఆ • ઃܭͷࢦΛ໌ࣔͯ͠ೝࣝΛἧ͑Δ • ͜Ε·ͰͷֶͼΛੜ͔ͯ͠ΨΠυϥΠϯΛࡦఆ • ͜ΕʹԊͬͯεΩʔϚΛҠߦ͍ͯ͘͠
16 εΩʔϚͷࣗಈςετ • graphql-schema-linter Λ CI Ͱ࣮ߦ ◦ https://github.com/cjoudrey/graphql-schema-linter •
ΈࠐΈͷϧʔϧͩͱෆेͩͬͨͷͰ͍͔ͭ͘ΧελϜϧʔϧΛࣗલͰॻ͍ͨ ◦ updateUser UpdateUserInput Λ͏͚ͬͱͬͯ UpdateUserPayload Λฦ͢ɺͳͲ • VSCode Plugin ͕ͳ͔ͬͨͷͰࣗ࡞ ◦ https://github.com/hokaccha/vscode-graphql-schema-linter
17 ϑϩϯτΤϯυͷܕ͚ ϑϩϯτΤϯυͰgraphql-codegenͰεΩʔϚ͔Βࣗಈੜͨ͠ܕใΛ͍ͬͯͨ agefetchͯ͠ͳ͍ͷͰϨεϙϯεʹؚ·Εͳ͍ ͕ɺܕͱͯ͠ଘࡏ͍ͯ͠ΔͷͰΤϥʔʹͳΒͳ͍ ͔͜͜ΒܕΛੜ
18 ΫΤϦ͔ΒܕΛੜ͢Δ ੜʹ @graphql-codegen/typescript-operations Λར༻ ͔͜͜ΒܕΛੜ ageΛfetch͍ͯ͠ͳͯ͘ܕʹؚ·Εͳ͍ͷͰܕ νΣοΫͰΤϥʔʹͳΔ
19 Fragment Colocationͷಋೖ ͔͜͜ΒܕΛੜ ͷίϯϙʔωϯτͰࢠͷFragmentΛ embed͍ͯ͘͠
20 ·ͱΊ • GraphQLͷෛ࠴Λฦ٫͢ΔͨΊʹεΩʔϚͷҠߦΛ͓͜ͳ͍ͬͯΔ • ͦΕʹͬͯϑϩϯτΤϯυʹݫີͳܕఆٛΛಋೖ͍ͯ͠Δ • ಛʹେࣄʹ͍ͯ͠ΔͷҎԼ ◦ ۃྗ҆શʹҠߦ͢Δ
◦ ৽ͨʹෛ࠴Λੵ·ͳ͍ ◦ ՄೳͳݶΓΈԽɺࣗಈԽΛ͓͜ͳ͏