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
160
Deep Researchで積読解消!技術書キャッチアップ術
tsukasagr
0
64
v0とCursorで爆速開発🚀
tsukasagr
0
220
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
330
NestJSがいい感じだった
tsukasagr
0
320
Other Decks in Technology
See All in Technology
MCPと認可まわりの話 / mcp_and_authorization
convto
2
300
ファインディにおける Dataform ブランチ戦略
hiracky16
0
220
claude codeでPrompt Engineering
iori0311
0
530
「AI駆動開発」のボトルネック『言語化』を効率化するには
taniiicom
1
220
ビジネス文書に特化した基盤モデル開発 / SaaSxML_Session_2
sansan_randd
0
150
20250728 MCP, A2A and Multi-Agents in the future
yoshidashingo
1
110
Snowflake のアーキテクチャは本当に筋がよかったのか / Data Engineering Study #30
indigo13love
0
290
Turn Your Community into a Fundraising Catalyst for Black Philanthropy Month
auctria
PRO
0
200
AI エンジニアの立場からみた、AI コーディング時代の開発の品質向上の取り組みと妄想
soh9834
8
590
「育てる」サーバーレス 〜チーム開発研修で学んだ、小さく始めて大きく拡張するAWS設計〜
yu_kod
1
190
From Live Coding to Vibe Coding with Firebase Studio
firebasethailand
1
320
解消したはずが…技術と人間のエラーが交錯する恐怖体験
lamaglama39
0
140
Featured
See All Featured
Reflections from 52 weeks, 52 projects
jeffersonlam
351
21k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
31
1.3k
How STYLIGHT went responsive
nonsquared
100
5.7k
Testing 201, or: Great Expectations
jmmastey
43
7.6k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Writing Fast Ruby
sferik
628
62k
A designer walks into a library…
pauljervisheath
207
24k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
1k
It's Worth the Effort
3n
185
28k
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… ͦΕͰཕΛ౿Ήʹ͢ΔΤϞ͕͋͞Δʂ