📄️ ¿Qué es Angular y por qué usarlo?
Angular es un framework de desarrollo web de código abierto, mantenido por Google, diseñado para construir aplicaciones web modernas, escalables y de alto rendimiento. Se basa en TypeScript, un superconjunto de JavaScript tipado, y ofrece una solución integral que abarca desde la gestión del estado hasta el renderizado de vistas, la navegación entre rutas y la integración con APIs.
📄️ Instalación de entorno Angular (Node, CLI, Vite)
Requisitos previos
📄️ Estructura de un proyecto Angular
Una buena estructura en Angular:
📄️ TypeScript para Angular: tipos, interfaces, clases
Angular está construido sobre TypeScript, un superconjunto tipado de JavaScript que permite detectar errores antes de ejecutar el código, definir estructuras formales de datos, y aplicar principios de programación orientada a objetos (OOP) y funcional.
📄️ Comando útiles de Angular CLI
La Angular CLI (Command Line Interface) es una herramienta oficial que permite crear, desarrollar, construir y mantener proyectos Angular de forma eficiente y estandarizada.
📄️ ¿Qué es un componente? (decoradores, selector, HTML, CSS, TS)
Un componente en Angular es una unidad fundamental de la interfaz de usuario. Representa una porción autocontenida de la vista (UI) y encapsula su estructura, estilo y lógica de comportamiento.
📄️ Signals
Los Signals son una nueva forma de manejar reactividad introducida en Angular 16, diseñada para reemplazar o complementar a mecanismos como RxJS, @Input(), @Output() y ChangeDetection, pero con un enfoque declarativo, sincrónico y predictible.
📄️ Comunicación entre componentes: @Input y @Output
En Angular, las aplicaciones se construyen como árboles de componentes, donde:
📄️ Servicios en Angular e Inyección de Dependencias
Un servicio es una clase que encapsula lógica de negocio o funcionalidad que no pertenece directamente a un componente, como:
📄️ Routing en Angular (básico y avanzado)
El enrutamiento (routing) en Angular es el sistema que permite navegar entre diferentes vistas o componentes de una aplicación Single Page Application (SPA), manteniendo la URL sincronizada con el estado de la aplicación.
📄️ Estilos con TailwindCSS o Angular Material
Angular proporciona un sistema robusto para el manejo de estilos (CSS/SCSS encapsulado por componente). Sin embargo, al construir aplicaciones reales necesitamos acelerar el diseño y mantener consistencia visual.
📄️ Formularios reactivos vs. template-driven
Angular proporciona dos enfoques principales para manejar formularios:
📄️ Validación de formularios (sincrónica y asincrónica)
La validación de formularios es el proceso mediante el cual se verifica que los datos ingresados por el usuario cumplen con ciertas reglas antes de procesarlos.
📄️ Manejo de estados en formularios
En Angular, los formularios (y cada uno de sus controles) tienen propiedades que describen su estado actual. Esto permite saber si un formulario es válido, si ha sido modificado o si el usuario ha interactuado con él.
📄️ Ejercicios propuestos por tema
TypeScript para Angular: tipos, interfaces, clases