Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
GraphQL
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Stefan Kanev
March 28, 2018
Programming
480
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
110
From Novice to Expert
skanev
0
470
Inbetween Code and Profession
skanev
0
460
Clojure & ClojureScript
skanev
2
140
Extreme Programming
skanev
0
840
За смъртта на TDD
skanev
0
650
Python 0 2014
skanev
1
1.8k
Clojure 0 2014
skanev
0
410
Other Decks in Programming
See All in Programming
Seven New Principles of Software Engineering
yegor256
0
110
なぜCTOを降りてFDEを選んだのか?〜なぜプロダクト企業がFDEで顧客の現場に踏み込むのか〜
gonta
1
220
Verilogで学ぶCPU自作入門
uyuki234
8
4.2k
現場と育てるRailsモデリング 〜Spreadsheetから始めたモデル設計〜
siroemk
2
660
オーケストレーション記述言語 Katari
yukikurage
0
100
JAWS-UG 東京支部が始める、JAWS-UG支部コラボ / JAWS-UG lunchtime LT Collaboration
y0hgi
0
280
sbt 2.0: takeoff
eed3si9n
0
160
Vue Fes Japan の “作る側”に関わってみて
naokihaba
0
160
GemmaをJevのように使ってみる / Use Gemma like Jev
kishida
5
800
Next.js: The final boss of Web Performance
guaca
0
290
[2026-09-26]空論ジェネリックプロセス~テスト資産とAIで紡ぐ、再現可能なパフォーマンスチューニングの話~
tosite
0
270
Kotlinの15年とServer-Side Kotlin
n_takehata
1
160
Featured
See All Featured
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.9k
Fireside Chat
paigeccino
43
4.1k
Mozcon NYC 2025: Stop Losing SEO Traffic
samtorres
1
580
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
sarafernandez
2
1.6k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
3k
エンジニアに許された特別な時間の終わり
watany
109
250k
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
sarafernandez
0
300
Primal Persuasion: How to Engage the Brain for Learning That Lasts
tmiket
0
500
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.9k
Designing for Timeless Needs
cassininazir
1
530
Navigating Team Friction
lara
192
16k
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
1
630
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
?