Introducción a GraphQL | BeerJS Junio

Slides de charla sobre una breve introducción a GraphQL y algunas mejores prácticas, expuesta en la edición de Junio 2017 de BeerJS (www.beerjs.cl) por Dilip Ramírez.

Transcript

1. Introduccion a GraphQL Dilip Ramírez Founder & Developer Endlessteller.com BeerJS J U L I O 2 0 1 7 endlessteller JS
2. Dilip Ramírez @dilip_ramirez hola@dilip.io endlessteller
3. Antes de GraphQL
4. RESTful APIs
5. http://chelitas.com/api/v1/cervezas/todas/ http://chelitas.com/api/v1/cervezas/1/ http://chelitas.com/api/v1/cervezas/marcas http://chelitas.com/api/v1/cervezas/nacionalidades http://chelitas.com/api/v1/cervezas/grados_alcohol http://chelitas.com/api/v1/cervezas/tipos
6. Versioning Custom Endpoints (múltiples para cada plataforma) Hand-coding parsing code Include v/s Endpoint Sin soporte para nesting Overfetching / Underfetching /cervezas?include=empresa,cerveza.nombre,cerveza.gradoalcohol, ...
7. Caching Tecnología más madura Testeada en diversas industrias a lo largo de su existencia
8. Enter GraphQL
9. GraphQL Server User Interface Microservices Client DB REST API Weather API Store Query Manager Mutations
10. Pensando en Graphs recursos features
13. type Equipo { name: String! description: String players: [Jugador] } type Jugador { id: Int! name: String! position: Int! bio: String! equipo: Equipo! goals: Int! } type Query { plantelEquipo: [Jugador] jugador(id: Int!): Jugador } type Mutation{ agregarGolAJugador( id: Int! ): Jugador } Define el Schema
14. const resolverMap = { Query: { plantelEquipo(obj, args, context, info) { return Equipo.findOne().then().players; }, jugador(obj, { id }, context, info) { return Jugador.findByID(id); }, }, Jugador: { equipo(jugador) { return Equipo.findByPlayerID(jugador.id); }, Mutation: { agregarGolAJugador(obj, { id }, context, info) { return Jugador.update({ id: id }, { $set: { goals: goals++ } }); } } }; Y los Resolvers
15. { randomJugador { name } } { “randomJugador”: { “name”: “Claudio Bravo” } } Luego pide sólo lo que necesitas
16. { jugador(id:12398) { name } } { “jugador”: [ { “name” :“Marcelo Diaz” } ] } Programáticamente
17. Modifica tus recursos mutation{ agregarGolAJugador(id:5523) { name, goals } } { “agregarGolAJugador”: { “name” :“Alexis Sanchez”, “goals”: 38 } }
18. Latency efficient (pides lo que necesitas) Datastore agnostic Multi-client architecture JS, C#, Python, Scala, Ruby, PHP y otros
19. Autorización y Autenticación Tomar en cuenta al migrar a GraphQL Queries malignas (DDoS, etc.) Caching Casos de uso
20. No es una bala de plata (o un comodín) GraphQL
21. REST GraphQL
22. (algunas) Mejores Prácticas
23. Planifica el Schema con anticipación (a.k.a ocupa el mayor tiempo posible diseñando el schema de tu producto antes de empezar a hacer cualquier otra cosa)
24. Caching Facebook Dataloader https://github.com/facebook/dataloader
25. Static Queries Evita generar queries dinámicamente en runtime https://github.com/apollographql/persistgraphql
26. Autenticación Edge-based? Node-based? Si ya estás usando un método específico en producción quédate con ese por el momento No es necesario reinventar la rueda, por ahora.
27. Recursos Persisted GraphQL Queries with Apollo Client Apollo Developers Apollo Dev Blog How Facebook Organizes their GraphQL code Apollo GraphQL Github GraphQL Awesome https://dev-blog.apollodata.com/persisted-graphql-queries-with- apollo-client-119fd7e6bba5 http://dev.apollodata.com https://dev-blog.apollodata.com/ https://dev-blog.apollodata.com/graphql-at-facebook-by-dan- schafer-38d65ef075af https://github.com/apollographql https://github.com/chentsulin/awesome-graphql
28. ¡Gracias! @dilip_ramirez Dukuo en DevsChile hola@dilip.io BeerJS J U L I O 2 0 1 7 endlessteller