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
Lightning Talk at JSConf 2015
Search
Dafeng
July 12, 2015
Programming
1.3k
12
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Lightning Talk at JSConf 2015
Quick intro to GraphQL and Relay
Dafeng
July 12, 2015
More Decks by Dafeng
See All by Dafeng
Things to Know before Building Large-scale React.js Application
dfguo
6
1.9k
ReactJS in Strikingly
dfguo
6
1.1k
I’ ve shipped the code, what’ s next
dfguo
6
700
Other Decks in Programming
See All in Programming
Apache Hive: Toward a Cloud Native Lakehouse
okumin
0
170
仕様駆動開発へのトライを機に チームに適合する手法を模索し続けている話
freee
PRO
0
150
AI時代、エンジニアはどう育つのか -未経験エンジニアの成長を間近で見て考えたこと-
thasu0123
0
210
Claude Team Plan導入・ガイド
tk3fftk
0
250
Laravelで学ぶ Webアプリケーションチューニング入門/web_application_tuning_101
hanhan1978
4
1.5k
Lean は証明の正しさを確認するためだけのツールって思ってませんか?
inoueasei
1
130
自動化したのに回らないテスト運用の壁ーAI時代の品質責任と生産性
mfunaki
0
120
「寝てても仕事が進む」Claude Codeで組む第二の脳
tomoyafujita2016
0
250
JAWS-UG横浜 #102 AWSサ終供養LT会 成仏できない AWS サービスたち 〜本日、三体供養します〜
maroon1st
0
290
PHP に部分適用が来るぞ!……ところで何それ?おいしいの? #phpcon / phpcon-2026
shogogg
0
480
AI時代に設計が 最大の生産性レバーになる 意図駆動開発とデータを消さない設計|Don't Delete Your Data or Your Intent — Design as the Deepest Lever in the AI Era
tomohisa
0
250
GDG Korea Android: 2026 I/O Extended ~ What's new in Android development tools
pluu
0
200
Featured
See All Featured
Heart Work Chapter 1 - Part 1
lfama
PRO
8
36k
VelocityConf: Rendering Performance Case Studies
addyosmani
333
25k
Design in an AI World
tapps
1
270
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
konakalab
0
500
What does AI have to do with Human Rights?
axbom
PRO
1
2.3k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.8k
We Have a Design System, Now What?
morganepeng
55
8.2k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
The Curious Case for Waylosing
cassininazir
1
440
It's Worth the Effort
3n
188
29k
How to Align SEO within the Product Triangle To Get Buy-In & Support - #RIMC
aleyda
2
1.7k
Darren the Foodie - Storyboard
khoart
PRO
3
3.5k
Transcript
GraphQL and Relay Lightning Talk at JSConf 2015
About me • Dafeng Guo, CTO of strikingly.com • Strikingly
• simplest website builder • probably the largest React.js user in China
GraphQL What the hell is it?
None
None
“REST is perfect!” - A random backend engineer
REST-ful API Sometimes Sucks • Round trip for complicated objects
• Variable fields • Custom endpoint - not REST-ful design • Backend engineer dependency - slow down iterations
GraphQL • Server-side engineers published a type system • Client-side
engineers use GraphQL as a unified query interface • No more adhoc endpoints • Product changes are faster
None
Are we writing SQL in the client?! NO!
GraphQL Query JSON Response
GraphQL • REST-ful sometimes sucks • GraphQL is declarative •
GraphQL allows product engineers to iterate faster • Draft spec was released
Relay GraphQL on React
Component • Component is at the core of React •
Reusing any component, we are reusing • HTML - React • Javascript - React • CSS - Maybe React? • Data fetching - Relay
Relay • Allows you to define the data format the
component needs using GraphQL • Relay automatically fetch the data • Supports nested/composite components
Relay • Solving the data fetching problem • Supports composite
components • Makes component reuse possible • Will be open sourced in August
Thanks!