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×TypeScriptでエモかった5つのこと.pdf
Search
TsukasaSekiguchi
February 02, 2019
Technology
1
780
GraphQL×TypeScriptでエモかった5つのこと.pdf
Gunmaweb #34のLTスライドです。
GraphQL、及びGraphQL×TypeScriptを組み合わせてみてエモいなぁと感じることが多かったのでそれらをまとめてみました。
TsukasaSekiguchi
February 02, 2019
Tweet
Share
More Decks by TsukasaSekiguchi
See All by TsukasaSekiguchi
おれのAI活用の現状とこれから
tsukasagr
0
150
Deep Researchで積読解消!技術書キャッチアップ術
tsukasagr
0
62
v0とCursorで爆速開発🚀
tsukasagr
0
210
Prismaを1年くらい使ってみたのでちょっと語る
tsukasagr
0
210
playwrightのVSCode拡張が便利すぎて、もはやE2E書けないとか言い訳できないレベルだった
tsukasagr
0
200
AWS_Copilotではじめる簡単コンテナ運用.pdf
tsukasagr
0
370
SupabaseにBaaS拡大の未来を感じた
tsukasagr
0
270
超ざっくりFirebase vs Amplify
tsukasagr
0
320
NestJSがいい感じだった
tsukasagr
0
320
Other Decks in Technology
See All in Technology
AWS Organizations 新機能!マルチパーティ承認の紹介
yhana
1
270
Tokyo_reInforce_2025_recap_iam_access_analyzer
hiashisan
0
180
事業成長の裏側:エンジニア組織と開発生産性の進化 / 20250703 Rinto Ikenoue
shift_evolve
PRO
2
20k
マネジメントって難しい、けどおもしろい / Management is tough, but fun! #em_findy
ar_tama
7
1k
品質と速度の両立:生成AI時代の品質保証アプローチ
odasho
1
250
生成AI開発案件におけるClineの業務活用事例とTips
shinya337
0
250
SmartNewsにおける 1000+ノード規模 K8s基盤 でのコスト最適化 – Spot・Gravitonの大規模導入への挑戦
vsanna2
0
120
AI専用のリンターを作る #yumemi_patch
bengo4com
5
4.2k
How Do I Contact HP Printer Support? [Full 2025 Guide for U.S. Businesses]
harrry1211
0
100
Lufthansa ®️ USA Contact Numbers: Complete 2025 Support Guide
lufthanahelpsupport
0
170
「クラウドコスト絶対削減」を支える技術—FinOpsを超えた徹底的なクラウドコスト削減の実践論
delta_tech
4
150
生成AI活用の組織格差を解消する 〜ビジネス職のCursor導入が開発効率に与えた好循環〜 / Closing the Organizational Gap in AI Adoption
upamune
7
5.2k
Featured
See All Featured
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
950
The Straight Up "How To Draw Better" Workshop
denniskardys
234
140k
Documentation Writing (for coders)
carmenintech
72
4.9k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
Building a Modern Day E-commerce SEO Strategy
aleyda
42
7.4k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.9k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.4k
Optimizing for Happiness
mojombo
379
70k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.5k
Faster Mobile Websites
deanohume
307
31k
The World Runs on Bad Software
bkeepers
PRO
69
11k
Transcript
GraphQL×TypeScriptͰ ΤϞ͔ͬͨ5ͭͷ͜ͱ 2019/02/02 Gunma.web #34 ؔޱ ࢘
໊લ: ؔޱ࢘ SNS: GitHub: TsukasaGR Twitter: TsukasaGr NewsPicks: ؔޱ࢘ ࠲ӈͷ
ࣗͷͨΊʹɺଞਓʹਚ͘͢ ࣄ: αϥϦʔϚϯ: SIerͰ৽نࣄۀ(toC͚ͷWebαʔϏε)։ൃ ϑϦʔϥϯε: ελʔτΞοϓͷWebΤϯδχΞ ࠷ۙ৮ͬͯΔͷ: PHP(Laravel)ɺJavascript/Typescript(Vue.js/Nuxt.js)ɺGraphQLɺDockerɺAWSɺFirebase ࣗݾհ
ࠓ͢͜ͱ • GraphQLͱ • GraphQLͷPros/Cons • TypeScriptͱ • GraphQLΛ৮ͬͯΤϞ͔ͬͨ͜ͱ •
GraphQL×TypeScriptΛΈ߹Θͤͯ ΤϞ͔ͬͨ͜ͱ
GraphQL(backend) Laravel: 5.7.24 nuwave/lighthouse: 2.6.4 mll-lab/laravel-graphql-playground: 0.3.3 GraphQL(frontend), TypeScript Nuxt.js:
2.3.4 typescript: 3.2.2 @nuxtjs/apollo: 4.0.0-rc2.3 etc… લఏ
ΤϞ͔ͬͨ5ͭͷ͜ͱ
1. ΫϥΠΞϯτ࣮ߦڥ͕ ΤϞ͍
mll-lab/laravel-graphql-playground (prisma/graphql-playground)
prisma/vscode-graphql
2. GraphQLͷΫΤϦ͕ ΤϞ͍
ෳͷΫΤϦΛ·ͱΊͯൃߦ
3. Document as Code͕ ΤϞ͍
nuwave/lighthouse
4. Code Generator͕ ΤϞ͍
dotansimha/graphql-code-generator
5. ·ͩओྲྀʹͳͬͯͳ͍ͷ͕ ΤϞ͍
• TypeScriptAltJSͷσϑΝΫτʹͳΓͭͭ͋Δ͕ɺAPI ·ͩ·ͩRestAPI͕ओྲྀ • ͪΖΜGraphQLRestAPIͷସͱͯ͠Ͱͳ͍͚͘ Δͷͩͱࢥ͏͕ɺSSKDsͳAPIͰ͋ΕΤϯυϙΠϯτ ͕ҰՕॴʹ·ͱ·͍ͬͯΔͱϑϩϯτΤϯυ͕εοΩϦ͢ Δ • ͢ͰʹΤϞ͍GraphQL͕ͩɺࠓޙ͞ΒʹΤϞ͘ͳ͍ͬͯ͘
Մೳੑ͕͋Δʂ ͞ΒʹΤϞ͘ͳΔ͔ʁʂ
͓·͚. ΤϞ͘ͳ͍ͱ͜Ζ
• GraphQLͷΤϞ͘ͳ͍ͱ͜Ζ • TypeScriptͷΤϞ͘ͳ͍ͱ͜Ζ • Laravel×GraphQLͷΤϞ͘ͳ͍ͱ͜Ζ • Nuxt×TypeScriptͷΤϞ͘ͳ͍ͱ͜Ζ
LaravelͷGraphQL ϥΠϒϥϦ͕ൃల్্ LaravelͰGraphQLΛ͍ͯ͠Έͨ https://qiita.com/TsukasaGR/items/1a8b0020e5e83e7a46c7
NuxtͷTSαϙʔτ͕·ͩऑ͍ ͕ɺઌϦϦʔε͞Εͨv2.4ͰTSαϙʔτͨ͠ͱͷ͜ͱ https://dev.to/nuxt/nuxtjs-v240-is-out-typescript-smart- prefetching-and-more-18d
͍͞͝ʹ
• ࣮ࡍʹΞϓϦέʔγϣϯΛ࣮ͯ͠ΈΔͱҧͬͨݟ͑ํ͋Γͦ͏ • ٧·ͬͨ࣌ʹάάͬͯղܾࡦ͕օແ • ΫΤϦͷ8ׂ͕Resolver • CustomDirectiveɺCustomScalarͱϑϨʔϜϫʔΫͷओػೳ (DIɺORM)ͷ࿈ܞ͕ग़དྷͳ͍ •
PrismaɺApollo͕ଟػೳɺϥΠϒϥϦ͕ଟ͗ͯ͢Α͘Θ͔Βͳ͍ • ͬͺΓRestAPIҰຊʹͦ͏ • etc… ͦΕͰཕΛ౿Ήʹ͢ΔΤϞ͕͋͞Δʂ