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サーバの構成要素を整理する #ハッカー鮨 #tsukijigraphql / g...
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
izumin5210
April 19, 2024
Programming
1.6k
5
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
GraphQLサーバの構成要素を整理する #ハッカー鮨 #tsukijigraphql / graphql server technology selection
tsukiji.graphql x ハッカー鮨
https://tsukiji-graphql.connpass.com/event/314173/
izumin5210
April 19, 2024
More Decks by izumin5210
See All by izumin5210
開発体験を左右するライブラリの API 設計 - GraphQL スキーマ構築ライブラリから考える #tskaigi
izumin5210
2
1.9k
izumin5210のプロポーザルのネタ探し #tskaigi_msup
izumin5210
2
940
AI Agent の開発と運用を支える Durable Execution #AgentsInProd
izumin5210
8
2.9k
AI Agent Tool のためのバックエンドアーキテクチャを考える #encraft
izumin5210
6
2.3k
Building AI Agents with TypeScript #TSKaigiHokuriku
izumin5210
6
1.8k
Web エンジニアが JavaScript で AI Agent を作る / JSConf JP 2025 sponsor session
izumin5210
4
3.5k
AI Coding Meetup #3 - 導入セッション / ai-coding-meetup-3
izumin5210
0
3.7k
Web フロントエンドエンジニアに開かれる AI Agent プロダクト開発 - Vercel AI SDK を観察して AI Agent と仲良くなろう! #FEC余熱NIGHT
izumin5210
3
1.3k
TypeScript を活かしてデザインシステム MCP を作る / #tskaigi_after_night
izumin5210
5
950
Other Decks in Programming
See All in Programming
ビデオ通話が繋がる0.2秒で何が起きているのか
supurazako
2
150
PHPだって関数型したい 〜できること、できないこと〜 / fp-in-php
jsoizo
1
240
任せる範囲はこう広がった / How the Scope of AI Delegation Has Expanded
nrslib
1
270
なぜ型を書くのか? TSKaigi2026で改めて考える #tskaigi_smarthr
kajitack
0
400
『コードを書く以外の』エンジニアリング〜課金基盤移行プロジェクト推進のためのTips4選
yuriko1211
0
530
ローカルLLMでどこまでコードが書けるか -縮小版 / How much code can be written on a local LLM Shortened
kishida
2
200
地域 SRE コミュニティ最前線 - ホンマでっかSRE勉強会
tk3fftk
0
260
Claude Team Plan導入・ガイド
tk3fftk
0
220
Claude Opus 4.6以後の受託開発エンジニアの変化(Claude Code開発ノウハウ大公開スペシャルbyクラスメソッド)
iidatakuma
1
820
アルゴリズムは何を圧縮しているのか ─ Haskell から育った「圧縮代数」というメンタルモデル
naoya
16
3.5k
SREは、MCPとSRE Agentをこう使え!
kazumax55
0
150
AI時代のPHPer生存戦略 ~「言語、もうなんでもよくない?」に本気で向き合う~
vivion
0
130
Featured
See All Featured
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.6k
エンジニアに許された特別な時間の終わり
watany
108
250k
Being A Developer After 40
akosma
91
590k
The Power of CSS Pseudo Elements
geoffreycrofte
82
6.5k
GitHub's CSS Performance
jonrohan
1033
470k
Test your architecture with Archunit
thirion
1
2.3k
Building a A Zero-Code AI SEO Workflow
portentint
PRO
0
640
Marketing Yourself as an Engineer | Alaka | Gurzu
gurzu
0
260
Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge
uxyall
0
350
Neural Spatial Audio Processing for Sound Field Analysis and Control
skoyamalab
0
380
SEO for Brand Visibility & Recognition
aleyda
0
4.6k
Six Lessons from altMBA
skipperchong
29
4.3k
Transcript
tsukiji.graphql GraphQLサーバの構成要素を整理する 2024-04-18 @izumin5210 Photo by Zaini Izzuddin on Unsplash
@izumin5210 ▶ バックエンドや Web フロントエンドを書きます - Go, TypeScript, React, GraphQL,
Protobuf, Connect, … ▶ API スキーマが好き ▶ ISUCON に出るのが得意 ▶ eddeee888/gcg-typescript-resolver-files と github.com/99designs/gqlgen が好き LayerX, ex-Wantedly
GraphQL Server、 何で作ってますか? …って聞かれたら、なにを答えますか? ※ Node.js での例が中心となりますが、他の言語でも通じる話をします。多分。
GraphQL サーバ、何で作ってますか? ▶ TypeScript, Go, Ruby, … ▶ NestJS, Apollo
Server, gqlgen, … ▶ graphql-yoga, graphql-ruby, … ▶ スキーマファースト, コードファースト ▶ … GraphQL Server を構成する技術にもいろいろある
そもそも「GraphQL サーバを実装する」とは ▶ GraphQL の仕様はトランスポート層に依存しない - HTTP の上で GraphQL を扱う仕様は
GraphQL over HTTP - 仕様としてはまだ Draft だが、大体の実装がこれに従っているはず ▶ なので、技術選定としてもいくつかのレイヤに分けて考えることができる - 「HTTP リクエストを受けていい感じの処理を挟みつつ GraphQL に橋渡 しをする実装」 - 「GraphQL クエリ(Operation)を受けて結果を吐き出す実装」 - …
GraphQL サーバの構成要素をレイヤに分けてみた ※ @izumin5210 が独自に分類・命名したものです。 一般的な定義が存在していたら教えてください。
▶ Schema Definition - Code-First か Schema-First か - GraphQL
スキーマを定義するのがどういう開発者かな どで、相性がいい方法が変わる ▶ Resolver - スキーマ定義手法によって Resolver 実装手法は概ね定 まる - スキーマ上の型と TypeScript 上の型がちゃんと整合す るかも重要ポイント
▶ Dependency Container - graphql-js の contextValue が実質 Dependency container
として機能する - 独自の DI 機構を持つ場合もある ▶ Execution Engine - JavaScript では基本的に graphql-js が利用される - スキーマ定義・resolver 実装・Context から GraphQLSchema インスタンスを作り、それもとにクエリ を実行する というのがどのライブラリでも共通
▶ Execution Middlwware - Persisted Query など、GraphQL の仕様の外側での 追加処理 -
Envelop は Babel 的にパーサ等の挙動を上書きする ことも可能 ▶ Transport Adapter - Transport (HTTP Server) と GraphQLSchema の 橋渡し ▶ Transport - HTTP server
この構造を理解しておくことで… ▶ 適切な技術選定の助けになるかも - e.g. いま Apollo Server は必要なのか -
e.g. 僕らのアーキテクチャに NestJS は適してるのか ▶ より良いアーキテクチャを見つける助けになるかも - e.g. GraphQLSchema が処理の本体ってことは、 これを React Server Component から呼べる…? ここでは Node.js について取り上げたが、 他の言語でも似たような分類はできるはず。たぶん。
他にも GraphQL サーバ技術選定時に考えること ▶ BFF ▶ Gateway ▶ 普通にドメインロジックめっちゃ持ってるサーバ アーキテクチャ上の立ち位置は?
他にも GraphQL サーバ技術選定時に考えること ▶ 誰が・どうやってスキーマを定義する? - 特定の言語に縛られないほうが、みんなに開かれたスキーマになる(かも) - プログラムでスキーマにメタ情報を仕込めると便利(かも) -
どういうグラフを目指すのか ▶ 安全に resolver を実装できる? - スキーマと実装の型がズレないか 開発フローは?
他にも GraphQL サーバ技術選定時に考えること ▶ (そもそも GraphQL が適するか?) ▶ … 技術選定に影響を与える要素はたくさんある。
「なぜそれなのか」に答えられるようにしておく。
おまけ: @izumin5210 は何を選ぶ? ▶ Go なら gqlgen - Schema-First +
超優秀な scaffolding ▶ Node.js なら - The Guid スタックに乗りたいので、graphql-yoga - 最近は graphql-codegen の Server Preset がいい感じ - JS にも gqlgen に負けない scaffolding が来た!? - Transport はよしなに - プロダクト立ち上げタイミングなら Next.js から配信もアリ (アーキテクチャ・言語は適切に検討したうえで…)
みなさんの最強の GraphQL サーバ技術選定を教えてください