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
Spring gRPC について / About Spring gRPC
mackey0225
0
200
ASP.NET Core の OpenAPIサポート
h455h1
0
170
Compose でデザインと実装の差異を減らすための取り組み
oidy
1
290
富山発の個人開発サービスで日本中の学校の業務を改善した話
krpk1900
4
340
時計仕掛けのCompose
mkeeda
1
250
盆栽転じて家具となる / Bonsai and Furnitures
aereal
0
3.4k
混沌とした例外処理とエラー監視に秩序をもたらす
morihirok
20
3.4k
Pulsar2 を雰囲気で使ってみよう
anoken
0
210
Java Webフレームワークの現状 / java web framework at burikaigi
kishida
9
2.1k
Flutter × Firebase Genkit で加速する生成 AI アプリ開発
coborinai
0
130
DevinとCursorから学ぶAIエージェントメモリーの設計とMoatの考え方
itarutomy
1
560
AWSマネコンに複数のアカウントで入れるようになりました
yuhta28
2
160
Featured
See All Featured
YesSQL, Process and Tooling at Scale
rocio
171
14k
How to Think Like a Performance Engineer
csswizardry
22
1.3k
Building Your Own Lightsaber
phodgson
104
6.2k
Mobile First: as difficult as doing things right
swwweet
223
9.3k
A designer walks into a library…
pauljervisheath
205
24k
Docker and Python
trallard
44
3.2k
How to train your dragon (web standard)
notwaldorf
90
5.8k
Rails Girls Zürich Keynote
gr2m
94
13k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Why Our Code Smells
bkeepers
PRO
335
57k
Designing for Performance
lara
604
68k
Agile that works and the tools we love
rasmusluckow
328
21k
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