Universidad Nacional de Entre Ríos
Facultad de Ciencias de la Administración
Tecnicatura Universitaria en Desarrollo
Web
Desarrollo de Aplicaciones Web
Unidad 1 - Patrones de Diseño
Patrones de Diseño
Temas a desarrollar
● TypeScript. Sintaxis. Tipos de datos. Funciones. Estructuras de control.
Estructuras de repetición. POO y TypScript: Interfaces, clases, herencia.
Genéricos. Decoradores.
● Patrones de diseño. Concepto. Historia. Clasificación.
● Catálogo de patrones de diseño: creacionales, estructurales y de
comportamiento.
● Implementación de patrones de diseño en lenguaje orientado a objetos.
● Principios SOLID.
● Patrón Modelo-Vista-Controlador. Concepto. Roles y
responsabilidades de cada componente.
● Implementación práctica MVC.
Introducción
Existen diferentes maneras de diseñar e implementar aplicaciones
web.
Se puede crear una aplicación web completa colocando todo el código
en un solo archivo. Sin embargo, encontrar un error en dicho archivo
no es tarea fácil.
Otros enfoques dividen el código en diferentes archivos y carpetas.
Incluso existen enfoques que dividen la aplicación en diferentes
aplicaciones pequeñas distribuidas en varios servidores.
Introducción
Estructurar el código no es tarea fácil.
Por eso se han desarrollado lo que se conoce como patrones de
arquitectura de software.
Estos patrones son estructuras que se utilizan para resolver problemas
comunes de diseño de software.
Con estos patrones no tenemos que reinventar la rueda cada vez que
comienzan un nuevo proyecto.
Introducción
Existen muchos patrones de arquitectura:
● Modelo-Vista-Controlador
● Dividir en capas
● Orientado a servicios
● Microservicios
Cada uno tiene sus ventajas y desventajas.
Modelo-Vista-Controlador
Tiene sus inicios en los años 70 y fue pensado para aplicaciones de
escritorio, logro su popularidad gracias a las aplicaciones WEB.
Este patrón divide la aplicación en tres elementos interconectados:
• El modelo contiene la lógica de negocio de la aplicación.
• La vista contiene la interfaz de usuario de la
aplicación.
• El controlador actúa como interfaz entre los
elementos del modelo y la vista.
Modelo-Vista-Controlador
Roles y responsabilidades
Modelo: representa los datos y lógica de negocio de la aplicación. Responsable de la
gestión, manipulación y validación de los datos, así como de la implementación de la lógica
de negocio.
No sabe nada de la interfaz gráfica, es independiente, no sabe si es una aplicación WEB o
una aplicación móvil.
Vista: elemento con el que interactúa el usuario. Se comunica con el controlador para
acceder a los datos, luego muestra los datos al usuario de manera comprensible y fácil de
entender. Solamente muestra la información que le proporciona el modelo.
Ejemplo: NestJS mediente la integración de plantillas Handlebars.
Controlador: hace de intermediario entre la Vista y el Modelo, recibe las solicitudes del
usuario, obtiene o modifica datos del Modelo, selecciona la Vista que corresponde y envía
los datos.
Modelo-Vista-Controlador
Modelo-Vista-Controlador
Ventajas de su uso:
● Mejor separación del código.
● Varios miembros del equipo pueden trabajar y colaborar
simultáneamente.
● Es más fácil detectar errores y se mejora mantenimiento.
Bibliografía
●Libro: Daniel Correa_ Greg Lim - Practical Nest.js_ Develop clean MVC web applications
(2022, Independently published)
● [Link]
● [Link]