Curso de Angular 20: desarrollo aplicaciones web escalables (Programa detallado)
Objetivo:
Desarrollar aplicaciones web utilizando Angular 20.
Dirigido a:
Desarrolladores web que:
- Quieren aprender Angular desde cero con su nueva arquitectura moderna (standalone components, signals, provideRouter, etc.).
- Desean actualizarse a Angular 20 si vienen de versiones anteriores del framework.
- Buscan una alternativa robusta a React o Vue para aplicaciones empresariales.
Estudiantes de programación o formación técnica que:
- Necesitan aprender un framework frontend orientado a producción y ampliamente usado en el sector corporativo.
Equipos de desarrollo o empresas que:
- Requieren formación actualizada en Angular para escalar sus proyectos internos.
- Buscan mantener la cohesión técnica en el stack frontend de su organización.
- Trabajan o planean trabajar con proyectos de larga duración y arquitectura sólida.
Requisitos:
- Conocimientos básicos de HTML, CSS y JavaScript moderno (ES6+)
- No se necesita experiencia previa con Angular u otros frameworks.
PROGRAMA DEL CURSO
1.- Introducción a Angular y preparación del entorno
Objetivo
Identificar los conceptos fundamentales de Angular y describir el proceso de preparación del entorno de desarrollo.
Contenido
- Introducción a Angular y preparación del entorno
- ¿Qué es Angular y qué resuelve?
- Angular: fundamentos clave
- Angular vs otros frameworks
- Preparar el entorno
- Crear el primer proyecto Angular
- Resumen
2.- Componentes en profundidad
Objetivo
Aplicar la creación y gestión de componentes en una aplicación Angular.
Contenido
- Componentes en profundidad
- Declaración de Componentes y Standalone Components
- Comunicación entre componentes con @Input y @Output
- Ciclo de vida del componente
- Estilos: encapsulados y globales
- Resumen
3.- Templates, directivas y pipes
Objetivo
Usar templates, directivas y pipes para estructurar y manipular la vista en Angular.
Contenido
- Templates, directivas y pipes
- Binding de datos en plantillas
- Directivas estructurales
- Directivas de atributo
- Pipes integrados
- Creación de pipes personalizados
- Resumen
4.- Enrutamiento con provideRouter
Objetivo
Configurar el enrutamiento en aplicaciones Angular utilizando provideRouter.
Contenido
- Enrutamiento con provideRouter
- Fundamentos del routing en Angular 20
- Configuración de rutas con provideRouter y Route
- Navegación entre vistas
- Parámetros de ruta y query params
- Lazy loading moderno
- Guards básicos
- Caso práctico: aplicación de un restaurante
- Resumen
5.- Servicios e inyección de dependencias
Objetivo
Implementar servicios y aplicar inyección de dependencias para gestionar la lógica de negocio.
Contenido
- Servicios e inyección de dependencias
- Introducción a los servicios
- Creación e inyección de servicios
- Ámbito y ciclo de vida de servicios
- Comunicación HTTP con HttpClient
- Manejo básico de errores en peticiones HTTP
- Interceptors HTTP para manejo global de peticiones y errores
- Lazy services y carga perezosa de servicios
- Resumen
6.- Formularios template-driven
Objetivo
Crear formularios template-driven para capturar y validar datos de usuario.
Contenido
- Formularios template-driven
- Estructura básica de formularios template-driven
- Binding y sincronización con ngModel
- Validaciones básicas en formularios template-driven
- Mostrar mensajes de error
- Formularios anidados simples
- Resumen
7.- Formularios reactivos
Objetivo
Construir formularios reactivos y gestionar su estado y validaciones.
Contenido
- Formularios reactivos
- Introducción a formularios reactivos
- Validaciones reactivas
- Manejo programático de errores
- Validadores personalizados
- Validación de formularios complejos
- Resumen
8.- Signals y estado reactivo
Objetivo
Utilizar signals para gestionar el estado reactivo en aplicaciones Angular.
Contenido
- Signals y estado reactivo
- Introducción a Signals
- API básica de Signals
- Estado local reactivo sin necesidad de Observables
- Uso de Signals en templates Angular
- Diferencias entre Signals y RxJS
- Integración y coexistencia entre Signals y RxJS
- Resumen
9.- Comunicación avanzada y manejo de estado
Objetivo
Implementar técnicas avanzadas de comunicación entre componentes y manejo de estado.
Contenido
- Comunicación avanzada y manejo de estado
- Comunicación entre componentes hermanos
- Comparativa: EventEmitter vs Subject
- Patrones de arquitectura recomendados para manejo de estado
- Uso básico de BehaviorSubject y Signals compartidos
- Introducción a estado compartido simple sin NgRx
- Conceptos de gestión de estado reactivo a mayor escala (sin librerías externas)
- Resumen
10.- Testing de componentes y servicios
Objetivo
Desarrollar pruebas para componentes y servicios en Angular para asegurar su correcto funcionamiento.
Contenido
- Testing de componentes y servicios
- Importancia de testear en Angular
- Configuración del entorno de testing
- Pruebas de componentes
- Pruebas de servicios
- Pruebas de formularios
- Introducción a pruebas end-to-end (E2E) con Cypress o Playwright
- Resumen
11.- Arquitectura escalable y buenas prácticas
Objetivo
Describir arquitecturas escalables y aplicar buenas prácticas en el desarrollo de aplicaciones Angular.
Contenido
- Arquitectura escalable y buenas prácticas
- Organización por features (Feature Folders)
- Reutilización de componentes y servicios
- Nomenclatura, rutas y estructura limpia
- Introducción a NgModules
- Migración y coexistencia entre NgModules y Standalone Components
- Monorepos y herramientas para proyectos grandes (Nx)
- Buenas prácticas de seguridad en Angular
- Resumen
12.- Despliegue y optimización para producción
Objetivo
Optimizar y desplegar aplicaciones Angular para producción.
Contenido
- Despliegue y optimización para producción
- Variables de entorno
- Comandos de build para producción
- Técnicas de lazy loading para mejorar performance
- Opciones populares para despliegue
- Análisis de bundles y optimización avanzada (tree shaking, preloading)
- Monitorización post-despliegue y feedback de usuarios
- Resumen