Introduction à GraphQL

Slide 1

Slide 1 text

Introduction à GraphQL @fdecampredon JS Star Paris - 7/04/2016

Slide 2

Slide 2 text

Petite histoire de la communication client server

Slide 3

Slide 3 text

2005: AJAX est né

Slide 4

Slide 4 text

Au début c’était le chaos

Slide 5

Slide 5 text

Des milliers de possibilités • Web Services - SOAP • Remote Object • JSON-RPC • Etc…

Slide 6

Slide 6 text

Et puis un winner : REST

Slide 7

Slide 7 text

Pourquoi REST ? • Stateless • Cacheable • « Standard » • « Facile »

Slide 8

Slide 8 text

REST est parfait

Slide 9

Slide 9 text

Vraiment ?

Slide 10

Slide 10 text

Multiplication des devices   =   Multiplication des end points

Slide 11

Slide 11 text

Sur mobile, les vieux clients force à versioner les API

Slide 12

Slide 12 text

Et plus encore • Complexité à fetcher des objets complexes sans effectuer de multiples requêtes • Pas de type et impossibilité d’introspection • Etc…

Slide 13

Slide 13 text

Et le cauchemar commence

Slide 14

Slide 14 text

Nouveaux problèmes = Nouvelle solution

Slide 15

Slide 15 text

GraphQL

Slide 16

Slide 16 text

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éﬁnit nos Requêtes sur le client

Slide 17

Slide 17 text

Comment Utiliser GraphQL

Slide 18

Slide 18 text

Déﬁnition des types sur le serveur

Slide 19

Slide 19 text

Un type system riche • Des Scalar : Boolean, String, Int, Float, etc.. • Des « Object Types» • Des interfaces, enum, List, non-null type etc…

Slide 20

Slide 20 text

On crée ses requêtes sur le client

Slide 21

Slide 21 text

On récupère uniquement les données nécessaires

Slide 22

Slide 22 text

Quels sont les avantages ? • Hiérarchique • Centré sur le Produit • Requêtes spéciﬁées sur le client • Plus de problèmes de backward compatibility • Type System • Introspection

Slide 23

Slide 23 text

GraphQL sur le client

Slide 24

Slide 24 text

Relay

Slide 25

Slide 25 text

Relay • Créer pour GraphQL • Permet à chaque composant de déﬁnir les données dont il a besoin • Au coeur de la plupart des applications Facebook

Slide 26

Slide 26 text

Chaque composant déﬁnit les données dont il a besoin

Slide 27

Slide 27 text

On compose les requêtes comme on compose les composants

Slide 28

Slide 28 text

GraphQL sans Relay

Slide 29

Slide 29 text

On déﬁnit simplement ses requêtes dans ses « services »

Slide 30

Slide 30 text

Conclusion • REST pose de gros problèmes • GraphQL est une nouvelle technologie permettant de remplacer REST • A utiliser avec ou sans Relay

Slide 31

Slide 31 text

François de Campredon @fdecampredon https://github.com/fdecampredon/ Questions ? Relay: https://facebook.github.io/relay/ Graphql: http://graphql.org/