Transformando GraphQL: Infraestructura como código para desarrolladores front-end

Rate this content
Bookmark

En esta charla mostraré cómo podemos utilizar una combinación de GraphQL SDL junto con un nuevo DSL (GraphQL Transform) creado por el equipo de Amplify para construir una aplicación en la nube de pila completa directamente desde su esquema de GraphQL. Usando este DSL de GraphQL, recorreremos cómo modelar una base de datos, reglas de autorización, relaciones y patrones de acceso personalizados. Veremos cómo prototipar rápidamente una aplicación de ejemplo y ver algunas demostraciones, incluida una aplicación de votación capaz de manejar más de 100,000 operaciones por segundo.

This talk has been presented at JSNation Live 2020, check out the latest edition of this JavaScript Conference.

FAQ

La transformación de GraphQL es un proceso que utiliza directivas específicas para generar automáticamente una infraestructura como código, operaciones CRUD y suscripciones para tipos base en una API de GraphQL. Esto facilita la creación y manejo de APIs robustas sin necesidad de codificar manualmente toda la estructura y lógica subyacente.

AWS Amplify es un conjunto de herramientas y SDK que ayuda a los desarrolladores a crear y desplegar aplicaciones móviles y web rápidamente. Ofrece servicios como hosting con CDN global, una CLI para manejar servicios en la nube, y clientes de biblioteca que interactúan con estos servicios, facilitando a los desarrolladores frontend construir aplicaciones de pila completa.

El modelado de datos en AWS Amplify se realiza definiendo esquemas de GraphQL que incluyen tipos, mutaciones, consultas y suscripciones. Estos esquemas se pueden decorar con directivas como @model, @auth, y @connection para generar automáticamente la infraestructura necesaria, como bases de datos y resolutores, optimizando el desarrollo y mantenimiento de la aplicación.

Una API de GraphQL es una interfaz que permite la consulta y manipulación de datos a través de un esquema que define tipos y operaciones. En AWS Amplify, se implementa definiendo un esquema de GraphQL y utilizando la CLI para generar y desplegar la infraestructura necesaria, lo que incluye la configuración de autorización, autenticación y otras reglas de negocio.

En AWS Amplify, se puede configurar la autenticación para una API de GraphQL utilizando Amazon Cognito User Pools para gestionar usuarios y sesiones, o una API key para un acceso público. Además, se pueden establecer reglas de acceso más granulares con la directiva @auth en el esquema de GraphQL.

La biblioteca de transformación de GraphQL en AWS Amplify permite a los desarrolladores simplificar y automatizar la creación de una API de GraphQL robusta. Facilita la generación de operaciones CRUD, suscripciones y resolutores, y maneja aspectos complejos como la autorización y relaciones entre datos, lo que reduce el tiempo de desarrollo y mejora la calidad del código.

Nader Dabit
Nader Dabit
27 min
18 Jun, 2021

Comments

Sign in or register to post your comment.
Video Summary and Transcription
Esta charla trata sobre la construcción de aplicaciones en la nube de pila completa como desarrollador front-end utilizando GraphQL y la biblioteca GraphQL Transform. Cubre las tres partes principales de AWS Amplify: hosting, CLI y bibliotecas de cliente. La biblioteca GraphQL Transform simplifica la construcción de una API de GraphQL al manejar la creación de esquemas, la interacción con la base de datos y el mapeo de resolutores. Demuestra cómo utilizar transformaciones de GraphQL para construir una API de GraphQL con características como reglas de autorización, relaciones y simulación local. También se discuten las consideraciones para el uso de servicios administrados y el futuro de la infraestructura como código con Amplify y otras herramientas.

1. Introducción a la Transformación de GraphQL

Short description:

Esta charla trata sobre cómo construir aplicaciones en la nube de pila completa como desarrollador front-end. Se divide en cuatro partes. Cubriremos el modelado de datos utilizando GraphQL y la biblioteca de transformación de GraphQL, haremos una demostración en vivo de prototipado rápido y mostraremos una aplicación real construida con transformaciones de GraphQL.

Bueno. Hola a todos. Bienvenidos a mi charla. Esto es la transformación de GraphQL, infraestructura de pila completa como código. Y esta charla trata sobre cómo construir aplicaciones en la nube de pila completa como desarrollador front-end. Se divide en cuatro partes. Vamos a hacer una introducción a algunos de los contenidos sobre los que voy a hablar. Vamos a recorrer cómo hacer el modelado de datos utilizando GraphQL y la biblioteca de transformación de GraphQL. Luego haremos una demostración en vivo de prototipado rápido. Y luego les mostraré un ejemplo en vivo de una de las aplicaciones que he construido utilizando estas transformaciones de GraphQL.

