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
12
2.2k
React + Relay + GraphQL is the Future
Keith Pitt
November 26, 2015
Tweet
Share
More Decks by Keith Pitt
See All by Keith Pitt
Buildkite loves Golang
keithpitt
3
420
Keith and Mario's Guide to Continuous Deployment
keithpitt
18
2.6k
Buildbox - Lessons Learned
keithpitt
1
420
Practical Backbone Patterns
keithpitt
16
1.6k
Keith and Marios Guide to Fast Websites
keithpitt
411
23k
Desktoppr - Lessons Learned
keithpitt
6
770
VendorKit - An Introduction
keithpitt
2
560
A basic introduction to Mustache
keithpitt
3
440
UI Testing with Frank
keithpitt
1
320
Other Decks in Programming
See All in Programming
はじめてのDSPy - 言語モデルを『プロンプト』ではなく『プログラミング』するための仕組み
masahiro_nishimi
4
17k
CSC305 Lecture 11
javiergs
PRO
0
310
One Enishi After Another
snoozer05
PRO
0
170
「ちょっと古いから」って避けてた技術書、今だからこそ読もう
mottyzzz
12
7.2k
マンガアプリViewerの大画面対応を考える
kk__777
0
400
Temporal Knowledge Graphで作る! 時間変化するナレッジを扱うAI Agentの世界
po3rin
4
940
CSC305 Lecture 08
javiergs
PRO
0
280
AIと人間の共創開発!OSSで試行錯誤した開発スタイル
mae616
2
820
Developer Joy - The New Paradigm
hollycummins
1
380
bootcamp2025_バックエンド研修_WebAPIサーバ作成.pdf
geniee_inc
0
140
TFLintカスタムプラグインで始める Terraformコード品質管理
bells17
2
480
Blazing Fast UI Development with Compose Hot Reload (droidcon London 2025)
zsmb
0
370
Featured
See All Featured
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
116
20k
The Cult of Friendly URLs
andyhume
79
6.6k
Six Lessons from altMBA
skipperchong
29
4k
Context Engineering - Making Every Token Count
addyosmani
8
310
XXLCSS - How to scale CSS and keep your sanity
sugarenia
249
1.3M
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.2k
Navigating Team Friction
lara
190
15k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.7k
Why Our Code Smells
bkeepers
PRO
340
57k
Typedesign – Prime Four
hannesfritz
42
2.8k
Rebuilding a faster, lazier Slack
samanthasiow
84
9.2k
The Straight Up "How To Draw Better" Workshop
denniskardys
239
140k
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