Cuándo (No) Crear un Servidor GraphQL

Rate this content
Bookmark

Cada desarrollador (frontend) está pidiendo una API GraphQL pero a menudo carece del conocimiento backend para crear un servidor eficiente. Hay muchos sabores diferentes para crear el servidor GraphQL perfecto, desde el enfoque de esquema primero hasta el enfoque de código primero o incluso soluciones generadas automáticamente. Permíteme mostrarte los pros y los contras de cada solución para que, después de esta charla, sepas cuál solución se ajustaría mejor a tu equipo.

This talk has been presented at GraphQL Galaxy 2021, check out the latest edition of this Tech Conference.

FAQ

Un servidor GraphQL permite optimizar las solicitudes del cliente y unir múltiples microservicios, ofreciendo eficiencia y autonomía al usuario al permitir control sobre los datos que fluyen en su aplicación.

Aunque es fácil construir un servidor GraphQL, hacerlo escalable puede ser complicado, ya que la gestión efectiva de la carga y el rendimiento puede presentar desafíos significativos.

Existen varios patrones como el servidor GraphQL de código primero, donde se comienza escribiendo resolvers, y el servidor SDL first GraphQL, donde se escribe primero el esquema y luego los resolvers basados en este esquema.

Se puede crear automáticamente un servidor GraphQL utilizando herramientas como Step 10, donde se escribe un esquema que se vincula a una fuente de datos y la plataforma genera automáticamente los resolvers necesarios.

GraphQL resuelve el problema de múltiples solicitudes innecesarias a diferentes puntos finales REST, lo que reduce el número de llamadas y la sobrecarga de datos. Además, ofrece a los clientes más control sobre los datos que necesitan.

El enfoque de código primero puede dificultar la separación de preocupaciones debido a que el esquema se genera a partir de los resolvers. En el enfoque schema first, escribir tanto resolvers como esquemas puede ser mucho trabajo.

Step Send GraphQL Studio es una plataforma en línea donde los usuarios pueden interactuar con APIs de terceros, crear APIs personalizadas y ejecutar consultas desde el navegador, facilitando la integración y manipulación de datos en tiempo real.

Roy Derks
Roy Derks
8 min
09 Dec, 2021

Comments

Sign in or register to post your comment.
Video Summary and Transcription
Construir un servidor GraphQL escalable puede ser desafiante. Hay múltiples razones para construir un servidor GraphQL, como optimizar las solicitudes del cliente y envolver microservicios. El servidor GraphQL basado en SDL te permite escribir tu esquema por separado de tus resolvers, dándote un control total. Puedes crear automáticamente una API GraphQL a partir de un esquema, simplificando el proceso y eliminando la necesidad de implementaciones manuales. El esquema puede vincular fuentes de datos y APIs de terceros, permitiendo una integración y personalización sencillas.

1. Introducción al servidor GraphQL

Short description:

Construir un servidor GraphQL escalable puede ser desafiante. Hay múltiples razones para construir un servidor GraphQL, como optimizar las solicitudes del cliente y envolver microservicios. Hay diferentes formas y patrones para crear un servidor GraphQL, siendo el enfoque de código primero uno de ellos.

Hola a todos. Mi nombre es Roy y bienvenidos a mi charla, cuando no crear un servidor GraphQL. ¿Para quién es esto? Es muy fácil construir un servidor GraphQL, pero es realmente difícil hacer un servidor GraphQL escalable. La escalabilidad a veces te golpeará en el trasero cuando empieces a escribir un servidor GraphQL. Hay muchas bibliotecas para construir una API GraphQL y hay muchos patrones diferentes para construir una API GraphQL y los exploraremos todos en esta charla. También mostraremos una forma de crear un servidor GraphQL automáticamente basado en tus backends existentes.

Un poco sobre mí. Mi nombre es Roy. Soy ingeniero de software y orador público. Puedes encontrarme en Twitter con el nombre de usuario, AdGetHackTeam y he escrito muchos libros sobre React y también GraphQL, el último es full stack GraphQL.

Antes de sumergirnos en cómo construir un servidor GraphQL, también echemos un vistazo a por qué quieres construir un servidor GraphQL en primer lugar. Hay muchas razones para construir un servidor GraphQL y creo que la primera es optimizar las solicitudes del cliente. Tienes un cliente que consume una API, pero de alguna manera tu API REST o tal vez diferentes tipos de llamadas API no son tan eficientes. Quieres tener esa eficiencia y también quieres dar cierta autonomía al usuario. Entonces, GraphQL no solo está ahí para resolver el problema de M más uno donde podrías estar obteniendo o enviando demasiados GraphQL, demasiados puntos finales REST, sino que GraphQL también le da autonomía al usuario. Como cliente, tienes más control sobre los tipos, sobre los datos que fluyen en tu aplicación. Optimizar las solicitudes del cliente no es la única forma o la única razón para crear un servidor GraphQL. También podría ser para envolver tus microservicios, por lo que GraphQL es perfectamente adecuado para unir múltiples microservicios que pueden ser microservicios GraphQL, pero también microservicios construidos con otra tecnología. Y también es muy bueno para envolver servicios heredados con esa capa de datos GraphQL. Hay múltiples razones para construir un servidor GraphQL y estas son dos razones perfectamente válidas para construir uno.