2. Introducción a AWS Amplify y Full Stack Cloud

Short description:

Esta parte presenta al ponente, Nader David, quien es un ingeniero de software y autor. Trabaja como defensor del desarrollador en el equipo de AWS Amplify, enfocado en construir herramientas y SDK de nube de pila completa. La charla cubrirá las tres partes principales de Amplify: hosting, CLI y bibliotecas de cliente. El flujo de trabajo de la CLI implica inicializar un proyecto, agregar o actualizar características y implementar actualizaciones. Amplify proporciona infraestructura en la nube e infraestructura local como código.

Entonces mi nombre es Nader David. Soy un ingeniero de software. También soy autor y he hecho muchas cosas de código abierto y otras cosas. Y ahora mismo trabajo como defensor del desarrollador en el equipo de AWS Amplify. El último libro que he publicado se llama Full Stack Serverless. Y está muy relacionado con algunas de las cosas de las que estamos hablando hoy. Está disponible en O'Reilly. Así que si estás interesado en algunas de las cosas de las que estoy hablando, definitivamente recomendaría echar un vistazo a ese libro.

El equipo en el que trabajo, mencioné antes, es el equipo de AWS Amplify. Estamos enfocados en construir herramientas y SDK de nube de pila completa. Y uno de nuestros principales enfoques es atraer a nuevos desarrolladores al ecosistema de la nube, desarrolladores front-end y también mejorar la experiencia de desarrollo de muchas de las cosas que AWS tradicionalmente había hecho de manera diferente. Algunas de las diferentes infraestructuras que a la gente le gustaría usar son las mismas cosas que están utilizando estas grandes empresas a gran escala. Netflix, Airbnb e incluso Amazon están utilizando muchos de los servicios en los que nuestro equipo está tratando de construir abstracciones más fáciles de usar. Y eso es lo que está en el núcleo de algunas de las cosas de las que voy a hablar con la biblioteca de transformación de GraphQL.

Cuando digo herramientas y SDK de nube de pila completa, ¿a qué me refiero exactamente? Bueno, me gustaría comenzar desglosando Amplify y hablando de qué es Amplify. Amplify está compuesto principalmente por tres partes. Tenemos el hosting que tiene un hosting de sitio estático con una CDN global, muy fácil de configurar y ejecutar, y despliegues basados en Git y CI/CD basados en proyectos de Git. También tenemos una CLI que te permite, desde tu aplicación front-end, crear, actualizar y modificar servicios en la nube utilizando un enfoque basado en categorías que veremos en un momento. Y luego, después de crear los servicios a través de la CLI, tenemos un cliente que es, en realidad tenemos diferentes clientes para iOS, Web, React Native, y también tenemos componentes específicos del framework dentro de estas bibliotecas de cliente que te permiten interactuar con esos servicios después de haberlos creado.

Entonces, ¿cómo es el flujo de trabajo de la CLI? Es algo así. Inicializas un nuevo proyecto ejecutando Amplify Init. Agregas una nueva característica o actualizas una característica ejecutando Amplify add o Amplify update. Y cuando estás listo para implementar cualquier actualización, simplemente ejecutas Amplify push. Y luego, después de eso, puedes hacer actualizaciones adicionales ejecutando Amplify update. Y luego, después de haber creado estos servicios, importas los componentes o las diferentes bibliotecas de AWS Amplify. Así que en este ejemplo, tenemos storage, y luego puedes hacer llamadas a tu servicio de almacenamiento o tu servicio de API o cualquier servicio con el que estés trabajando. Entonces, realmente de lo que estamos hablando aquí cuando hablamos de nube de pila completa es que estás utilizando esta CLI y obtienes dos tipos diferentes de, supongo, artefactos de eso. Obtienes la infraestructura en la nube y luego obtienes la infraestructura local como código. Y también obtienes otro código local para cosas como flujos de autenticación y diferentes componentes de interfaz de usuario que también incluimos en nuestras bibliotecas de cliente. Pero realmente la parte principal de la que estamos hablando hoy es la infraestructura en la nube y la parte de infraestructura como código.

