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
GraphQL
Search
Stefan Kanev
March 28, 2018
Programming
460
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
GraphQL
Stefan Kanev
March 28, 2018
More Decks by Stefan Kanev
See All by Stefan Kanev
Въведение в (Machine|Deep) Learning
skanev
0
110
Automated Testing: Getting it Right
skanev
1
95
From Novice to Expert
skanev
0
450
Inbetween Code and Profession
skanev
0
450
Clojure & ClojureScript
skanev
2
140
Extreme Programming
skanev
0
820
За смъртта на TDD
skanev
0
640
Python 0 2014
skanev
1
1.8k
Clojure 0 2014
skanev
0
400
Other Decks in Programming
See All in Programming
The NotImplementedError Problem in Ruby
koic
1
1.1k
技術記事、 専門家としてのプログラマ、 言語化
mizchi
14
7.2k
鹿野さんに聞く!『TypeScriptコードレシピ集』で磨く実践力
tonkotsuboy_com
4
960
作って学ぶ、 JSX (TSX) ランタイムの基本
syumai
7
1.7k
技術的負債解消で開発者の未来を開く- AIの力でコード刷新
kmd2kmd
0
140
セキュリティの専門家じゃなくてもできる。「セキュリティ意識」をアップデートして サプライチェーン攻撃への耐性を高めよう。
tk3fftk
5
1k
SLOをサービス品質の共通言語にするために 取り組んできたこと
wakana0222
0
250
フロントエンドとバックエンドで「1文字」を揃えよう
youkidearitai
PRO
0
780
「AIで開発し、AIを届ける」をEvalでつなぐ 〜AIネイティブに始めるプロダクト開発の実践〜 / Connecting "Develop with AI, deliver AI" with Eval
rkaga
4
5.6k
AIで効率化できた業務・日常
ochtum
0
160
20260623_Loop Engineeringで自分の分身の問い合わせBotを作る
ryugen04
0
110
AI 輔助遺留系統現代化的經驗分享
jame2408
1
1.1k
Featured
See All Featured
Conquering PDFs: document understanding beyond plain text
inesmontani
PRO
4
2.9k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
12
1.2k
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
2
410
How to train your dragon (web standard)
notwaldorf
97
6.7k
What Being in a Rock Band Can Teach Us About Real World SEO
427marketing
0
1k
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
190
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
47
8.2k
How to build a perfect <img>
jonoalderson
1
5.8k
How to make the Groovebox
asonas
2
2.3k
Code Review Best Practice
trishagee
74
20k
Stewardship and Sustainability of Urban and Community Forests
pwiseman
0
240
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
baasie
0
600
Transcript
GraphQL Stefan Kanev http://skanev.com/ @skanev Slovenia Ruby User Group 28
March 2018 Ljubljana Why is it exciting?
Hi, I’m Stefan
skanev skanev skanev.com about.me/skanev
Chief Technical Officer @
None
Despite the management title, I still tend to think of
myself as a programmer
None
This should be part talk, part Q&A
1 2 3 4 Walkthrough Demonstration Benefits React and Relay
1 Walkthrough
It’s not a technology It’s a standard
queries vs. mutations “gets” data changes stuff
queries vs. mutations “gets” data changes stuff
Queries data on the server is represented as a graph
the client specifies which part of the graph to fetch server returns only those parts the input is in a special language the output is in JSON
None
None
query { hero { name friends { name } }
} Query { "data": { "hero": { "name": "R2-D2", "friends": [ { "name": "Luke Skywalker" }, { "name": "Han Solo" }, { "name": "Leia Organa" } ] } } } Response
Query query { hero { name appearsIn friends { name
appearsIn } } } Response { "data": { "hero": { "name": "R2-D2", "appearsIn": ["NEWHOPE", "EMPIRE", "JEDI"], "friends": [ { "name": "Luke Skywalker", "appearsIn": ["NEWHOPE", "EMPIRE", "JEDI"] }, { "name": "Han Solo", "appearsIn": ["NEWHOPE", "EMPIRE", "JEDI"] }, { "name": "Leia Organa", "appearsIn": ["NEWHOPE", "EMPIRE", "JEDI"] } ] } } }
Schema the graph is composed of objects each object
is of a specific type each type defines a number of fields each field has a type there is a form of polymorphism
type Character { name: String! friends: [Character]! appearsIn: [Episode]! }
type Character { name: String! friends: [Character!]! appearsIn: [Episode!]! } By the way, this… …is better in a different way: Anybody see the difference?
queries vs. mutations “gets” data changes stuff
Mutations each mutation is a separate endpoint it’s RPC-like
(conceptually similar to REST mutations) it still goes through the GraphQL language we’ll see an example later
2 Demonstration
3 Benefits
Caveat emptor It might be a better fit for when
you control the client, as opposed to letting anybody create a client The complexity on the backend is a magnitude bigger
Self-documenting
Decouples clients from backend once the graph is large enough,
clients won’t need to request (as many) endpoints for reading it’s closer to “write once”
Versionless evolution Versioning APIs is a bitch You can
get away with not doing it to a large extent (example)
Traffic optimisation You get only what you asked for
You can get multiple things with a single request
Structure It provides a lot of structure to build 3rd
party tools on (especially in comparison to REST) GraphiQL is a good example Apollo Engine is another one Relay is the most interesting example
4 React and Relay
None
None
?