Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥
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
13
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
430
Keith and Mario's Guide to Continuous Deployment
keithpitt
18
2.6k
Buildbox - Lessons Learned
keithpitt
1
430
Practical Backbone Patterns
keithpitt
16
1.6k
Keith and Marios Guide to Fast Websites
keithpitt
413
23k
Desktoppr - Lessons Learned
keithpitt
6
780
VendorKit - An Introduction
keithpitt
2
570
A basic introduction to Mustache
keithpitt
3
450
UI Testing with Frank
keithpitt
1
330
Other Decks in Programming
See All in Programming
251126 TestState APIってなんだっけ?Step Functionsテストどう変わる?
east_takumi
0
310
ゲームの物理 剛体編
fadis
0
330
Context is King? 〜Verifiability時代とコンテキスト設計 / Beyond "Context is King"
rkaga
9
1.1k
リリース時」テストから「デイリー実行」へ!開発マネージャが取り組んだ、レガシー自動テストのモダン化戦略
goataka
0
130
Full-Cycle Reactivity in Angular: SignalStore mit Signal Forms und Resources
manfredsteyer
PRO
0
210
開発に寄りそう自動テストの実現
goyoki
1
910
著者と進める!『AIと個人開発したくなったらまずCursorで要件定義だ!』
yasunacoffee
0
130
S3 VectorsとStrands Agentsを利用したAgentic RAGシステムの構築
tosuri13
6
310
20 years of Symfony, what's next?
fabpot
2
350
Go コードベースの構成と AI コンテキスト定義
andpad
0
120
手軽に積ん読を増やすには?/読みたい本と付き合うには?
o0h
PRO
1
170
TUIライブラリつくってみた / i-just-make-TUI-library
kazto
1
380
Featured
See All Featured
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
31
9.8k
The Illustrated Children's Guide to Kubernetes
chrisshort
51
51k
The Hidden Cost of Media on the Web [PixelPalooza 2025]
tammyeverts
1
100
Intergalactic Javascript Robots from Outer Space
tanoku
273
27k
A Tale of Four Properties
chriscoyier
162
23k
Building a Scalable Design System with Sketch
lauravandoore
463
34k
Testing 201, or: Great Expectations
jmmastey
46
7.8k
A designer walks into a library…
pauljervisheath
210
24k
How to train your dragon (web standard)
notwaldorf
97
6.4k
Java REST API Framework Comparison - PWX 2021
mraible
34
9k
Designing Experiences People Love
moore
143
24k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
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