>=4 (2017) • Librería de Node.js • Webpack es la herramienta más utilizada • Webpack es súper potente pero complejo de configurar • Disponible también un bundle para la integración en Symfony Npm 2010 Webpack 2012 Gulp 2013 Babel 2014
• Muy reciente (Dic. 2020) • Puente entre el backend y el frontend • Permitir el desarrollo de una aplicación completa desde el propio Framework sin necesidad de tener sistemas desacoplados
APPLICATIONS • Symfony, Ruby on Rails, Laravel • El HTML se construye en el servidor • Se añade JS por encima de éste • Basado en los actuales standards de los navegadores • React, Vue, Angular • El HTML lo genera Javascript • El servidor devuelve JSON • Lógica avanzada en el lado del cliente • Lógica repetida entre front y back • Reimplementa algunos conceptos como history, sesiones, sincronización ...
código JS dentro del proyecto REUTILIZAR Basarse en código ya desarrollado SIMPLICIDAD Evitar la complejidad tanto como sea posible UX Implementar buenas Experiencias de Usuario
nuestro código JS • Flex y Webpack Encore ◦ Distribuir código JS reusable dentro de los bundles • Swup / Turbo(links) ◦ Nueva manera de construir buenas UX basadas en standards
de todo tu frontend • Ni siquiera tiene el objetivo de renderizar HTML • Conecta nodos del DOM con comportamientos en Javascript • Pocos conceptos: controller, actions, targets, values, ...
en peticiones AJAX 01. TURBO FRAMES Separa nuestras páginas en secciones pequeñas que pueden ser cargadas y navegables de manera independiente 02. TURBO STREAMS Permite actualizar elementos que se encuentran en la página desde el Backend (Websockets, Server Side Events) 03. TURBO NATIVE Integración con Android e iOS 04.