Hay múltiples formas de crear un servidor GraphQL. Como mencioné al principio, no hay una forma correcta. Hay muchas formas diferentes y muchos patrones diferentes y bibliotecas que te ayudarán con eso. El primer patrón que tenemos aquí es un servidor GraphQL de código primero. Con un servidor GraphQL de código primero, siempre comienzas escribiendo resolvers. Y estos resolvers generalmente usan clases o si estás usando TypeScript, probablemente usen un sistema de tipos de TypeScript para definir los resultados que devuelven estos resolvers. Y en función de esos resultados, un servidor GraphQL de código primero generará un esquema basado en los resolvers. Y luego, por supuesto, creará un servidor para ti. Y hay una gran desventaja, puedes hacer todo programáticamente. Pero la desventaja es que es muy difícil tener una separación de preocupaciones.

2. Creación de una API GraphQL a partir de un esquema

Short description:

El servidor GraphQL SDL first te permite escribir tu esquema por separado de tus resolvers, dándote control total. Sin embargo, este enfoque requiere escribir tanto resolvers como esquemas, lo cual puede llevar tiempo. Como alternativa, puedes crear automáticamente una API GraphQL a partir de un esquema utilizando el paso 10. Esto simplifica el proceso al generar resolvers en la nube y conectarse a diversas fuentes de datos, como bases de datos, APIs REST u otras APIs GraphQL. La API GraphQL sin servidor resultante maneja la escalabilidad y el rendimiento, eliminando la necesidad de implementaciones manuales.

Literalmente, no hay separación de preocupaciones, porque tu esquema se crea a partir de resolvers, y los resolvers son el único código que tienes. Por lo tanto, no tienes control sobre cómo se verá el esquema en última instancia. Para solucionar esto, existe el servidor SDL first GraphQL, también conocido como servidor schema first GraphQL.

La idea aquí es que escribas tu esquema, ya sea en SDL de GraphQL, de ahí el servidor SDL first, o puedes hacerlo con algunas bibliotecas externas. Existe la biblioteca GraphQL JS, que te permite escribir servidores schema first GraphQL, pero no utilizando SDL, sino sus propios métodos. Pero la idea es simple, creas tu esquema, creas tus resolvers basados en este esquema y esto creará un servidor para ti. Así que tienes una separación de preocupaciones muy buena, tienes tus esquemas separados de tus resolvers y tienes control total sobre todo. Pero esto, por supuesto, tiene las principales desventajas y escribir tanto resolvers como esquemas es mucho trabajo.

Afortunadamente, hay una solución. También puedes crear automáticamente tu API GraphQL a partir de un esquema. Y esto se puede hacer con el paso 10, como ejemplo. Veamos cómo funciona. Crear una API de gráficos con el paso 10 es muy sencillo. Simplemente escribes tu esquema. Puedes definir todos los tipos que tienes. Y estos tipos estarán vinculados a una fuente de datos de la que provienen. Y esto puede ser cualquier backend, como veremos más adelante. Y nuestra CLI generará automáticamente resolvers en el servidor para ti, directamente en la nube. Así que se implementará sin servidor, no tienes que preocuparte por ninguna implementación o por la escalabilidad de tus resolvers. Puedes conectar cualquier fuente de datos. Pueden ser bases de datos, ya sea SQL o Postgres. Pueden ser APIs REST, pueden ser APIs GraphQL, puedes conectar literalmente cualquier otra fuente de datos. Y luego, en función de esta fuente de datos, se creará una API GraphQL completamente sin servidor y de alto rendimiento para ti. Ya no tenemos que preocuparnos por la escalabilidad, el rendimiento o las implementaciones, todo se hará por ti. Y esto utiliza solo el lenguaje de diseño de esquemas de GraphQL. Aquí tienes dos ejemplos para MySQL Postgres a la izquierda y REST a la derecha. Como puedes ver, se utilizan directivas personalizadas para vincularse a la fuente de datos. Así que desde tu esquema, utilizando solo el lenguaje de diseño de esquemas de GraphQL, puedes crear conexiones con cualquier backend o cualquier fuente de datos. Además de Postgres y REST, también puedes usar cualquier otra API GraphQL como fuente de datos, como veremos en este ejemplo. Lo que tenemos aquí es un esquema.

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

