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.1k
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
380
Keith and Mario's Guide to Continuous Deployment
keithpitt
18
2.5k
Buildbox - Lessons Learned
keithpitt
1
380
Practical Backbone Patterns
keithpitt
16
1.6k
Keith and Marios Guide to Fast Websites
keithpitt
410
22k
Desktoppr - Lessons Learned
keithpitt
6
710
VendorKit - An Introduction
keithpitt
2
520
A basic introduction to Mustache
keithpitt
3
410
UI Testing with Frank
keithpitt
1
280
Other Decks in Programming
See All in Programming
Beyond ORM
77web
11
1.6k
Azure AI Foundryのご紹介
qt_luigi
1
180
テストコード書いてみませんか?
onopon
2
340
AHC041解説
terryu16
0
360
VisionProで部屋の明るさを反映させるシェーダーを作った話
segur
0
100
shadcn/uiを使ってReactでの開発を加速させよう!
lef237
0
290
いりゃあせ、PHPカンファレンス名古屋2025 / Welcome to PHP Conference Nagoya 2025
ttskch
1
170
React 19でお手軽にCSS-in-JSを自作する
yukukotani
5
560
Flatt Security XSS Challenge 解答・解説
flatt_security
0
730
Асинхронность неизбежна: как мы проектировали сервис уведомлений
lamodatech
0
1.3k
Rubyでつくるパケットキャプチャツール
ydah
0
170
各クラウドサービスにおける.NETの対応と見解
ymd65536
0
250
Featured
See All Featured
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
3
240
Docker and Python
trallard
43
3.2k
4 Signs Your Business is Dying
shpigford
182
22k
How STYLIGHT went responsive
nonsquared
96
5.3k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
232
17k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
28
4.5k
Git: the NoSQL Database
bkeepers
PRO
427
64k
jQuery: Nuts, Bolts and Bling
dougneiner
62
7.6k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
49k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
33
2.7k
Mobile First: as difficult as doing things right
swwweet
222
9k
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