Masterclass

Empezando con WebSockets en HTML con Andros Fenollosa

Lo que puedes lograr con HTML yendo más allá de lo que habías imaginado.

Andros Fenollosa

Duración total: 01:19:29

Código descargable

Acceso 100% online

Descripción de la masterclass

¿De qué va?

Veremos como podemos conectar backend y frontend a través de WebSockets. Una alternativa diferente a la tradicional API REST que nos pone por delante del JavaScript una solución basada en HTML.

Durante la sesión veremos el código de una aplicación de red social que Andros nos preparó usando esta tecnología.

Además con todo este despliegue entenderemos las diferencias entre Web Socket, SSE y API Rest.

Tecnologías utilizadas

  • Web Sockets
  • HTML
  • JavaScript
  • Python
  • Django

Nivel de dificultad

Intermedio

Si quieres ver todos los enlaces y el vídeo tienes que suscribirte o entrar como usuario suscriptor.

Podrás ver a:

Imagen de Andros Fenollosa

Andros Fenollosa

Desarrollador Fullstack, Project Manager en Sapps estudio, CTO en CC Solutions, docente en Idecrea y escritor. Compagina su actividad profesional con la enseñanza de tecnologías web. Además, formó parte del Podcast “República Web”, es bloguero apasionado, enamorado de la programación funcional y donante de código en diversos proyectos Opensource.

Explora los capítulos

1. Qué son los WebSockets [10:00]

Qué son los WebSockets

[04:54]

Qué es Server-Side Events 🔥

[01:53]

Cómo funciona SSE

[01:53]

Pregunta: ¿Consume menos recursos que Web Sockets? 🔥

[01:20]

2. HTML sobre WebSockets (SPA sin JavaScript) [20:30]

HTML sobre WebSockets (SPA sin JavaScript)

[03:44]

El caso de AlpineJS

[01:36]

Pregunta: ¿Necesitas un servidor más potente que en una API? 🔥

[03:40]

Comentarios sobre seguridad

[02:17]

Ejemplo práctico: tiempo real y para todos los usuarios

[05:13]

Inspeccionando las conexiones en tiempo real 🔥

[04:00]

3. Código de la red social [22:30]

Código de la red social

[00:50]

Dependencias de Python y Django

[05:40]

Revisión de Docker Compose (Caddy, Redis)

[03:07]

Revisión del código HTML

[02:08]

Request y consumer en Django 🔥

[02:40]

Pregunta: ¿Qué pasa si el servidor se desconecta? 🔥

[02:35]

Envío del WebSocket

[01:40]

Revisión del código JavaScript

[03:50]

4. Usando Stimulus para conectar back y front [26:29]

Usando Stimulus para conectar back y front

[04:50]

Explicación del código con Stimulus

[05:00]

Ventaja de usar Stimulus 🔥

[01:20]

La red social usando Stimulus

[02:10]

Pregunta: ¿Puedes enviar datos a usuarios concretos?

[01:40]

40 🔥

[11:29]

Descubre todo lo que puedes conseguir sucribiéndote a Web Reactiva

Contenido nuevo todas las semanas

Una comunidad de developers colegas en telegram

Desafíos y retos de programación para que mejores tus habilidades

400 horas de contenido en audio y vídeo

Entrevistas y masterclass en directo con los/las mejores profesionales

Precio

19€Matrículaplus10€Al mes

  • Contenido disponible 24/7
  • Audios y videos
  • Retos y desafíos
  • Todo el código descargable
  • Comunidad de developers
  • Acceso premium completo