Home

Angular

Presentación

La asignatura de Angular tiene como finalidad capacitar al alumnado en el desarrollo de aplicaciones frontend modernas, escalables y mantenibles mediante el uso del framework Angular. A partir de los conocimientos previos de JavaScript y ECMAScript, se profundiza en la construcción de Single Page Applications (SPA), la arquitectura basada en componentes, la comunicación con servicios backend y la gestión avanzada del estado de la aplicación.

La asignatura está orientada a proporcionar una base sólida para el desarrollo profesional de aplicaciones web complejas, siguiendo estándares actuales de la industria y buenas prácticas de ingeniería de software.

Marco General de la Asignatura (Currículo)

MÓDULO 10 – Desarrollo de Aplicaciones Web

Competencias Generales

C.G.1 Haber adquirido conocimientos avanzados y demostrado, en un contexto altamente especializado, una comprensión detallada y fundamentada de los aspectos teóricos y prácticos y de la metodología de trabajo en el campo de los sistemas de información.

C.G.2 Ser capaces de asumir la responsabilidad de su propio desarrollo profesional y de su especialización en uno o más campos de estudio.

Competencias Específicas

C.E.3 Concebir, planificar, dirigir, implementar y mantener proyectos de desarrollo software.

Unidades de Competencia

U.C. 3.13 Identificar, conocer y aplicar los estándares Web.

U.C. 3.15 Integrar frameworks frontend modernos en aplicaciones web.

Objetivo de la Asignatura

Resultados de aprendizaje

Al finalizar la asignatura, el alumnado será capaz de:

Comprender la arquitectura y el ecosistema del framework Angular.
Crear y estructurar aplicaciones SPA basadas en componentes.
Aplicar correctamente el data binding y las directivas de Angular.
Implementar comunicación entre componentes mediante inputs y outputs.
Gestionar la navegación y el control de acceso mediante el Router.
Consumir servicios backend mediante HTTP y programación reactiva.
Aplicar patrones de gestión de estado en aplicaciones Angular.
Desarrollar formularios escalables y robustos.
Optimizar el rendimiento y aplicar buenas prácticas de calidad de código.
Estructurar proyectos Angular preparados para entornos productivos.

Metodología

La metodología de la asignatura se basa en un enfoque activo, práctico y orientado a proyecto, priorizando el aprendizaje experiencial y progresivo. El proceso de enseñanza-aprendizaje se articula en torno al principio de aprender haciendo, mediante la construcción incremental de una aplicación Angular realista.

Las sesiones combinan actividades prácticas guiadas con exposiciones teóricas posteriores, cuyo objetivo es formalizar y consolidar los conceptos que el alumnado ha explorado previamente. Este enfoque favorece una comprensión profunda del framework y de sus decisiones arquitectónicas.

Se fomenta la autonomía, la investigación individual y la reflexión crítica, incentivando el uso de la documentación oficial y el análisis de soluciones alternativas. Asimismo, la metodología es flexible y adaptativa, permitiendo atender distintos ritmos de aprendizaje y niveles de experiencia.

El acompañamiento docente se ajustará a las necesidades del alumnado, proponiendo niveles de ampliación para perfiles más avanzados y refuerzos conceptuales para quienes lo requieran.

Temario y Planificación

Bloque 1. Fundamentos y arranque del proyecto

Sesiones 1 – 4

Contenido principal Introducción a Angular y su ecosistema. Creación y arranque de un proyecto, análisis de la estructura base, fundamentos de TypeScript aplicado a Angular y uso de plantillas con data binding y directivas.

Objetivo general Comprender la arquitectura básica de Angular, su flujo de arranque y los fundamentos necesarios para construir una aplicación funcional.

Bloque 2. Componentes y reutilización

Sesiones 5 – 9

Contenido principal Creación de componentes, reutilización, encapsulación, comunicación entre componentes mediante inputs y outputs, y ciclo de vida de los componentes.

Objetivo general Desarrollar componentes reutilizables y comprender los mecanismos de comunicación y gestión del ciclo de vida dentro de una aplicación Angular.

Bloque 3. Navegación y estructura de aplicación

Sesiones 10 – 14

Contenido principal Configuración del Router, navegación entre vistas, rutas con parámetros, lazy loading, guards y resolvers.

Objetivo general Diseñar la navegación de aplicaciones SPA complejas y controlar el acceso y la carga de datos de forma estructurada.

Bloque 4. Servicios y comunicación con backend

Sesiones 15 – 19

Contenido principal Servicios, inyección de dependencias, HttpClient, programación reactiva con RxJS, manejo de errores, interceptores y arquitectura de servicios.

Objetivo general Implementar la comunicación con backend de forma escalable, reactiva y mantenible, aplicando patrones profesionales de arquitectura.

Bloque 5. Gestión de estado (Stores)

Sesiones 20 – 24

Contenido principal Problemas de estado, introducción a stores, implementación con RxJS, introducción a NgRx, efectos y herramientas avanzadas.

Objetivo general Comprender y aplicar patrones de gestión de estado adecuados a aplicaciones Angular de media y gran escala.

Evaluación

La evaluación se basará en una combinación de issues prácticas y un proyecto final, aplicando criterios objetivos, medibles y alineados con estándares profesionales.

Issues prácticas

Se definirán issues específicas asociadas a ejercicios concretos.
Cada issue detallará claramente la funcionalidad a implementar y las pruebas a realizar.
El cierre de cada issue será evidencia de la correcta ejecución de la tarea.
Se exigirá el cumplimiento de la guía de estilo oficial de Angular y TypeScript.

Práctica final

La asignatura culminará con un proyecto final completo, en el que el alumnado deberá implementar una aplicación Angular funcional, estructurada y mantenible, cumpliendo unos criterios mínimos de calidad y arquitectura previamente definidos.

Criterios de puntuación

Correcta ejecución funcional.
Aplicación de buenas prácticas de programación.
Claridad, simplicidad y modularidad del código.
Nomenclatura adecuada y coherencia arquitectónica.
Alineación con los principios de Clean Code.

Buenas prácticas

Declaración de autoría y correcta referencia de fuentes.
Uso prioritario de la documentación oficial de Angular, TypeScript y RxJS.
Consulta de recursos como Angular.io y documentación oficial relacionada.

El uso de Inteligencia Artificial puede ser un apoyo puntual al aprendizaje, pero se recomienda un uso responsable, crítico y siempre contrastado con la documentación oficial.