Angular — Avanzado

Dirigido a desarrolladoras y desarrolladores con experiencia sólida en Angular que necesitan llevar sus aplicaciones a producción en entornos de alta exigencia, este curso aborda los retos propios de sistemas a escala: desde la definición de una estrategia de modularización sostenible hasta la elección razonada de un mecanismo de gestión de estado. A lo largo de las ocho horas, la persona participante analizará el impacto de Zone.js en el rendimiento, aplicará técnicas avanzadas de optimización de renderizado con Signals y OnPush, reducirá el bundle inicial mediante lazy loading y tree-shaking efectivo, y evaluará la viabilidad de migrar una arquitectura monolítica hacia un monorepo con Nx. El resultado concreto es una hoja de ruta técnica documentada para escalar una aplicación Angular real, respaldada por métricas obtenidas con Angular DevTools y una estrategia de CI/CD con umbrales de calidad automatizados.

Al finalizar el curso, la persona participante será capaz de:

1. Conceptual — Distinguir los trade-offs arquitectónicos entre módulos feature y standalone components, y comparar los modelos de gestión de estado NgRx, Signals y Facade en función de la complejidad del dominio y el coste de mantenimiento.
2. Conceptual — Explicar el mecanismo de detección de cambios de Zone.js, sus implicaciones en el rendimiento y los fundamentos de la arquitectura Zoneless como alternativa.
3. Procedimental — Aplicar ChangeDetectionStrategy.OnPush, Signals y técnicas de memoización para optimizar el renderizado, midiendo la mejora con Angular DevTools, y reducir el bundle inicial configurando lazy loading por rutas y tree-shaking efectivo.
4. Procedimental — Diseñar y automatizar un pipeline de CI/CD para Angular que ejecute tests unitarios y E2E en paralelo, analice la cobertura y gestione despliegues condicionales según umbrales de calidad definidos.
5. Integrador — Auditar una aplicación Angular existente —evaluando su estrategia de testing, el impacto de Zone.js y su viabilidad para crecer hacia un monorepo con Nx— y producir un plan de mejora priorizado que integre decisiones de arquitectura, rendimiento y calidad.

Bloque 1 — Arquitectura a escala Se analiza la tensión entre módulos feature y standalone components como estrategias de modularización, examinando cómo cada enfoque afecta la mantenibilidad, el tiempo de compilación y la curva de incorporación de nuevas personas al equipo. A partir de ahí se aborda la selección de un modelo de gestión de estado: se estudian NgRx, Signals y el patrón Facade, contrastando su idoneidad según el tamaño del dominio y el volumen de interacciones asíncronas. El bloque cierra con una introducción a los monorepos con Nx, identificando los indicadores que señalan cuándo una arquitectura monolítica ha alcanzado su límite de escalabilidad y cuál es el orden de migración recomendado.

Bloque 2 — Rendimiento y detección de cambios Se disecciona el ciclo de detección de cambios de Zone.js, se cuantifica su coste en aplicaciones de alta frecuencia de actualización y se presenta la hoja de ruta para una migración parcial o total a arquitectura Zoneless. Sobre esta base se aplican ChangeDetectionStrategy.OnPush, Signals y estrategias de memoización, utilizando Angular DevTools para medir antes y después de cada intervención. El bloque incluye también la optimización del bundle: análisis de dependencias no utilizadas, configuración granular de lazy loading por rutas y configuración del tree-shaking para lograr reducciones medibles en el bundle inicial.

Bloque 3 — Calidad, testing y entrega continua Se parte de la auditoría de la estrategia de testing de una aplicación real: identificación de gaps en componentes con lógica de negocio, servicios y efectos NgRx, y elaboración de un plan de mejora priorizado. A continuación se diseña un pipeline de CI/CD que ejecuta tests unitarios y E2E en paralelo, recopila métricas de cobertura y condiciona el despliegue al cumplimiento de umbrales de calidad predefinidos. El bloque —y el curso— concluye integrando todos los elementos anteriores en una hoja de ruta técnica documentada aplicada sobre una aplicación Angular de referencia.

• Node.js ≥ 18 LTS y npm ≥ 9 instalados en la máquina local.
• Angular CLI ≥ 17 (npm install -g @angular/cli).
• Angular DevTools instalado como extensión en Chrome o Edge.
• Nx CLI instalado globalmente (npm install -g nx) para el bloque de monorepos.
• Acceso a una cuenta de GitHub o GitLab con permisos para crear repositorios y configurar pipelines de CI/CD (GitHub Actions o GitLab CI).
• IDE con soporte para TypeScript (se recomienda VS Code con las extensiones Angular Language Service y ESLint).
• Docker Desktop operativo (necesario para ejecutar el entorno de CI/CD en local durante las prácticas del Bloque 3).

• Manejo fluido del Router de Angular, incluyendo guards, resolvers y lazy loading básico (cubierto en ANG02).
• Experiencia práctica con RxJS: operadores de transformación, combinación y gestión de errores.
• Conocimiento de los módulos NgModules y del ciclo de vida de componentes y servicios.
• Familiaridad con testing unitario en Angular usando Jasmine/Jest y Angular Testing Library.
• Capacidad para leer y modificar configuraciones de angular.json y tsconfig.