Summary
Full Transcript
Estos vídeos no están hechos con propósitos de enseñar, solo los subo para mantener un recuerdo de la Universidad, y para eventos futuros (errores, ¿Cómo diseñé esto?, ¿Qué error cometí?), lo digo porque no me fijo en la musica de fondo ni esos detalles mínimos ... Estas es la última clase del Curso "Desarrollo de Frontend", se realizó la sustentación del segundo proyecto y se vió el concepto de "Web Socket.io" en Angular ¡Bienvenidos a la decimonovena y última sesión técnica de nuestro curso de *Desarrollo Frontend*! En esta clase, cerramos con broche de oro integrando *WebSockets* en Angular para habilitar la comunicación bidireccional en tiempo real. Aprenderás a configurar un servicio de sockets que se conecta a un servidor en Python, utilizando el patrón de diseño *Observer* (mediante Subjects y Observables) para gestionar el flujo de datos. Implementamos una campanita de notificaciones que reacciona instantáneamente a eventos externos sin necesidad de recargar la página. Además, analizamos sistemas como los chats de WhatsApp o el rastreo de Uber y exploramos vacantes reales en multinacionales como IBM para demostrar el impacto de estas tecnologías en el mercado actual. 🚀 *LO QUE APRENDERÁS EN ESTA SESIÓN:* • Configuración de Socket.io-client: Instalación e integración del cliente en Angular. • Servicios de Sockets: Creación de un WebSocketService centralizado. • Tópicos y Suscripciones: Cómo suscribirse a canales específicos para recibir datos. • Patrones de Diseño: Aplicación práctica del patrón Observer para desacoplar lógica. • Lógica de Negocio en Tiempo Real: Flujo técnico para la creación de chats y alertas. • Mercado Laboral: Análisis de perfiles requeridos y consejos para entrevistas. 📌 *CAPÍTULOS DEL VIDEO:* 00:00 Introducción: Simulación de notificaciones en tiempo real 02:41 Conceptos clave: Grupos y Tópicos para la transmisión de información 04:11 Arquitectura de Sockets: El concepto de túnel y casos de uso 08:26 Generación del WebSocketService: Comandos y estructura base 13:01 Inyección de dependencias en el NavbarComponent para escucha permanente 16:16 Métodos set y listen: Suscribiéndose al tópico de notificaciones 19:06 Patrón Observer: Uso de callbacks y proveedores de información 27:01 Cómo construir un chat: Entidad reflexiva y lógica intermedia 31:01 Flujo técnico de un chat: Petición Post, base de datos y activación de Socket 41:46 Depuración de errores comunes y eventos duplicados 43:21 Reflexión final: El crecimiento de los estudiantes en el curso 47:31 Revisión de ofertas laborales: Análisis de vacantes en IBM 56:16 Espacio de dudas y orientaciones sobre la sustentación final 1:10:01 Solución de errores técnicos en vivo: Python y entornos virtuales 1:21:01 Cierre de la sesión y revisión final de códigos de equipo 🔗 *GUÍA DE LA PLAYLIST: DESARROLLO FRONTEND* • Video Anterior: https://www.youtube.com/watch?v=Y5_6UDclUSg • Video Siguiente: ¡Ciclo Completado! Revisa la playlist para repasar todo el curso. 📺 *VIDEOS RECOMENDADOS DE INGE. SRM* • FRONTEND CLASE 14 (SOCKETS EN REACT): https://www.youtube.com/watch?v=c5VmWpm5kJY • FRONTEND CLASE 6 (API/Fetch): https://www.youtube.com/watch?v=TSGmxQufmyY #Angular #WebSockets #SocketIO #RealTime #Frontend #IngeSRM #DesarrolloWeb #WebDevelopment #TypeScript #Coding #FullStack #IBM #SocketProgramming TAGS IGNORAR -------------------------------- mrbeast, viral, épico, imposible, sorprendente, reto extremo, hackeo épico, tecnología, programando en vivo, angular, frontend, backend, interceptores, autenticación, token secreto, ruta protegida, guardianes, seguridad extrema, control total, dominando angular, nivel dios, desafío de código, reto de programación, 24 horas programando, no creerás esto, rompimos angular, código imposible, hackeamos el sistema, protegimos todo, seguridad máxima, angular como nunca lo viste, misión secreta, auth angular, login impenetrable, reto de código extremo, lo hicimos posible, fullstack challenge, dev extremo, prueba definitiva, web segura, programador extremo, código legendario, lo más seguro, tecnología al límite, angular nivel pro, login indestructible, interceptores locos, guardianes del código, código viral, programador en acción, dominando el código, tutorial imposible, seguridad al máximo, token ultra seguro, rompimos internet, fullstack ninja, auth nivel hacker, el mejor sistema auth, el reto más difícil, programación viral, auth brutal, dev épico, lo más difícil de angular, angular explicado fácil, seguridad como MrBeast, reto tech, tech viral, programador vs hacker, seguridad sin límites, angular extremo, modo hacker, hacker friendly, codificando como bestia, lo más loco en angular, sistema a prueba de todo, auth 100% seguro, nunca visto en angular, angular destruido, angular full, desafío fullstack, auth a otro nivel, backend inquebrantable, web a prueba de hackers, codificando con estilo, lo más pro en auth, imposible de hackear, código que asombra, tech challenge, pro challenge, hackeamos
Continue this lesson in the app
Install CourseHive on Android or iOS to keep learning while you move.
