Contacta con nosotros

Temario del curso

Introducción

  • ¿Qué es Angular?
  • Angular frente a React frente a Vue
  • Vista general de las características y arquitectura de Angular 17
  • Configuración del entorno de desarrollo

Primeros pasos

  • Creación de un nuevo proyecto en Angular 17 utilizando Angular CLI
  • Exploración de la estructura de archivos y carpetas del proyecto
  • Ejecución y servicio de la aplicación
  • Visualización de datos mediante interpolación y expresiones

Componentes

  • Comprensión del papel de los componentes en Angular 17
  • Creación y uso de componentes
  • Pasaje de datos entre componentes utilizando inputs (entradas) y outputs (salidas)
  • Uso de los ganchos del ciclo de vida de los componentes

Directivas

  • Comprensión de la diferencia entre directivas estructurales y de atributo.
  • Creación y uso de directivas integradas como ngIf, ngFor, ngSwitch, etc.
  • Creación y uso de directivas personalizadas.

Pipes (Tuberías)

  • Comprensión del propósito de los pipes en Angular 17.
  • Creación y uso de pipes integrados como date, currency, json, etc.
  • Creación y uso de pipes personalizados.

Servicios

  • Comprensión del papel de los servicios en Angular 17.
  • Creación y uso de servicios.
  • Inyección de dependencias mediante proveedores (providers).

Módulos

  • Comprensión del papel de los módulos en Angular 17.
  • Creación y uso de módulos.
  • Importación y exportación de módulos.

Enlace de datos

  • Comprensión de la diferencia entre enlace de datos de un solo sentido y de doble sentido.
  • Creación y uso de enlace de propiedades, enlace de eventos y sintaxis 'banana-in-a-box'.
  • Uso de variables de referencia de plantilla.

Enrutamiento

  • Comprensión del papel del enrutamiento en Angular 17.
  • Creación y configuración de rutas.
  • Navegación entre rutas utilizando routerLink y router.navigate().
  • Uso de parámetros de ruta, parámetros de consulta y fragmentos.

Formularios

  • Comprensión de la diferencia entre formularios basados en plantillas y reactivos.
  • Creación y validación de formularios utilizando controles de formulario, grupos de formularios, matrices de formularios, etc.
  • Uso de validadores integrados como required, minLength, maxLength, etc.
  • Creación y uso de validadores personalizados.

Cliente HTTP

  • Comprensión del papel del cliente HTTP en Angular 17.
  • Creación y uso de solicitudes HTTP para comunicarse con servicios backend.
  • Uso de observables para manejar flujos de datos asíncronos.
  • Uso de interceptores para modificar o gestionar solicitudes o respuestas HTTP.

Nuevo flujo de control declarativo

  • Explicación de la nueva sintaxis de bloques de control de plantillas y cómo simplifica tareas comunes como renderizado condicional, bucles y manejo de colecciones vacías.
  • Ejemplos del uso de los nuevos bloques, como @if, @else, @switch, @case, @default, @for y @empty.
  • Comparación de la nueva sintaxis con la anterior, como *ngIf, *ngSwitch y *ngFor.
  • Mención de cómo los nuevos bloques de control admiten aplicaciones sin zonas (zoneless) con señales (signals).

Bloques de carga diferida

  • Explicación del concepto de carga diferida y cómo puede mejorar el rendimiento y la experiencia del usuario en las aplicaciones web.
  • Introducción al nuevo bloque de control @defer que permite la carga perezosa (lazy-loading) del contenido del bloque y sus dependencias.
  • Ejemplos del uso del bloque @defer para diferentes escenarios, como cargar componentes, directivas, pipes, animaciones y estilos.
  • Mención de cómo el bloque @defer funciona con la nueva API de transiciones de vista.

API de transiciones de vista

  • Explicación del propósito y beneficios de la API de transiciones de vista, que permite a los desarrolladores personalizar las animaciones y transiciones entre vistas.
  • Introducción a la nueva directiva withViewTransitions que habilita el uso de la API de transiciones de vista.
  • Ejemplos del uso de la directiva withViewTransitions con diferentes tipos de transición, como desvanecimiento (fade), deslizamiento (slide), zoom y volteo (flip).
  • Mención de cómo la API de transiciones de vista funciona con el enrutador de Angular y el historial del navegador.

Otras características y mejoras

  • Resumen breve de algunas otras características y mejoras que ofrece Angular 17, tales como:
  • Soporte para pasar @Component.styles como una cadena (string).
  • El código de animaciones de Angular es cargable diferidamente.
  • Soporte para TypeScript 5.2.
  • La API central de señales (signals) ahora es estable.
  • Se ha eliminado el soporte para Node.js v16, siendo la versión mínima soportada v18.13.0.
  • Esbuild será el constructor predeterminado y el servidor de desarrollo predeterminado utilizará Vite.

Resumen y siguientes pasos

Requerimientos

  • Comprensión de HTML, CSS y JavaScript
  • Experiencia con TypeScript y RxJS
  • Experiencia en desarrollo web

Audiencia objetivo

  • Desarrolladores que desean aprender a utilizar Angular 17 para crear aplicaciones web dinámicas y responsivas.
  • Desarrolladores que deseen actualizar sus habilidades desde versiones anteriores de Angular.
  • Programadores que deseen explorar las nuevas características y mejoras de Angular 17.
 28 Horas

Número de participantes


Precio por participante

Reseñas (2)

Próximos cursos

Categorías Relacionadas