Clients GraphQL
Voici une compilation et un aperçu de certains des clients les plus populaires pour interagir avec GraphQL.
GraphiQL
GraphiQL est l'IDE pour exécuter des requêtes GraphQL par excellence. Initialement publié en même temps que GraphQL, il a immédiatement mis en évidence comment GraphQL pouvait offrir une expérience de développement supérieure à celle des APIs existantes, en combinant en un seul endroit un client pour exécuter des requêtes contre le serveur GraphQL, et un explorateur pour parcourir la documentation du schéma.
Entre autres, GraphiQL offre les fonctionnalités suivantes :
- Onglets
- En-têtes personnalisés
- Coloration syntaxique
- Autocomplétion intelligente des champs, arguments, types et plus encore
- Mise en évidence et signalement des erreurs en temps réel pour les requêtes et les variables
- Autocomplétion automatique des requêtes et des variables
- Ajout automatique des champs obligatoires aux requêtes
- Explorateur de documentation, recherche, avec support Markdown
- Historique des requêtes utilisant le stockage local
- Thèmes
Une démo est disponible sur graphql.org/swapi-graphql. Composez une requête GraphQL à l'aide de l'éditeur, appuyez sur le bouton « Execute Query » au centre des deux volets, et observez la réponse à la requête.
Voyager
Le GraphQL Voyager est le visualiseur de schéma interactif par excellence, montrant (comme ils le mentionnent dans leur documentation) le « graphe derrière GraphQL ».
Il est fourni avec ces fonctionnalités :
- Navigation rapide sur le graphe.
- Panneau gauche qui fournit des informations plus détaillées sur chaque type.
- Option « Skip Relay » qui simplifie le graphe en supprimant les classes enveloppantes de Relay.
- Possibilité de choisir n'importe quel type comme racine du graphe.
Il y a une démo en direct sur ivangoncharov.github.io/graphql-voyager.
DociQL
DociQL fournit une commande pour générer une belle documentation HTML5 statique à partir d'un endpoint GraphQL. Après l'exécution de la commande, le résultat sera un répertoire incluant des fichiers HTML, CSS et JS que nous devons copier sur notre serveur web, pour afficher la documentation de notre schéma GraphQL.
La documentation générée, par défaut, affiche une mise en page sur une seule page avec 3 colonnes, avec des liens vers tous les types dans la colonne de gauche, une description au centre, et un exemple de requête à droite :
Il est fourni avec ces fonctionnalités :
- Utilise la introspection query pour récupérer un schéma GraphQL et génère la documentation à la volée.
- Génère un exemple de requête et de réponse avec des liens « Try it now ».
- Permet à l'utilisateur de définir des cas d'usage et de les regrouper par domaine.
- Configurable via des templates Handlebars et des styles SCSS.
- Support Markdown dans les descriptions d'API.
- Mise en page responsive HTML5 et CSS3 qui fonctionne sur tous les appareils et tailles d'écran.
- Documentation partielle, intégrable dans un site web existant.
Une démo de la documentation générée est disponible sur wayfair.github.io/dociql.
SpectaQL
SpectaQL s'appuie sur DociQL pour mieux l'adapter à GraphQL. Il fournit un thème qui affiche uniquement les informations pertinentes pour GraphQL, en supprimant le contenu du domaine Swagger/OpenAPI (par exemple, il ignore les messages « Response Content-Types: application/json » et « Response Example (200 OK) » affichés dans l'exemple de requête).
SpectaQL permet également de saisir la source du schéma GraphQL en utilisant plusieurs options :
- Depuis un endpoint actif utilisant la introspection query.
- Depuis un fichier contenant un résultat de introspection query.
- Depuis un fichier, des fichiers ou un glob menant aux définitions du schéma en SDL.
Une démo de la documentation générée est disponible sur useanvil.com/docs/api/graphql/reference.
Postman
Postman est une plateforme d'APIs pour créer et utiliser des APIs. Bien qu'il ne soit pas conçu spécifiquement pour GraphQL, Postman peut être utilisé pour exécuter des requêtes GraphQL, et faciliter la collaboration pour créer des APIs GraphQL.
Postman inclut des outils qui aident à accélérer le cycle de vie des APIs, notamment la conception, les tests, la documentation et le mocking des APIs. Et nous pouvons organiser les APIs via des workspaces, pour collaborer avec des coéquipiers répartis dans le monde entier.
Altair
Altair est un autre GraphQL Client IDE, similaire à Postman mais spécifique à GraphQL.
En plus de toutes les fonctionnalités offertes par n'importe quel GraphQL client IDE, Altair propose également des environnements, afin que nous puissions basculer entre l'utilisation des APIs pour les environnements local, staging et production, et des collections de requêtes, pour partager facilement avec les membres de l'équipe.