Recursos
RecursosClientes GraphQL

Clientes GraphQL

Esto es una recopilación y resumen de algunos de los clientes más populares para interactuar con GraphQL.

GraphiQL

GraphiQL es el IDE para ejecutar consultas GraphQL por excelencia. Lanzado inicialmente junto con GraphQL, hizo inmediatamente evidente cómo GraphQL podía ofrecer una experiencia de desarrollo superior a la de las APIs existentes, combinando en un solo lugar un cliente para ejecutar consultas contra el servidor GraphQL, y un explorador para navegar por la documentación del esquema.

GraphiQL

Entre otras, GraphiQL ofrece las siguientes características:

  • Pestañas
  • Cabeceras personalizadas
  • Resaltado de sintaxis
  • Autocompletado inteligente de campos, argumentos, tipos y más
  • Resaltado e informe de errores en tiempo real para consultas y variables
  • Autocompletado de consultas y variables
  • Adición automática de campos requeridos a las consultas
  • Explorador de documentación, búsqueda, con soporte markdown
  • Historial de consultas usando local storage
  • Temas

Hay una demo disponible en graphql.org/swapi-graphql. Compón una consulta GraphQL ayudado por el editor, pulsa el botón "Execute Query" en el centro de los dos paneles, y observa la respuesta a la consulta.

Voyager

El GraphQL Voyager es el visualizador interactivo de esquemas por excelencia, que muestra (como mencionan en su documentación) el "grafo detrás de GraphQL".

Voyager

Viene con estas características:

  • Navegación rápida sobre el grafo.
  • Panel izquierdo que proporciona información más detallada sobre cada tipo.
  • Opción "Skip Relay" que simplifica el grafo eliminando las clases envolventes de Relay.
  • Capacidad de elegir cualquier tipo como raíz del grafo.

Hay una demo en vivo en ivangoncharov.github.io/graphql-voyager.

DociQL

DociQL proporciona un comando para generar una hermosa documentación HTML5 estática a partir de un endpoint GraphQL. Tras ejecutar el comando, el resultado será un directorio que incluye archivos HTML, CSS y JS que debemos copiar a nuestro servidor web, para mostrar la documentación de nuestro esquema GraphQL.

La documentación generada, por defecto, muestra una disposición de página única con 3 columnas, con enlaces a todos los tipos en la columna izquierda, una descripción en el centro, y una consulta de ejemplo a la derecha:

DociQL

Viene con estas características:

  • Utiliza la introspection query para obtener un esquema de GraphQL y genera documentación al vuelo.
  • Genera un ejemplo de petición y respuesta con enlaces "Try it now".
  • Permite al usuario definir casos de uso y agruparlos por dominio.
  • Configurable mediante plantillas Handlebars y estilos SCSS.
  • Soporte markdown dentro de las descripciones de la API.
  • Maquetación responsive HTML5 y CSS3 que funciona en todos los dispositivos y tamaños de pantalla.
  • Documentación parcial, embebible dentro de un sitio web existente.

Hay una demo de la documentación generada disponible en wayfair.github.io/dociql.

SpectaQL

SpectaQL se construye sobre DociQL para adaptarlo mejor a GraphQL. Proporciona un tema que muestra solo información relevante para GraphQL, eliminando contenido del dominio Swagger/OpenAPI (por ejemplo, descarta los mensajes "Response Content-Types: application/json" y "Response Example (200 OK)" mostrados en el ejemplo de consulta).

SpectaQL

SpectaQL también permite introducir la fuente del esquema GraphQL utilizando varias opciones:

  • Desde un endpoint en vivo utilizando la introspection query.
  • Desde un archivo que contiene un resultado de introspection query.
  • Desde un archivo, archivos o glob que apuntan a las definiciones del esquema en SDL.

Hay una demo de la documentación generada en useanvil.com/docs/api/graphql/reference.

Postman

Postman es una plataforma de APIs para construir y usar APIs. Aunque no está construido específicamente para GraphQL, Postman puede usarse para ejecutar consultas GraphQL, y agilizar la colaboración para crear APIs GraphQL.

Postman

Postman incluye herramientas que ayudan a acelerar el ciclo de vida de las APIs, incluyendo diseño, pruebas, documentación y mocking de las APIs. Y podemos organizar las APIs mediante workspaces, para colaborar con compañeros de equipo repartidos por todo el mundo.

Altair

Altair es otro GraphQL Client IDE más, similar a Postman pero específico para GraphQL.

Altair

Además de todas las características ofrecidas por cualquier GraphQL client IDE, Altair también ofrece entornos, de modo que podamos cambiar entre el uso de APIs para entornos local, staging y producción, y colecciones de consultas, para compartir fácilmente con los miembros del equipo.