Accede a todo EDteam con un único pago¡Sube a premium con -50%!

¿Qué es GraphQL?

Si te dedicas al mundo de la programación estoy seguro que has escuchado sobre GraphQL si es que ya no lo estas usando. Por eso en este artículo te explicaré que es y como funciona, quédate hasta el final porque te tengo un regalo.

Diseño web
8 minutos
Hace 4 años
¿Qué es GraphQL?

En el mundo del software necesitamos acceder a muchos datos, ya sea para leerlos, borrarlos, modificarlos, etc. ¿Cómo accedes a estos datos? La forma más común es a través de una API, en palabras sencillas una API es una comunicación entre aplicaciones.

Antes de continuar es muy recomendable que te pases por este artículo donde te explicamos 📑 ¿Qué son las APIs y para qué sirven?

Ahora si continuemos. Una API es una capa de comunicación a través de la cual una aplicación puede leer los datos de otra. Por ejemplo tú podrías leer los datos de Facebook y mostrar a todos tus amigos en tu aplicación. Y no solo de Facebook, también de Twitter, Google, GitHub y cuanta aplicación te lo permita. Es así es como las integraciones de aplicaciones se hacen, ¡mediante APIs!

El tipo más usado de APIs es Rest. Y hasta antes de la llegada de GraphQL, Rest era suficiente para Facebook, pero llego un momento en le quedó corto. Facebook tiene miles de millones de usuarios que están publicando, subiendo fotos y conversando a la vez. ¿Te imaginas soportar toda esa carga? Por eso Rest le quedó corto y entonces nació GraphQL.

GraphQL es un nuevo tipo de API que cambia completamente el paradigma de Rest. ¿Esto significa que vino a matar a Rest y ya no deberías usarlo? La respuesta es ¡NO! Hay muchísimas aplicaciones que usan Rest y no tienen ningún problema. GraphQL fue creado para resolver un problema específico en Facebook, que tú también puedes usar si crees que te servirá en tus aplicaciones.

Ahora si iré al grano y te explicaré que es GraphQL y que lo hace diferente a Rest 🔥.

¿Qué es GraphQL?

GraphQL es una nueva forma de manejar las APIs. A nivel más específico podemos separarlo en dos caras: cliente y servidor.

El cliente hace las consultas a través de un "lenguaje de consultas". ¿Qué es un lenguaje de consultas? Es un lenguaje con una sintaxis para consultar datos con ciertos parámetros. Por ejemplo podrías hacer una consulta de todas las ventas de más de 100 dólares del mes de marzo de 2020. Haces esa consulta con una sintaxis y la base de datos te devuelve esa información, eso es un lenguaje de consultas. El más común es SQL (para base de datos relacionales) pero siempre esta del lado del backend. Ahora imagínate tener un lenguaje de consultas en el cliente, GraphQL lo hace realidad 🤯.

Por el lado del servidor tenemos un entorno de ejecución para entregar las consultas. En SQL el motor de base de datos las procesa, pero en GraphQL necesitamos de este entorno de ejecución. Entonces es así como funciona: Nosotros hacemos las consultas que necesitemos, el servidor procesa dichas consultas conectándose a la base de datos y nos envía la información.

Algo muy importante de GraphQL es que es completamente independiente del lenguaje y de la base de datos. Es decir puede ser una base de datos relacional, no relacional e incluso una API Rest. Y por el lado de los lenguajes puedes usarlo con JS, PHP, Python, Go, con cualquier lenguaje.

¿Cuál es la diferencia entre GraphQL?

La principal diferencia es que en Rest el backend controla la petición mientras que en GraphQL el cliente es quien la controla.

Antes de explicártelo en profundidad debes saber que es un endpoint, un endpoint es una url a la que te conectas para traer la información que necesitas. En Rest esta url es creada por backend, es decir toda la información que viene en ese endpoint la define backend.

Mientras que el GraphQL, como tenemos un lenguaje de consultas, el cliente es quien la controla, es decir puede conectarse al endpoint y definir que datos traer.

Estas son algunas diferencias más:

¿Cómo funciona GraphQL?

Funciona en tres sencillos pasos:

  1. Backend define la estructura de datos
  2. El cliente hace la petición con el lenguaje de consultas GraphQL y la estructura de datos que se define en el paso uno.
  3. El cliente obtiene exactamente lo que necesita (ni más, ni menos).

Para entenderlo más a fondo debes entender que GraphQL usa un sistema de tipos para estructurar la información (Paso 1):

  • Queries: Representan las consultas (la petición de datos)
  • Mutations: En Rest es el equivalente a post, delete y update.
  • Subscriptions: Son eventos en tiempo real que se comunican a través de un Websocket

Esta estructura de Typos (Los queries, mutations y subscriptions) se llaman Schema, que es el contrato que le comunica al cliente como va a consultar la información. Esta es la famosa autodocumentación de GraphQL, es decir cuando el cliente se conecta tiene acceso a ese Schema y puede revisar como está estructurada la información y saber que va a recibir y que datos puede pedir.

Una vez que tenemos la estructura de Typos, estos se conectan a los Resolvers que se conectan a su vez a la fuente de datos que puede ser SQL, No SQL, GraphQL o API rest. Los resolvers son funciones que se ejecutan cada vez que se hace una petición, y se conectan al Schema para entender la estructura de datos y luego se conectan a la fuente de datos para poder devolverle al cliente los datos que está solicitando. Y es así como funciona GraphQL 🔥.

De esta manera frontend ya no tiene que esperar a backend para que le actualice o cree un endpoint para solicitar información. Por es GraphQL es una gran opción para acelerar el trabajo y además como solo hace una petición y controla exactamente la respuesta puede darnos aplicaciones más rápidas, ¡he ahí la ventaja de usarlo!

¿Te ha gustado GraphQL y ya quieres echar código?

En este curso te enseñaremos desde cero, solo debes ir a ed.team/cursos/graphql para comenzar a aprender GraphQL 🚀.

Nos vemos en un próximo artículo, chau 👋.

Este solo es un resumen del video que preparamos en nuestro canal de YouTube 📺 ¿Qué es GraphQL?

Descarga los slides del video aquí 👇

Descarga los recursos del artículo

los slides del video 📥

Descargar gratis
Descarga los recursos

Comentarios de los usuarios

Pregunta a ChatEDT