De GraphQL Zero a GraphQL Hero con RedwoodJS
GraphQL Galaxy 2021GraphQL Galaxy 2021
32 min
De GraphQL Zero a GraphQL Hero con RedwoodJS
Top Content
Tom Pressenwurter introduces Redwood.js, a full stack app framework for building GraphQL APIs easily and maintainably. He demonstrates a Redwood.js application with a React-based front end and a Node.js API. Redwood.js offers a simplified folder structure and schema for organizing the application. It provides easy data manipulation and CRUD operations through GraphQL functions. Redwood.js allows for easy implementation of new queries and directives, including authentication and limiting access to data. It is a stable and production-ready framework that integrates well with other front-end technologies.
Componentes de Full Stack
Remix Conf Europe 2022Remix Conf Europe 2022
37 min
Componentes de Full Stack
Top Content
RemixConf EU discussed full stack components and their benefits, such as marrying the backend and UI in the same file. The talk demonstrated the implementation of a combo box with search functionality using Remix and the Downshift library. It also highlighted the ease of creating resource routes in Remix and the importance of code organization and maintainability in full stack components. The speaker expressed gratitude towards the audience and discussed the future of Remix, including its acquisition by Shopify and the potential for collaboration with Hydrogen.
Estado Local y Caché del Servidor: Encontrando un Equilibrio
Vue.js London Live 2021Vue.js London Live 2021
24 min
Estado Local y Caché del Servidor: Encontrando un Equilibrio
Top Content
This Talk discusses handling local state in software development, particularly when dealing with asynchronous behavior and API requests. It explores the challenges of managing global state and the need for actions when handling server data. The Talk also highlights the issue of fetching data not in Vuex and the challenges of keeping data up-to-date in Vuex. It mentions alternative tools like Apollo Client and React Query for handling local state. The Talk concludes with a discussion on GitLab going public and the celebration that followed.
RedwoodJS: El marco de aplicación React Full-Stack de tus sueños
React Summit Remote Edition 2021React Summit Remote Edition 2021
43 min
RedwoodJS: El marco de aplicación React Full-Stack de tus sueños
Top Content
Redwood JS is a full stack React app framework that simplifies development and testing. It uses a directory structure to organize code and provides easy data fetching with cells. Redwood eliminates boilerplate and integrates Jest and Storybook. It supports pre-rendering and provides solutions for authentication and deployment. Redwood is a cross-client framework that allows for building web and mobile applications without duplicating work.
Baterías Incluidas Reimaginadas - El Resurgimiento de GraphQL Yoga
GraphQL Galaxy 2021GraphQL Galaxy 2021
33 min
Baterías Incluidas Reimaginadas - El Resurgimiento de GraphQL Yoga
Envelope is a powerful GraphQL plugin system that simplifies server development and allows for powerful plugin integration. It provides conformity for large corporations with multiple GraphQL servers and can be used with various frameworks. Envelope acts as the Babel of GraphQL, allowing the use of non-spec features. The Guild offers GraphQL Hive, a service similar to Apollo Studio, and encourages collaboration with other frameworks and languages.
Aplicaciones sólidas de React y GraphQL para personas con prisa
GraphQL Galaxy 2022GraphQL Galaxy 2022
29 min
Aplicaciones sólidas de React y GraphQL para personas con prisa
The Talk discusses the challenges and advancements in using GraphQL and React together. It introduces RedwoodJS, a framework that simplifies frontend-backend integration and provides features like code generation, scaffolding, and authentication. The Talk demonstrates how to set up a Redwood project, generate layouts and models, and perform CRUD operations. Redwood automates many GraphQL parts and provides an easy way for developers to get started with GraphQL. It also highlights the benefits of Redwood and suggests checking out RedwoodJS.com for more information.

Workshops on related topic

Construir con SvelteKit y GraphQL
GraphQL Galaxy 2021GraphQL Galaxy 2021
140 min
Construir con SvelteKit y GraphQL
Top Content
Featured WorkshopFree
Scott Spence
Scott Spence
¿Alguna vez has pensado en construir algo que no requiera mucho código de plantilla con un tamaño de paquete pequeño? En esta masterclass, Scott Spence irá desde el hola mundo hasta cubrir el enrutamiento y el uso de endpoints en SvelteKit. Configurarás una API de GraphQL en el backend y luego usarás consultas de GraphQL con SvelteKit para mostrar los datos de la API de GraphQL. Construirás un proyecto rápido y seguro que utiliza las características de SvelteKit, y luego lo desplegarás como un sitio completamente estático. Este curso es para los curiosos de Svelte que no han tenido una experiencia extensa con SvelteKit y quieren una comprensión más profunda de cómo usarlo en aplicaciones prácticas.

