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
React + Relay + GraphQL is the Future
Search
Keith Pitt
November 26, 2015
Programming
2.2k
13
Share
React + Relay + GraphQL is the Future
Keith Pitt
November 26, 2015
More Decks by Keith Pitt
See All by Keith Pitt
Buildkite loves Golang
keithpitt
3
450
Keith and Mario's Guide to Continuous Deployment
keithpitt
18
2.6k
Buildbox - Lessons Learned
keithpitt
1
450
Practical Backbone Patterns
keithpitt
16
1.7k
Keith and Marios Guide to Fast Websites
keithpitt
413
23k
Desktoppr - Lessons Learned
keithpitt
6
820
VendorKit - An Introduction
keithpitt
2
580
A basic introduction to Mustache
keithpitt
3
470
UI Testing with Frank
keithpitt
1
340
Other Decks in Programming
See All in Programming
AI-DLC 入門 〜AIコーディングの本質は「コード」ではなく「構造」〜 / Introduction to AI-DLC: The Essence of AI Coding Is Not “Code” but “Structure”
seike460
PRO
0
160
Understanding Apache Lucene - More than just full-text search
spinscale
0
150
Cyrius ーLinux非依存にコンテナをネイティブ実行する専用OSー
n4mlz
0
270
PHP 7.4でもOpenTelemetryゼロコード計装がしたい! / PHPerKaigi 2026
arthur1
1
460
Migration to Signals, Signal Forms, Resource API, and NgRx Signal Store @Angular Days 03/2026 Munich
manfredsteyer
PRO
0
210
Symfony + NelmioApiDocBundle を使った スキーマ駆動開発 / Schema Driven Development with NelmioApiDocBundle
okashoi
0
250
Codex の「自走力」を高める
yorifuji
0
1.3k
飯MCP
yusukebe
0
450
車輪の再発明をしよう!PHP で実装して学ぶ、Web サーバーの仕組みと HTTP の正体
h1r0
2
480
Strategy for Finding a Problem for OSS: With Real Examples
kibitan
0
130
OTP を自動で入力する裏技
megabitsenmzq
0
130
野球解説AI Agentを開発してみた - 2026/02/27 LayerX社内LT会資料
shinyorke
PRO
0
380
Featured
See All Featured
What does AI have to do with Human Rights?
axbom
PRO
1
2.1k
AI in Enterprises - Java and Open Source to the Rescue
ivargrimstad
0
1.2k
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
64
53k
Color Theory Basics | Prateek | Gurzu
gurzu
0
270
Have SEOs Ruined the Internet? - User Awareness of SEO in 2025
akashhashmi
0
300
State of Search Keynote: SEO is Dead Long Live SEO
ryanjones
0
170
Art, The Web, and Tiny UX
lynnandtonic
304
21k
Optimizing for Happiness
mojombo
378
71k
Navigating Weather and Climate Data
rabernat
0
150
Believing is Seeing
oripsolob
1
100
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
300
Raft: Consensus for Rubyists
vanstee
141
7.4k
Transcript
None
@keithpitt
None
None
I’m excited! ⚡
But first…history
+ Probably the Future +
Glad I said “probably”
+ Probably the Future +
+ Probably the Future +
+ + Is the future.
React
None
None
Just the UI Lots of people use React as the
V in MVC. Since React makes no assumptions about the rest of your technology stack, it's easy to try it out on a small feature in an existing project.
None
+ Backbone
+ Flux
+
None
None
None
None
None
None
None
Too many random “Restful” JSON endpoints
The server and the client were coupled
Inefficient and slow
Too much code
Lots of boiler plate
Hard to get started
Telstra
None
None
GraphQL
Relay
GraphQL
None
None
CURL -X POST https://api.buildkite.com/v1/organizations/buildkite/ projects/buildkite/23
None
CURL -X POST https://api.buildkite.com/v1/organizations/buildkite/ projects/buildkite/23?expand=comments
CURL -X POST https://api.buildkite.com/v1/organizations/buildkite/ projects/buildkite/23/comments
None
None
None
A specification
It’s represents data how we think about it
It looks like JSON
Simple HTTP Post
You control what data is returned
Typed
Introspection
None
None
IDE integration
Before commit hook validation
None
None
None
Relay
The glue between GraphQL and React
None
None
None
Demo
Relay
Batched requests
Partial data fetching
Telstra
Things I skipped:
Things I skipped: Webpack + Rails Mutations Security + Authorisation
Routes Subscriptions ES6,7,8,9,10,xx Probably more…
Get excited ⚡
+ + Is the future.
None
None
Demo
None
None
None
None
None
None
None
CURL -X POST \ -H "Authorization: Bearer xxx" \ https://graphql.buildkite.com/v1
\ -d '{ "query": "query AwesomeQuery { viewer { user { name } } }" }'
Fin ❤ @keithpitt