GraphQL : le langage de requête qui a révolutionné les APIs
GraphQL est un langage de requête et un runtime pour APIs développé par Facebook en 2012 et open-sourcé en 2015. Il représente un changement de paradigme par rapport à REST : au lieu d'endpoints multiples retournant des structures fixes, GraphQL offre un endpoint unique où le client spécifie exactement les données qu'il souhaite recevoir.
J'ai adopté GraphQL après des années de frustration avec REST. Le problème classique : votre équipe mobile a besoin de moins de données que le web (bande passante), mais créer des endpoints spécifiques multiplie le travail côté serveur. GraphQL résout ce problème élégamment — chaque client demande ce dont il a besoin, ni plus ni moins.
Les trois opérations fondamentales
📖 Queries (lecture)
Lecture de données. query { user(id: 1) { name email } }. Sélectionnez uniquement les champs nécessaires, traversez les relations en une seule requête.
✏️ Mutations (écriture)
Création, modification, suppression. mutation { createUser(name: "John") { id } }. Retournent les données modifiées pour mettre à jour le cache client.
🔔 Subscriptions (temps réel)
Flux de données en temps réel via WebSocket. subscription { messageAdded { text sender } }. Idéal pour chat, notifications, dashboards live.
🧩 Fragments (réutilisation)
fragment UserFields on User { id name avatar }. Réutilisez des sélections de champs. DRY appliqué aux requêtes, co-localisé avec les composants.
Le système de types GraphQL
GraphQL est fortement typé. Le schema définit toutes les opérations et types disponibles :
- Scalars :
Int,Float,String,Boolean,ID+ scalars custom (DateTime,JSON...) - Object types :
type User { id: ID! name: String! posts: [Post!]! } - Input types : Pour les arguments complexes de mutations
- Enums :
enum Status { ACTIVE INACTIVE PENDING } - Interfaces & Unions : Polymorphisme (
interface Node { id: ID! })
Le ! indique un champ non-nullable. [Type!]! = liste non-null de non-nulls.
Fonctionnalités avancées
- Variables :
query GetUser($id: ID!) { user(id: $id) { name } }. Évitez la concaténation de strings, prévient les injections. - Aliases :
admin: user(role: ADMIN) { name } moderator: user(role: MOD) { name }. Requêtez le même champ plusieurs fois. - Directives :
@include(if: $bool),@skip(if: $bool),@deprecated. Contrôle conditionnel. - Introspection : Requêtez le schema lui-même. Base de GraphiQL, Apollo Studio, générateurs de types.
- Persisted queries : Pré-enregistrez les queries pour réduire la taille des requêtes et améliorer la sécurité.
Écosystème et outils
- Apollo : Client (React, iOS, Android) + Server (Node.js). Le plus populaire.
- Relay : Client Facebook, optimisé pour React. Plus opinionné, conventions fortes.
- Hasura / PostGraphile : GraphQL auto-généré depuis PostgreSQL.
- GraphQL Code Generator : Génère types TypeScript depuis le schema.
- GraphiQL / Apollo Studio : IDE dans le navigateur pour explorer et tester.
Traitement local : confidentialité garantie
Ce formateur traite vos requêtes GraphQL entièrement dans votre navigateur. Aucune donnée n'est envoyée à un serveur — formatez vos schemas propriétaires en toute confiance.