QnA

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

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.
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.
AWS Lambda bajo el capó
Node Congress 2023Node Congress 2023
22 min
AWS Lambda bajo el capó
Top Content
In this Talk, key characteristics of AWS Lambda functions are covered, including service architecture, composition, and optimization of Node.js code. The two operational models of Lambda, asynchronous and synchronous invocation, are explained, highlighting the scalability and availability of the service. The features of Lambda functions, such as retries and event source mapping, are discussed, along with the micro VM lifecycle and the three stages of a Lambda function. Code optimization techniques, including reducing bundle size and using caching options, are explained, and tools like webpack and Lambda Power Tuning are recommended for optimization. Overall, Lambda is a powerful service for handling scalability and traffic spikes while enabling developers to focus on business logic.
Patrones de Arquitectura Remix
Remix Conf Europe 2022Remix Conf Europe 2022
23 min
Patrones de Arquitectura Remix
Top Content
This Talk introduces the Remix architecture patterns for web applications, with over 50% of participants using Remix professionally. The migration from single page applications to Remix involves step-by-step refactoring and offers flexibility in deployment options. Scalability can be achieved by distributing the database layer and implementing application caching. The backend for frontend pattern simplifies data fetching, and Remix provides real-time capabilities for collaborative features through WebSocket servers and Server-SendEvents.
Optimización del rendimiento de AWS Lambda
Node Congress 2024Node Congress 2024
25 min
Optimización del rendimiento de AWS Lambda
This Talk covers various optimization techniques for Lambda functions, including parameter fetching, code minification and bundling, observability with Power Tools and X-Ray, baseline testing with load testing tools, caching with Elastic Cache and Redis, and optimizing code size and memory usage. The importance of library choices, power tuning for cost and performance, leveraging subprocesses and sandboxes, and adjusting concurrency limits are also discussed. Overall, these techniques can significantly improve Lambda function performance.
Desmitificar la DX para funciones Lambda
DevOps.js Conf 2024DevOps.js Conf 2024
30 min
Desmitificar la DX para funciones Lambda
Welcome to this session on Lambda Developer Experience. Learn about using AWS Cloud Development Kit (CDK) to write code in your favorite language and automatically generate CloudFormation templates. Test locally with the SAM CLI and deploy with CDK. Accelerate testing and updates with CDK flags. Use the AWS Toolkit to invoke Lambda functions, analyze logs, and generate code with Application Composer.

