GraphQL vs REST: El futuro de la web

En esta oportunidad estaremos hablando de una popular tecnología creada por Facebook para el desarrollo de APIs modernas: GraphQL. Revisaremos las principales características, ventajas y desventajas de usar este enfoque orientado a grafos en comparación con la arquitectura más usada hoy en día para la implementación de APIs: REST.

Para evidenciar dichas características, estaremos desarrollando una aplicación demo donde se podrán comparar ambos enfoques de manera práctica.

Transcript

1. #QuitoLambda QuitoLambda @quitolambda
2. GraphQL vs REST: El futuro de la web.
3. Agenda • Arquitectura REST • Qué es GraphQL? • Principales Características • GraphQL vs REST • Batching • Alternativas de GraphQL • Demo
4. Arquitectura REST
5. “GraphQL is a query language for APIs and a runtime for fulfilling those queries with your existing data. GraphQL provides a complete and understandable description of the data in your API, gives clients the power to ask for exactly what they need and nothing more, makes it easier to evolve APIs over time, and enables powerful developer tools.” Qué es GraphQL? Citado de graphql.org
6. Hello World!
7. { me { firstname } } GraphQL Query Schema Definition Language (SDL) Resolvers export const schema = gql` type Query { me: User } type User { id: ID!, username: String!, firstname: String!, lastname: String!, name: String!, friends: [User!] } `; export const resolvers = { Query: { me: () => { return { firstname: 'Roberto', }; }, }, User: { username: user => user.lastname, }, },
8. Principales Características
15. Operaciones Query Mutation Subscription
18. Batching en GraphQL
19. Defer
20. Stream
21. Live
22. GraphQL vs REST
23. GraphQL vs REST Control de los datos en el servidor Control de los datos en el cliente GET /api/v1/user/1234 { "@id": "/user/1234", "username": "roberto.rielo.v", "email": "rrielo@stackbuilders.com", "firstname": "Roberto", "lastname": "Rielo", "lastLogin": "2019-07-31T00:00:00", "company": "Stack Builders", } { firstname lastname company } { "firstname": "Roberto", "lastname": "Rielo", "company": "Stack Builders" } GraphQL Query JSON Response GET /api/v1/user/1234?cols[]=username&cols[]=email { "username": "roberto.rielo.v", "email": "rrielo@stackbuilders.com", }
24. GraphQL vs REST Under-fetching No existe Under-fetching { "@id": "/user/1234", "username": "roberto.rielo.v", "email": "rrielo@stackbuilders.com", "bestFriend": { "@id": "/user/56" }, } { firstname lastname bestFriend { name } } { "firstname": "Roberto", "lastname": "Rielo", "bestFriend": { "name": "Carlos" } } GraphQL Query JSON Response GET /api/v1/user/1234 GET /api/v1/user/1234 GET /api/v1/user/56 { "@id": "/user/1234", "username": "roberto.rielo.v", "email": "rrielo@stackbuilders.com", "bestFriend": { "@id": "/user/56" "name": "Carlos Javier" "username": "carlos.javier" }, }
25. Empresas que usan GraphQL Facebook
26. Demo!
27. Alternativas
28. Alternativas
29. Questions?
30. ¡Presenta tus ideas en Quito Lambda! Si tienes algo interesante que presentar, ¡ven a presentar con nosotros! Programación Funcional, DevOps, Cloud Computing, IaaS, Desarrollo Web, React, WebGL, ReasonML y cualquier cosa interesante info@stackbuilders.com
31. Presenta tus ideas info@stackbuilders.com Trabaja con nosotros stackbuilders.com/join Stack Builders Ecuador @stackbuilders stackbuilders