Tabla de contenidos:
- Inicio e introducción a Svelte
- Inicializar el proyecto frontend
- Recorrido por el proyecto esqueleto de SvelteKit
- Configurar el proyecto backend
- Consultar datos con GraphQL
- Recuperación de datos en el frontend con GraphQL
- Estilización
- Directivas de Svelte
- Enrutamiento en SvelteKit
- Endpoints en SvelteKit
- Despliegue en Netlify
- Navegación
- Mutaciones en GraphCMS
- Envío de mutaciones GraphQL a través de SvelteKit
- Preguntas y respuestas
Desarrollando Blogs Dinámicos con SvelteKit & Storyblok: Una Masterclass Práctica
JSNation 2023JSNation 2023
174 min
Desarrollando Blogs Dinámicos con SvelteKit & Storyblok: Una Masterclass Práctica
Top Content
Featured WorkshopFree
Alba Silvente Fuentes
Roberto Butti
2 authors
Esta masterclass de SvelteKit explora la integración de servicios de terceros, como Storyblok, en un proyecto SvelteKit. Los participantes aprenderán cómo crear un proyecto SvelteKit, aprovechar los componentes de Svelte y conectarse a APIs externas. La masterclass cubre conceptos importantes incluyendo SSR, CSR, generación de sitios estáticos y despliegue de la aplicación usando adaptadores. Al final de la masterclass, los asistentes tendrán una sólida comprensión de la construcción de aplicaciones SvelteKit con integraciones de API y estarán preparados para el despliegue.
Construye Aplicaciones Modernas Utilizando GraphQL y Javascript
Node Congress 2024Node Congress 2024
152 min
Construye Aplicaciones Modernas Utilizando GraphQL y Javascript
Featured Workshop
Emanuel Scirlet
Miguel Henriques
2 authors
Ven y aprende cómo puedes potenciar tus aplicaciones modernas y seguras utilizando GraphQL y Javascript. En este masterclass construiremos una API de GraphQL y demostraremos los beneficios del lenguaje de consulta para APIs y los casos de uso para los que es adecuado. Se requiere conocimiento básico de Javascript.
Seguridad de tipo de extremo a extremo con React, GraphQL y Prisma
React Advanced 2022React Advanced 2022
95 min
Seguridad de tipo de extremo a extremo con React, GraphQL y Prisma
Featured WorkshopFree
Sabin Adams
Sabin Adams
En este masterclass, obtendrás una visión de primera mano de lo que es la seguridad de tipo de extremo a extremo y por qué es importante. Para lograr esto, construirás una API de GraphQL utilizando herramientas modernas y relevantes que serán consumidas por un cliente de React.
Prerrequisitos: - Node.js instalado en tu máquina (12.2.X / 14.X)- Se recomienda (pero no es obligatorio) utilizar VS Code para las tareas prácticas- Un IDE instalado (se recomienda VSCode)- (Bueno tener) *Un conocimiento básico de Node.js, React y TypeScript
GraphQL para Desarrolladores de React
GraphQL Galaxy 2022GraphQL Galaxy 2022
112 min
GraphQL para Desarrolladores de React
Featured Workshop
Roy Derks
Roy Derks
Hay muchas ventajas en utilizar GraphQL como fuente de datos para el desarrollo frontend, en comparación con las API REST. Nosotros, los desarrolladores, por ejemplo, necesitamos escribir mucho código imperativo para recuperar datos y mostrarlos en nuestras aplicaciones y manejar el estado. Con GraphQL, no solo puedes reducir la cantidad de código necesario para la obtención de datos y la gestión del estado, sino que también obtendrás una mayor flexibilidad, mejor rendimiento y, sobre todo, una mejor experiencia de desarrollo. En este masterclass aprenderás cómo GraphQL puede mejorar tu trabajo como desarrollador frontend y cómo manejar GraphQL en tu aplicación frontend de React.
Construye una aplicación WordPress sin cabeza con Next.js y WPGraphQL
React Summit 2022React Summit 2022
173 min
Construye una aplicación WordPress sin cabeza con Next.js y WPGraphQL
Top Content
WorkshopFree
Kellen Mace
Kellen Mace
En esta masterclass, aprenderás cómo construir una aplicación Next.js que utiliza Apollo Client para obtener datos de un backend de WordPress sin cabeza y usarlo para renderizar las páginas de tu aplicación. Aprenderás cuándo debes considerar una arquitectura de WordPress sin cabeza, cómo convertir un backend de WordPress en un servidor GraphQL, cómo componer consultas usando el IDE GraphiQL, cómo colocar fragmentos GraphQL con tus componentes, y más.