Workshops on related topic

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 y Despliega un Backend con Fastify y Platformatic
JSNation 2023JSNation 2023
104 min
Construye y Despliega un Backend con Fastify y Platformatic
WorkshopFree
Matteo Collina
Matteo Collina
Platformatic te permite desarrollar rápidamente APIs GraphQL y REST con un esfuerzo mínimo. La mejor parte es que también te permite aprovechar todo el potencial de Node.js y Fastify cuando lo necesites. Puedes personalizar completamente una aplicación de Platformatic escribiendo tus propias características y complementos adicionales. En el masterclass, cubriremos tanto nuestros módulos de código abierto como nuestra oferta en la nube:- Platformatic OSS (open-source software) — Herramientas y bibliotecas para construir rápidamente aplicaciones robustas con Node.js (https://oss.platformatic.dev/).- Platformatic Cloud (actualmente en beta) — Nuestra plataforma de alojamiento que incluye características como aplicaciones de vista previa, métricas integradas e integración con tu flujo de Git (https://platformatic.dev/).
En este masterclass aprenderás cómo desarrollar APIs con Fastify y desplegarlas en la nube de Platformatic.
Despliegue de aplicaciones React Native en la nube
React Summit 2023React Summit 2023
88 min
Despliegue de aplicaciones React Native en la nube
WorkshopFree
Cecelia Martinez
Cecelia Martinez
Desplegar aplicaciones React Native manualmente en una máquina local puede ser complejo. Las diferencias entre Android e iOS requieren que los desarrolladores utilicen herramientas y procesos específicos para cada plataforma, incluidos los requisitos de hardware para iOS. Los despliegues manuales también dificultan la gestión de las credenciales de firma, las configuraciones de entorno, el seguimiento de las versiones y la colaboración en equipo.
Appflow es la plataforma de DevOps móvil en la nube creada por Ionic. Utilizar un servicio como Appflow para construir aplicaciones React Native no solo proporciona acceso a potentes recursos informáticos, sino que también simplifica el proceso de despliegue al proporcionar un entorno centralizado para gestionar y distribuir tu aplicación en múltiples plataformas. Esto puede ahorrar tiempo y recursos, permitir la colaboración, así como mejorar la confiabilidad y escalabilidad general de una aplicación.
En este masterclass, desplegarás una aplicación React Native para su entrega en dispositivos de prueba Android e iOS utilizando Appflow. También aprenderás los pasos para publicar en Google Play y Apple App Stores. No se requiere experiencia previa en el despliegue de aplicaciones nativas, y obtendrás una comprensión más profunda del proceso de despliegue móvil y las mejores prácticas para utilizar una plataforma de DevOps móvil en la nube para enviar rápidamente a gran escala.
Masterclass de GraphQL en la Nube con Neo4j Aura, Next.js y Vercel
GraphQL Galaxy 2021GraphQL Galaxy 2021
161 min
Masterclass de GraphQL en la Nube con Neo4j Aura, Next.js y Vercel
WorkshopFree
William Lyon
William Lyon
En este masterclass construiremos y desplegaremos una aplicación de GraphQL de pila completa utilizando Next.js, Neo4j y Vercel. Utilizando un grafo de conocimiento de artículos de noticias, primero construiremos una API de GraphQL utilizando las rutas de API de Next.js y la Biblioteca de GraphQL de Neo4j. A continuación, nos enfocaremos en el front-end, explorando cómo utilizar GraphQL para la obtención de datos con una aplicación de Next.js. Por último, exploraremos cómo agregar personalización y recomendación de contenido en nuestra API de GraphQL para servir artículos relevantes a nuestros usuarios, luego desplegaremos nuestra aplicación en la nube utilizando Vercel y Neo4j Aura.

Tabla de contenidos:
- Visión general de Next.js y cómo empezar con Next.js
- Rutas de API con Next.js y construcción de una API de GraphQL
- Utilizando la Biblioteca de GraphQL de Neo4j
- Trabajando con Apollo Client y obtención de datos de GraphQL en Next.js
- Despliegue con Vercel y Neo4j Aura
El Viaje Desde el Desarrollo Frontend con React al Desarrollo Fullstack con Next.js
React Advanced 2024React Advanced 2024
143 min
El Viaje Desde el Desarrollo Frontend con React al Desarrollo Fullstack con Next.js
Workshop
Eric Burel
Eric Burel
Únete a nosotros en el viaje desde el desarrollo frontend con React al desarrollo fullstack con Next.js. Durante esta masterclass, seguiremos el tutorial oficial de Next.js Learn con Eric Burel, entrenador profesional y autor de NextPatterns.dev. Juntos, configuraremos un sitio web con Next.js y exploraremos sus características del lado del servidor para construir aplicaciones de alto rendimiento.
- Introducción: descubriendo Next.js y su filosofía centrada en el servidor- Creación de un sitio web multipágina perfectamente optimizado- Entendiendo las capacidades de renderizado del lado del servidor de Next.js- Conclusión: cómo Next.js te empodera como desarrollador de React
Construyendo aplicaciones GraphQL de pila completa con Hasura y Vue 3
Vue.js London Live 2021Vue.js London Live 2021
115 min
Construyendo aplicaciones GraphQL de pila completa con Hasura y Vue 3
WorkshopFree
Gavin Ray
Gavin Ray
El ecosistema frontend avanza a un ritmo frenético. Este masterclass tiene como objetivo equipar a los participantes con una comprensión del estado del ecosistema Vue 3 + GraphQL, explorando ese ecosistema - prácticamente y a través del desarrollo de aplicaciones de pila completa.

Tabla de contenidos
- Los participantes utilizarán Hasura para construir una API GraphQL en tiempo real respaldada por Postgres. Juntos recorreremos su consumo desde un frontend y haremos que el frontend sea reactivo, suscrito a los cambios de datos.
- Además, analizaremos las herramientas comúnmente utilizadas en el stack Vue GraphQL (como Apollo Client y Urql), discutiremos algunas alternativas menos conocidas y abordaremos los problemas frecuentemente encontrados al comenzar.
- Se describirán varios patrones para gestionar datos con estado y sus compensaciones durante el masterclass, y se mostrará una implementación básica para cada patrón discutido.
Nivel del masterclass

NOTA: No se requiere experiencia previa con GraphQL, pero puede ser útil para ayudar a la comprensión. Se cubrirán los fundamentos.