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
CSC509 Lecture 07
javiergs
PRO
0
240
Devvox Belgium - Agentic AI Patterns
kdubois
1
150
Domain-centric? Why Hexagonal, Onion, and Clean Architecture Are Answers to the Wrong Question
olivergierke
3
970
社会人になっても趣味開発を続けたい! / traPavilion
mazrean
1
100
フロントエンド開発のためのブラウザ組み込みAI入門
masashi
7
3.5k
ALL CODE BASE ARE BELONG TO STUDY
uzulla
28
6.7k
デミカツ切り抜きで面倒くさいことはPythonにやらせよう
aokswork3
0
260
バッチ処理を「状態の記録」から「事実の記録」へ
panda728
PRO
0
190
Introduce Hono CLI
yusukebe
6
3.1k
理論と実務のギャップを超える
eycjur
0
180
Devoxx BE - Local Development in the AI Era
kdubois
0
140
開発組織の戦略的な役割と 設計スキル向上の効果
masuda220
PRO
9
1.5k
Featured
See All Featured
Building Better People: How to give real-time feedback that sticks.
wjessup
369
20k
GraphQLの誤解/rethinking-graphql
sonatard
73
11k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
31
9.7k
Site-Speed That Sticks
csswizardry
13
920
XXLCSS - How to scale CSS and keep your sanity
sugarenia
249
1.3M
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
1.7k
Java REST API Framework Comparison - PWX 2021
mraible
34
8.9k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
285
14k
The Invisible Side of Design
smashingmag
302
51k
Into the Great Unknown - MozCon
thekraken
40
2.1k
Reflections from 52 weeks, 52 projects
jeffersonlam
353
21k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
132
19k
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