Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

React + Relay + GraphQL is the Future

Avatar for Keith Pitt Keith Pitt
November 26, 2015
Programming
2.3k
13

React + Relay + GraphQL is the Future

Avatar for Keith Pitt

Keith Pitt

November 26, 2015

More Decks by Keith Pitt

See All by Keith Pitt
Buildkite loves Golang
Avatar for Keith Pitt keithpitt
3
520
Keith and Mario's Guide to Continuous Deployment
Avatar for Keith Pitt keithpitt
18
2.7k
Buildbox - Lessons Learned
Avatar for Keith Pitt keithpitt
1
510
Practical Backbone Patterns
Avatar for Keith Pitt keithpitt
16
1.7k
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
413
23k
Desktoppr - Lessons Learned
Avatar for Keith Pitt keithpitt
6
900
VendorKit - An Introduction
Avatar for Keith Pitt keithpitt
2
640
A basic introduction to Mustache
Avatar for Keith Pitt keithpitt
3
520
UI Testing with Frank
Avatar for Keith Pitt keithpitt
1
390

Other Decks in Programming

See All in Programming
Materialが消えた日 〜真っ白なFlutterキャンバスにRenderObjectで絵を描く〜
Avatar for Aoi Umigishi umigishiaoi
0
140
クラウドエージェントは、 何がそんなに便利なのか / what makes cloud agents so useful
Avatar for r-kagaya rkaga
5
730
AIが実装を担う時代の「技術設計」と「チームマネジメント」
Avatar for Kaito Minatoya kamina_zzz
1
130
Vue.jsで作る空間解析アプリとCapacitorプラグインのData Bridge
Avatar for Hal hal_spidernight
1
160
あなたの await、OS まで届いてる？ strace で覗く JavaScript の非同期
Avatar for hasuto sasaki hasutosasaki
1
1.9k
まずはコードより業務と向き合う：テーブル解体のためにPdMを呼んだ話
Avatar for さかうぇ sakawe_ee
0
140
Inertia Rails: The One-Person Framework with React & Friends
Avatar for Svyatoslav Kryukov skryukov
0
380
GraphQL の onError と Nullability のこれから
Avatar for Yosuke Kurami quramy
0
200
AIがコードを書いてくれる時代、我々は何を確かめるのか
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
13
5.6k
Optunaを作ったときにやりたかったこと、その後 (2026/10/16, Optuna Meetup #3)
Avatar for Takuya Akiba iwiwi
4
1.4k
AI時代のIaC入門 〜なぜインフラをコードで管理したいのか？〜 / Introduction to IaC in the AI Era
Avatar for アキキー | Akihisa Ikeda akihisaikeda
6
1.4k
Long Living Tokens, Die, Die, Die! (or: The One Ring is Banned in Modern)
Avatar for sylph01 sylph01
0
410

Featured

See All Featured
16th Malabo Montpellier Forum Presentation
Avatar for AKADEMIYA2063 akademiya2063
PRO
0
450
Navigating Weather and Climate Data
Avatar for Ryan Abernathey rabernat
0
580
Scaling GitHub
Avatar for Zach Holman holman
464
140k
My Coaching Mixtape
Avatar for mlcsv mlcsv
0
380
Understanding Cognitive Biases in Performance Measurement
Avatar for Philip Tellis bluesmoon
32
3.1k
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
Avatar for Dr. Kim W Petersen kimpetersen
PRO
0
520
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
Avatar for Beat Signer signer
PRO
0
3.8k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
6
1.4k
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
Avatar for Ines Montani inesmontani
PRO
3
3.8k
Measuring & Analyzing Core Web Vitals
Avatar for Philip Tellis bluesmoon
9
1.1k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
133
20k
Improving Core Web Vitals using Speculation Rules API
Avatar for Sergey Chernyshev sergeychernyshev
21
1.7k

Transcript

  1. None

  2. @keithpitt

  3. None
  4. None

  5. I’m excited! ⚡

  6. But first…history

  7. + Probably the Future +

  8. Glad I said “probably”

  9. + Probably the Future +

  10. + Probably the Future +

  11. + + Is the future.

  12. React

  13. None
  14. None

  15. 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.
  16. None

  17. + Backbone

  18. + Flux

  19. +

  20. None
  21. None
  22. None
  23. None
  24. None
  25. None
  26. None

  27. Too many random “Restful” JSON endpoints

  28. The server and the client were coupled

  29. Inefficient and slow

  30. Too much code

  31. Lots of boiler plate

  32. Hard to get started

  33. Telstra

  34. None
  35. None

  36. GraphQL

  37. Relay

  38. GraphQL

  39. None
  40. None

  41. CURL -X POST https://api.buildkite.com/v1/organizations/buildkite/ projects/buildkite/23

  42. None

  43. CURL -X POST https://api.buildkite.com/v1/organizations/buildkite/ projects/buildkite/23?expand=comments

  44. CURL -X POST https://api.buildkite.com/v1/organizations/buildkite/ projects/buildkite/23/comments

  45. None
  46. None
  47. None

  48. A specification

  49. It’s represents data how we think about it

  50. It looks like JSON

  51. Simple HTTP Post

  52. You control what data is returned

  53. Typed

  54. Introspection

  55. None
  56. None

  57. IDE integration

  58. Before commit hook validation

  59. None
  60. None
  61. None

  62. Relay

  63. The glue between GraphQL and React

  64. None
  65. None
  66. None

  67. Demo

  68. Relay

  69. Batched requests

  70. Partial data fetching

  71. Telstra

  72. Things I skipped:

  73. Things I skipped: Webpack + Rails Mutations Security + Authorisation

    Routes Subscriptions ES6,7,8,9,10,xx Probably more…

  74. Get excited ⚡

  75. + + Is the future.

  76. None
  77. None

  78. Demo

  79. None
  80. None
  81. None
  82. None
  83. None
  84. None
  85. None

  86. CURL -X POST \ -H "Authorization: Bearer xxx" \ https://graphql.buildkite.com/v1

    \ -d '{ "query": "query AwesomeQuery { viewer { user { name } } }" }'

  87. Fin ❤ @keithpitt