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
Introduction à GraphQL
Search
fdecampredon
April 07, 2016
Technology
0
1.1k
Introduction à GraphQL
JS-Star meetup Paris
http://www.meetup.com/fr-FR/Js-Star/events/229601871/
fdecampredon
April 07, 2016
Tweet
Share
More Decks by fdecampredon
See All by fdecampredon
Reactive Programming et React
fdecampredon
3
170
Going Reactive with React
fdecampredon
1
540
Introduction à ReactJS
fdecampredon
0
59
Other Decks in Technology
See All in Technology
From Natural Language to K8s Operations: The MCP Architecture and Practice of kubectl-ai
appleboy
0
230
RemoteFunctionを使ったコロケーション
mkazutaka
1
120
だいたい分かった気になる 『SREの知識地図』 / introduction-to-sre-knowledge-map-book
katsuhisa91
PRO
3
1.4k
OCIjp_Oracle AI World_Recap
shinpy
1
180
個人でデジタル庁の デザインシステムをVue.jsで 作っている話
nishiharatsubasa
3
5.1k
AI時代、“平均値”ではいられない
uhyo
8
2.6k
プロダクト開発と社内データ活用での、BI×AIの現在地 / Data_Findy
sansan_randd
0
170
パフォーマンスチューニングのために普段からできること/Performance Tuning: Daily Practices
fujiwara3
2
130
JSConf JPのwebsiteをGatsbyからNext.jsに移行した話 - Next.jsの多言語静的サイトと課題
leko
2
190
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
14
82k
AWS DMS で SQL Server を移行してみた/aws-dms-sql-server-migration
emiki
0
240
会社を支える Pythonという言語戦略 ~なぜPythonを主要言語にしているのか?~
curekoshimizu
3
750
Featured
See All Featured
Raft: Consensus for Rubyists
vanstee
140
7.2k
Learning to Love Humans: Emotional Interface Design
aarron
274
41k
Designing Experiences People Love
moore
142
24k
Optimising Largest Contentful Paint
csswizardry
37
3.5k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
10
890
Building Better People: How to give real-time feedback that sticks.
wjessup
369
20k
How to Think Like a Performance Engineer
csswizardry
27
2.1k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.1k
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
Art, The Web, and Tiny UX
lynnandtonic
303
21k
Mobile First: as difficult as doing things right
swwweet
225
10k
RailsConf 2023
tenderlove
30
1.3k
Transcript
Introduction à GraphQL @fdecampredon JS Star Paris - 7/04/2016
Petite histoire de la communication client server
2005: AJAX est né
Au début c’était le chaos
Des milliers de possibilités • Web Services - SOAP •
Remote Object • JSON-RPC • Etc…
Et puis un winner : REST
Pourquoi REST ? • Stateless • Cacheable • « Standard
» • « Facile »
REST est parfait
Vraiment ?
Multiplication des devices = Multiplication des end points
Sur mobile, les vieux clients force à versioner les API
Et plus encore • Complexité à fetcher des objets complexes
sans effectuer de multiples requêtes • Pas de type et impossibilité d’introspection • Etc…
Et le cauchemar commence
Nouveaux problèmes = Nouvelle solution
GraphQL
GraphQL • Un language de Requête de données (et
pas de base données) • On « décrit » nos types de données sous forme d’un Graphe • On définit nos Requêtes sur le client
Comment Utiliser GraphQL
Définition des types sur le serveur
Un type system riche • Des Scalar : Boolean, String,
Int, Float, etc.. • Des « Object Types» • Des interfaces, enum, List, non-null type etc…
On crée ses requêtes sur le client
On récupère uniquement les données nécessaires
Quels sont les avantages ? • Hiérarchique • Centré sur
le Produit • Requêtes spécifiées sur le client • Plus de problèmes de backward compatibility • Type System • Introspection
GraphQL sur le client
Relay
Relay • Créer pour GraphQL • Permet à chaque composant
de définir les données dont il a besoin • Au coeur de la plupart des applications Facebook
Chaque composant définit les données dont il a besoin
On compose les requêtes comme on compose les composants
GraphQL sans Relay
On définit simplement ses requêtes dans ses « services »
Conclusion • REST pose de gros problèmes • GraphQL est
une nouvelle technologie permettant de remplacer REST • A utiliser avec ou sans Relay
François de Campredon @fdecampredon https://github.com/fdecampredon/ Questions ? Relay: https://facebook.github.io/relay/ Graphql:
http://graphql.org/