Tweet
Tweet

Slide 1

Slide 1 text

Cómo elegir la mejor "J" para tu JAM Stack Y no morir en el intento.... Drupal Camp 2020 Alfredo Bonilla - @brolag

Slide 2

Slide 2 text

¡Hola! Alfredo Bonilla @brolag Web Practice Lead en Gorilla Logic Co-Organizador GDG Pura Vida Co-Organizador Angular Costa Rica alfredobonilla.dev

Slide 3

Slide 3 text

¿Qué es JAM stack? Cómo elegir la mejor "J" para tu JAM Stack - @brolag JavaScript - APIs - Markup

Slide 4

Slide 4 text

Elijamos nuestras herramientas Cómo elegir la mejor "J" para tu JAM Stack - @brolag

Slide 5

Slide 5 text

SSR vs SSG

Slide 6

Slide 6 text

Imagen por Mike Nikles Fuente: https://dev.to/mikenikles/server-side-rendering-ssr-vs-static-site-generator-ssg-a-diagram-2g23

Slide 7

Slide 7 text

Imagen por Mike Nikles Fuente: https://dev.to/mikenikles/server-side-rendering-ssr-vs-static-site-generator-ssg-a-diagram-2g23

Slide 8

Slide 8 text

Frameworks

Slide 9

Slide 9 text

¿Cuál es el mejor framework? Cómo elegir la mejor J para tu JAM Stack - @brolag

Slide 10

Slide 10 text

Cómo elegir la mejor J para tu JAM Stack - @brolag Depende...

Slide 11

Slide 11 text

Debemos tomar en cuenta Cómo elegir la mejor J para tu JAM Stack - @brolag Naturaleza del proyecto Arquitectura Equipo de trabajo Madurez del framework Documentación Herramientas Popularidad

Slide 12

Slide 12 text

Ecosistema de Angular Cómo elegir la mejor J para tu JAM Stack - @brolag

Slide 13

Slide 13 text

Ecosistema de Vue Cómo elegir la mejor J para tu JAM Stack - @brolag

Slide 14

Slide 14 text

Ecosistema de React Cómo elegir la mejor J para tu JAM Stack - @brolag

Slide 15

Slide 15 text

GatsbyJS Cómo elegir la mejor J para tu JAM Stack - @brolag Framework basado en React para crear sitios estáticos y aplicaciones El rendimiento es altísimo Utiliza React y GraphQL Implementa una arquitectura basada en plugins

Slide 16

Slide 16 text

NextJS Cómo elegir la mejor J para tu JAM Stack - @brolag Constituye una base sólida para crear aplicaciones utilizando React SSR, SSG e implementaciones híbridas Soporte para TypeScript, Internacionalización, optimización de imágenes Su arquitectura pretende evitar la configuración

Slide 17

Slide 17 text

Comparativa NextJS vs GatsbyJS

Slide 18

Slide 18 text

Documentación Cómo elegir la mejor J para tu JAM Stack - @brolag https://nextjs.org/ https://www.gatsbyjs.com/

Slide 19

Slide 19 text

Ejemplo de blog Cómo elegir la mejor J para tu JAM Stack - @brolag https://github.com/gatsbyjs/gatsby-starter-blog https://github.com/vercel/next.js/tree/master/examples/blog- starter

Slide 20

Slide 20 text

Casos de uso Cómo elegir la mejor J para tu JAM Stack - @brolag Sitio de marketing simple Portal con muchas páginas de contenido y diferentes roles de usuario E-Commerce Renderizado en el cliente Aplicaciones Híbridas (SSR + SSG)

Slide 21

Slide 21 text

Conclusiones

Slide 22

Slide 22 text

Preguntas y respuestas Muchas gracias Drupal Camp 2020 Alfredo Bonilla - @brolag