Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Cómo fui de MySQL DB a GraphQL API en 7 días

49345ea4af9a9432c1f4bf2cde34c736?s=47 Alco
July 20, 2021

Cómo fui de MySQL DB a GraphQL API en 7 días

En esta charla, Alco te cuenta sobre su experiencia de 7 días con GraphQL.

Aprenderás sobre las diferencias entre GraphQL y REST, sus beneficios, y cómo crear tu propia API GraphQL, conectada a tu base de datos MySQL, escrito en PHP vainilla, para que lo puedas correr localmente o en cualquier provedor económico.

49345ea4af9a9432c1f4bf2cde34c736?s=128

Alco

July 20, 2021
Tweet

Transcript

  1. Cómo fui de MySQL DB a GraphQL API en 7

    días Alco Co-founder/CTO - Musicasa alco@ricardoalcocer.com · https://alco.rocks · https://musicasaa.com
  2. - Original de Caguas, Puerto Rico 󰐦 - Creando soluciones

    de tecnología desde el 1996 - 4x Founder - 8 años como director de Developer Relations para - Appcelerator - Pioneros en la categoría de desarrollo de aplicaciones móviles cross-platform - Contentful - Líderes en la categoría de “Enterprise Headless CMS” - Author de 5 libros - Cofundador y CTO de Musicasa (https://musicasaa.com) Hola, soy Alco
  3. Antes de comenzar - Estos slides los encuentras en https://speakerdeck.com/ricardoalcocer

    - El repositorio de código lo encuentras en https://github.com/ricardoalcocer/php_graphql/ - El repositorio está dividido en 6 branches - Utilizaré Altair como GraphQL Client - https://chrome.google.com/webstore/detail/altair- graphql-client/flnheeellpciglgpaodhkhmapeljopja ?hl=en
  4. ¿Por qué considerar GraphQL?

  5. RESTful siempre es nuestra primera opción - Maduro - Es

    basado en las funcionalidades del protocolo HTTP - Stateless (tal como el protocolo mismo) - Utiliza los métodos que son parte de la especificación de HTTP - Diseñado para resolver el problema de proveer acceso a recursos (métodos/base de datos) a personas externas a organizaciones - Remplazó a S.O.A.P. y otras tecnologías que no estaban optimizadas para uso en Internet
  6. Facebook siguió la tendencia... https://techcrunch.com/2012/09/11/mark-zuckerberg-our-biggest-mistake-with-mobile-was-betting-too-much-on-html5

  7. Notaron que las herramientas existentes no resolverían su problema https://www.youtube.com/watch?v=783ccP__No8

  8. La solución fue crear un Query Language para APIs -

    No es un producto, no es una tecnología: Es una Especificación - Cuenta con librerías para múltiples lenguajes - Mientras REST fue diseñado para resolver un problema del servidor de bases de datos, GraphQL se diseñó para resolver el problemas del Front-End Engineer - Un solo “HTTP request” puede regresar data a múltiples niveles - Estarás aprendiendo 2 “lenguajes” - El utilizado por el back-end engineer para exponer los métodos GraphQL - El utilizado por el front-end engineer para consultar la data
  9. Facebook se detuvo en seco para repensar su estrategia Miremos

    el problema más de cerca
  10. None
  11. None
  12. None
  13. None
  14. None
  15. None
  16. None
  17. Ahora vamos al código

  18. Ahora vamos paso a paso a implementar un API GraphQL

    sobre esta data
  19. Paso #1 Conectar el ORM a la base de datos

  20. Instalar configurar Elloquent ORM - Utilizaremos PHP “vainilla” - Integraremos

    una versión “light” de IlluminateDB, la base de datos de Laravel - Más en https://github.com/illuminate/database - También crear “data models” para decirle al ORM como acceder las tablas de las BD
  21. Configurar Elloquent ORM index.php ./models/Artist.php

  22. Paso #2 Crear endpoint para obtener récord por Id

  23. Configurando GraphQL ./graphql/main.php ./graphql/query.php ./graphql/objects.php

  24. Configurando GraphQL ./graphql/main.php ./graphql/query.php ./graphql/objects.php

  25. Configurando GraphQL ./graphql/main.php ./graphql/query.php ./graphql/objects.php

  26. Paso #3 Crear endpoint para obtener todos los récords con

    LIMIT y OFFSET
  27. Nuevo endpoint para obtener todos los récords

  28. Paso #4 Crear mutaciones de datos

  29. Add, Edit, Delete - Las mutaciones utilizan el mismo patrón

    que vimos anteriormente
  30. Add, Edit, Delete - Las mutaciones utilizan el mismo patrón

    que vimos anteriormente
  31. Paso #5 Implementar relaciones entre data

  32. Puedes agregar relaciones - Puedes agregar ramas “custom” a tus

    objetos - Esto permite hacer “nesting” de múltiples llamadas, las cuales serán resueltas por GraphQL
  33. Puedes agregar relaciones

  34. Paso #6 Completar la implementación de todas la relaciones

  35. Veamos el proyecto completado

  36. Gracias por tu atención Si encontraste valor en este contenido,

    considera 1. Únete a mi lista VIP https://alco.rocks 2. Invítame a un café https://buymeacoffee.com/alco 3. Todos mis contactos en https://bio.link/alco