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.4k
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
4.3k
Kotlin製のGraphQLサーバーをNode.jsでモジュラモノリス化している話
hokaccha
0
3.5k
ユビーのアーキテクチャに対する取り組み
hokaccha
1
390
RailsエンジニアのためのNext.js入門
hokaccha
7
20k
Cookpad Summer Internship 2021 Web Frontend
hokaccha
0
7.1k
巨大なモノリシック Rails アプリケーションの マイクロサービス化戦略 / 2019 microservices in cookpad
hokaccha
3
3.8k
巨大なRailsアプリケーションを「普通」にするための取り組み
hokaccha
1
950
Web Frontend Improvement in Cookpad
hokaccha
1
1.1k
cookpad summer internship 2018 - Git
hokaccha
1
9.6k
Other Decks in Programming
See All in Programming
Day0 初心者向けワークショップ実践!ソフトウェアテストの第一歩
satohiroyuki
0
820
PHPUnit 高速化テクニック / PHPUnit Speedup Techniques
pinkumohikan
1
1.4k
DataStoreをテストする
mkeeda
0
280
新しいPHP拡張モジュールインストール方法「PHP Installer for Extensions (PIE)」を使ってみよう!
cocoeyes02
0
230
Devinのメモリ活用の学びを自社サービスにどう組み込むか?
itarutomy
0
2k
Compose Hot Reload is here, stop re-launching your apps! (Android Makers 2025)
zsmb
1
460
マルチアカウント環境での、そこまでがんばらない RI/SP 運用設計
wa6sn
0
700
Building a macOS screen saver with Kotlin (Android Makers 2025)
zsmb
1
130
家族・子育て重視/沖縄在住を維持しながらエンジニアとしてのキャリアをどのように育てていくか?
ug
0
260
趣味全開のAITuber開発
kokushin
0
180
Enterprise Web App. Development (1): Build Tool Training Ver. 5
knakagawa
1
110
国漢文混用体からHolloまで
minhee
1
150
Featured
See All Featured
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
40
2.2k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
30
2.3k
KATA
mclloyd
29
14k
Fireside Chat
paigeccino
37
3.4k
The Pragmatic Product Professional
lauravandoore
33
6.5k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
44
7.2k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.4k
The Power of CSS Pseudo Elements
geoffreycrofte
75
5.7k
Making the Leap to Tech Lead
cromwellryan
133
9.2k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
49k
Being A Developer After 40
akosma
90
590k
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ͷෛ࠴Λฦ٫͢ΔͨΊʹεΩʔϚͷҠߦΛ͓͜ͳ͍ͬͯΔ • ͦΕʹͬͯϑϩϯτΤϯυʹݫີͳܕఆٛΛಋೖ͍ͯ͠Δ • ಛʹେࣄʹ͍ͯ͠ΔͷҎԼ ◦ ۃྗ҆શʹҠߦ͢Δ
◦ ৽ͨʹෛ࠴Λੵ·ͳ͍ ◦ ՄೳͳݶΓΈԽɺࣗಈԽΛ͓͜ͳ͏