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
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
440
Practical Backbone Patterns
keithpitt
16
1.6k
Keith and Marios Guide to Fast Websites
keithpitt
413
23k
Desktoppr - Lessons Learned
keithpitt
6
800
VendorKit - An Introduction
keithpitt
2
570
A basic introduction to Mustache
keithpitt
3
460
UI Testing with Frank
keithpitt
1
330
Other Decks in Programming
See All in Programming
GISエンジニアから見たLINKSデータ
nokonoko1203
0
190
Honoを使ったリモートMCPサーバでAIツールとの連携を加速させる!
tosuri13
1
140
rack-attack gemによるリクエスト制限の失敗と学び
pndcat
0
230
CSC307 Lecture 02
javiergs
PRO
1
760
MDN Web Docs に日本語翻訳でコントリビュート
ohmori_yusuke
0
550
フルサイクルエンジニアリングをAI Agentで全自動化したい 〜構想と現在地〜
kamina_zzz
0
370
AgentCoreとHuman in the Loop
har1101
5
190
re:Invent 2025 のイケてるサービスを紹介する
maroon1st
0
170
それ、本当に安全? ファイルアップロードで見落としがちなセキュリティリスクと対策
penpeen
7
2.3k
Findy AI+の開発、運用におけるMCP活用事例
starfish719
0
2.2k
HTTPプロトコル正しく理解していますか? 〜かわいい猫と共に学ぼう。ฅ^•ω•^ฅ ニャ〜
hekuchan
2
650
まだ間に合う!Claude Code元年をふりかえる
nogu66
5
940
Featured
See All Featured
BBQ
matthewcrist
89
10k
What’s in a name? Adding method to the madness
productmarketing
PRO
24
3.9k
Tips & Tricks on How to Get Your First Job In Tech
honzajavorek
0
420
The SEO identity crisis: Don't let AI make you average
varn
0
55
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
mfonobong
2
260
The Pragmatic Product Professional
lauravandoore
37
7.1k
The AI Search Optimization Roadmap by Aleyda Solis
aleyda
1
5.1k
Making Projects Easy
brettharned
120
6.5k
WCS-LA-2024
lcolladotor
0
420
Fashionably flexible responsive web design (full day workshop)
malarkey
408
66k
More Than Pixels: Becoming A User Experience Designer
marktimemedia
2
300
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