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
400
Keith and Mario's Guide to Continuous Deployment
keithpitt
18
2.5k
Buildbox - Lessons Learned
keithpitt
1
390
Practical Backbone Patterns
keithpitt
16
1.6k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Desktoppr - Lessons Learned
keithpitt
6
740
VendorKit - An Introduction
keithpitt
2
530
A basic introduction to Mustache
keithpitt
3
420
UI Testing with Frank
keithpitt
1
290
Other Decks in Programming
See All in Programming
Agentic Applications with Symfony
el_stoffel
2
270
Kamal 2 – Get Out of the Cloud
aleksandrov
1
180
MCP世界への招待: AIエンジニアが創る次世代エージェント連携の世界
gunta
4
890
Do Dumb Things
mitsuhiko
0
430
Day0 初心者向けワークショップ実践!ソフトウェアテストの第一歩
satohiroyuki
0
840
Qiita Bash
mercury_dev0517
1
190
Going Structural with Named Tuples
bishabosha
0
200
Java 24まとめ / Java 24 summary
kishida
3
490
Youtube Lofier - Chrome拡張開発
ninikoko
0
2.4k
Signal-Based Data FetchingWith the New httpResource
manfredsteyer
PRO
0
170
Ruby's Line Breaks
yui_knk
2
640
Develop Faster With FrankenPHP
dunglas
2
3.2k
Featured
See All Featured
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
23
2.6k
YesSQL, Process and Tooling at Scale
rocio
172
14k
[RailsConf 2023] Rails as a piece of cake
palkan
54
5.4k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
32
2.2k
Build The Right Thing And Hit Your Dates
maggiecrowley
35
2.6k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Agile that works and the tools we love
rasmusluckow
328
21k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
119
51k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
13
1.4k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.1k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
2.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