0% encontró este documento útil (0 votos)
51 vistas16 páginas

Taller de Análisis de Sistemas MVC

El documento describe cuatro patrones de arquitectura de software: Modelo-Vista-Controlador, Arquitectura por Capas, Repositorio y Cliente-Servidor. El patrón Modelo-Vista-Controlador separa una aplicación en tres componentes lógicos: modelo, vista y controlador. El patrón de Arquitectura por Capas divide una aplicación en capas como presentación, aplicación, lógica de negocio y acceso a datos. El patrón de Repositorio centraliza el almacenamiento y recuperación de datos. El patr
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
0% encontró este documento útil (0 votos)
51 vistas16 páginas

Taller de Análisis de Sistemas MVC

El documento describe cuatro patrones de arquitectura de software: Modelo-Vista-Controlador, Arquitectura por Capas, Repositorio y Cliente-Servidor. El patrón Modelo-Vista-Controlador separa una aplicación en tres componentes lógicos: modelo, vista y controlador. El patrón de Arquitectura por Capas divide una aplicación en capas como presentación, aplicación, lógica de negocio y acceso a datos. El patrón de Repositorio centraliza el almacenamiento y recuperación de datos. El patr
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd

TALLER DE ANÁLISIS DE SISTEMAS

Análisis de Sistemas
DIRECTOR DE ESCUELA

Director de Escuela / Andrés del Alcazar

ELABORACIÓN

Experto disciplinar / Priscilla Alvares

Diseñador instruccional / Felipe Molina

Jefe de Diseño Instruccional / Alejandra San Juan

VALIDACIÓN

Aida Villamar

DISEÑO DOCUMENTO

Boris del Campo

Instituto Profesional AIEP / Educación Online 2


Tabla de contenido
Criterios de Evaluación: ........................................................................................................4
1. Patrón Modelo-Vista-Controlador ............................................................................4
1.1. Desarrollo ................................................................................................................................ 4

2. Patrón de Arquitectura por Capas ............................................................................7


3.1. Desarrollo ................................................................................................................................ 7

3. Patrón de Repositorio .....................................................................................................10


3.1. Desarrollo .............................................................................................................................. 10

Patrón Cliente-Servidor ......................................................................................................12


4.1. Desarrollo .............................................................................................................................. 12

5. Ideas clave ..............................................................................................................15


6. Referencias Bibliográficas .......................................................................................16

Instituto Profesional AIEP / Educación Online 3


Criterios de Evaluación:
• Aplica patrón Modelo-Vista-Controlador, considerando modelado de arquitectura de software.
• Aplica patrón por Capas, considerando modelado de arquitectura de software.
• Aplica patrón de Repositorio, considerando modelado de arquitectura de software.
• Aplica patrón Cliente-Servidor, considerando modelado de arquitectura de software.

1. Patrón Modelo-Vista-Controlador

1.1. Desarrollo

El patrón vista controlador, también es conocido como el patrón MVC por su sigla en inglés
Model View Controller, este patrón es uno de los más usados en la industria del software para
poder crear proyectos modulares y escalables. Este modelo separa un sistema o aplicación en 3
componentes lógicos como son el modelo, la vista y el controlador. Donde cada uno de estos
componentes cumple una función especifica y la forma en la que se relacionan, sirve para ayudar a
los desarrolladores a crear aplicaciones con facilidad de mantención en el futuro.

Esto se crea para apartar las representaciones internas de información de las formas en que se
presenta la información al usuario. En otras palabras, indica desencaja los componentes y permite
la reutilización eficiente del código.

Vista
FIGURA N° 1: INTERFAZ G RÁFICA DE U SUARIO (GUI)
(freepickcompany, s.f.)

La Vista es la representación de la interfaz gráfica de usuario, esto quiere decir que cada
elemento gráfico que interactúa con el usuario es la capa que obtiene la información de lo que
necesita el usuario, esto técnicamente se llama evento a toda interacción entre el usuario y la
vista. La vista muestra siempre la información del modelo.

Instituto Profesional AIEP / Educación Online 4


Modelo

FIGURA N° 2: BASES DE DATOS


(freepickcompany, s.f.)

El modelo contiene la funcionalidad y los datos básicos, es decir, el modelo tiene toda la
responsabilidad de relacionar los datos que una aplicación va a utilizar, como por ejemplo:
consultas, actualizaciones, creación y eliminación de información, estas operaciones son conocidas
como CRUD, provenientes del acrónimo en ingles Create, Read, Update and Delete, (Crear, Leer,
Actualizar y Borrar).
Esto también se conoce como “Lógica de Negocio”, es decir la parte de la aplicación que se
encarga de convertir todas las actividades realizadas por la empresa en el mundo real, a la forma en
que se va a modificar la información.

Controlador
FIGURA N° 3: E NLACE ENTRE V ISTA Y MODELO
(freepickcompany, s.f.)

El Controlador contiene el código necesario para responder a las acciones que se solicitan en
la aplicación, como visualizar una imagen, realizar una compra, hacer una búsqueda de información,
es decir, esta capa que sirve de enlace entre las vistas y los modelos, respondiendo a los eventos que
pueda solicitar el usuario a nuestra aplicación. Sin embargo, su responsabilidad no es manipular
directamente datos, ni mostrar ningún tipo de salida, sino servir de enlace entre los modelos y las
vistas para implementar las diversas necesidades del desarrollo.

Instituto Profesional AIEP / Educación Online 5


FIGURA N° 4: O RGANIZACIÓN DEL MVC
(Sommerville, Ingeniería de Software 9)

En conclusión, este modelo es el más simple y utilizado por la mayoría de los desarrolladores,
en resumen, la vista muestra el modelo al usuario, el usuario ejecuta evento para que la vista se los
envie al controlador, quien recibe y manipula el modelo de acuerdo con la solicitud, el modelo a su
vez realiza las operaciones necesarias para modificar la información y luego notifica al controlador
para que este decida mostrar una nueva vista al usuario.

FIGURA N° 5: MODELO V ISTA CONTROLADOR


(Codigofacilito, s.f.)

Instituto Profesional AIEP / Educación Online 6


1.2. Ejemplo Aplicación Modelo Vista Controlador

A continuación, te recomiendo que visites los siguientes link para que puedas complementar el
contenido relacionado al modelo vista controlador, veras dos ejemplos de la aplicación.

• Ejemplo 1: Patrón MVC - Ejemplo con WinForms y ASP.Net (Buscar/Filtrar Datos) C#, SQL
Server1: https://www.youtube.com/watch?v=JbqBAkpj7T8&t=164s

• Ejemplo 2: Ejemplo patrón MVC con ASP.NET, SQL Server, C#:


https://www.youtube.com/watch?v=JbqBAkpj7T8&t=952s

2. Patrón de Arquitectura por Capas


3.1. Desarrollo

Este patrón también es bastante conocido y muy utilizado al igual que el patrón MVC, también
muchas veces suelen confundirlo con el patrón Modelo Vista Controlador, la verdad es que se
parecen en algunas características, pero la diferencia es que este modelo se puede utilizar para
estructurar programas que se pueden descomponer en grupos de subtareas, cada una de las cuales
se encuentra en un nivel particular de abstracción. Cada capa proporciona servicios a la siguiente
capa.

Las 4 capas más comúnmente encontradas de un sistema de información general son las siguientes.

• Capa de presentación (conocida como capa de interfaz de usuario UI)


• Capa de aplicación (conocida como capa de servicio)
• Capa de lógica de negocios (conocida como capa de dominio)
• Capa de acceso a datos (conocida como capa de persistencia)

1Advance, R. J. C. (n.d.). Patrón MVC, Modelo-Vista-Controlador + Ejemplo (Cap 4). Rjcodeadvance.Com. Retrieved May
17, 2021, from https://rjcodeadvance.com/patrones-de-software-patron-mvc-ejemplo-parte-4/

Instituto Profesional AIEP / Educación Online 7


FIGURA N° 6: ARQUITECTURA POR CAPAS
(Lizardo, s.f.)

El uso de esta arquitectura esta orientado para las siguientes aplicaciones:

• Aplicaciones de escritorio generales.


• Aplicaciones web de comercio electrónico.
• Aplicaciones estándar de línea de negocios que hacen más que sólo operaciones CRUD.
• Nuevas aplicaciones que necesitan ser construidas rápidamente.
• Equipos de desarrolladores inexpertos que aún no entienden otras arquitecturas.
• Aplicaciones que requieren normas estrictas de mantenimiento y comprobabilidad.

Este método es adecuado para diseñar la mayoría de los programas informáticos y está
destinado a ser auto independiente. Esto significa que todos los componentes están
interconectados, pero no dependen unos de otros. Cada capa del patrón de arquitectura en capas
tiene un papel y una responsabilidad específicos dentro de la aplicación. Por ejemplo, una capa de
presentación se encargaría de manejar toda la interfaz de usuario y la lógica de comunicación del
navegador, mientras que una capa empresarial se encargaría de ejecutar las reglas empresariales
específicas asociadas a la solicitud. Los componentes dentro de una capa específica se ocupan sólo
de la lógica que pertenece a esa capa.

Instituto Profesional AIEP / Educación Online 8


FIGURA N° 7: COMUNICACIÓN E NTRE CAPAS . V ARGAS , P RISCILLA (2021)

I. Capa de presentación: es la que ve el usuario, que presenta el sistema al usuario, le comunica la


información y captura la información del usuario, realiza un filtrado previo para comprobar que
no hay errores de formato. También es conocida como interfaz gráfica. Esta capa se comunica
únicamente con la capa de negocio.

II. Capa de negocio: es donde residen los programas que se ejecutan, se reciben las peticiones del
usuario y se envían las respuestas tras el proceso. Se denomina capa de negocio porque se
establecen las reglas que deben cumplirse. Esta capa se comunica con la capa de presentación,
para recibir las solicitudes y presentar los resultados, y con la capa de datos, para almacenar o
recuperar datos. También se consideran aquí los programas de aplicación.

III. Capa de datos: es donde residen los datos y es la encargada de acceder a los mismos. Está
formada por uno o más gestores de bases de datos que realizan todo el almacenamiento de
datos, reciben solicitudes de almacenamiento o recuperación de información desde la capa de
negocio.2

1.3. Ejemplo Aplicación Modelo Arquitectura por capas

A continuación, te recomiendo que visites el siguiente enlace para que puedas complementar
el contenido relacionado al modelo Arquitectura por capas.

Ejemplo 1: Arquitectura en Capas/ Análisis completo (conceptos, principios, modelos) Ejemplo


DIP+DDD, C#3: https://www.youtube.com/watch?v=SGXR0pDCP38

2 PATRONES DE ARQUITECTURA Y DISEÑO DE SOFTWARE. (2018, August 14). Com.mx.


https://www.desarrollodepaginasweb.com.mx/patrones-de-arquitectura-de-software/
3 C5/Arquitectura en Capas/ Análisis completo (conceptos, principios, modelos) Ejemplo DIP+DDD, C#. (2018, December

18). Youtube. https://www.youtube.com/watch?v=SGXR0pDCP38

Instituto Profesional AIEP / Educación Online 9


3. Patrón de Repositorio
3.1. Desarrollo

El Patrón de Repositorio, describe cómo comparte datos un conjunto de componentes en


interacción.

La gran parte de los sistemas de software que usan grandes cantidades de datos se constituyen
sobre una base de datos o un repositorio compartido. Por lo tanto, este modelo es adecuado para
aplicaciones en las que un componente genere datos y otro los use.

Los ejemplos de este tipo de sistema incluyen sistemas de comando y control, sistemas de
información administrativa, sistemas CAD y entornos de desarrollo interactivos para software. Este
diagrama incluye diferentes herramientas para soportar desarrollo dirigido por modelo. En este
caso, el repositorio puede ser un entorno controlado por versión que hace un seguimiento de los
cambios al software y permite regresar a versiones anteriores.

Establecer herramientas en torno a un repositorio es una forma eficaz de compartir grandes


volúmenes de datos. No hay necesidad de transmitir explícitamente datos de un componente a
otro. Sin embargo, los componentes deben operar en torno a un modelo de repositorio de datos
acordado. Inevitablemente, éste es un compromiso entre las necesidades específicas de cada
herramienta y sería difícil o imposible integrar nuevos componentes, si sus modelos de datos no se
ajustan al esquema acordado. En la práctica, llega a ser complicado distribuir el repositorio sobre un
número de máquinas. Aunque es posible distribuir un repositorio lógicamente centralizado, puede
haber problemas con la redundancia e inconsistencia de los datos.

FIGURA N° 8: ARQUITECTURA DE R EPOSITORIO


(Sommerville, 2011)

Instituto Profesional AIEP / Educación Online 10


4
En el ejemplo que se muestra en la Figura N° 8, el repositorio es pasivo, y el control es
responsabilidad de los componentes que usan el repositorio. Un enfoque alternativo, que se derivó
para sistemas de Inteligencia Artificial, utiliza un modelo “blackboard”, que activa componentes
cuando los datos particulares se tornan disponibles. Esto es adecuado cuando la forma de los datos
del repositorio está menos estructurada. Las decisiones sobre cuál herramienta activar puede
hacerse sólo cuando se hayan analizado los datos. Este modelo lo introdujo Nii (1986). Bosch (2000)
incluye un buen análisis de cómo este estilo se relaciona con los atributos de calidad del sistema.

El Patrón de Repositorio es uno de los más populares para crear una aplicación de nivel
empresarial. Nos restringe a trabajar directamente con los datos de la aplicación y crea nuevas
capas para las operaciones de la base de datos, la lógica de negocio y la interfaz de usuario de la
aplicación.

Por qué debería usar el Patrón de Diseño de Repositorio.

1. El código de acceso a los datos puede ser reutilizado.


2. Es fácil de implementar la lógica del dominio.
3. Nos ayuda a desacoplar la lógica.
4. La lógica de negocio puede ser probada fácilmente sin acceso a los datos.
5. También es una buena manera de implementar la inyección de dependencia que hace que
el código sea más testeable.

FIGURA N° 9: E STRUCTURA PATRÓN REPOSITORIO


(Micosoft Builth, s.f.)

1.4. Ejemplo Aplicación Patrón Repositorio

• Revisa el siguiente ejemplo de patrón Repositorio con Entity Framework Code First, El
patrón Repositorio con Entity Framework Code First. (2012, agosto 6). Yagoperez.com.
http://yagoperez.com/el_patron_repositorio_con_entity_framework_code_first/

4 Sommerville, I. (2005). Ingenieria del software (M. I. A. Galipienso, A. Botia Martinez, F. Mora Lizan, & J. P. Trigueros
Jover, Trans.; 7th ed.). Pearson Educacion.

Instituto Profesional AIEP / Educación Online 11


4. Patrón Cliente-Servidor

4.1. Desarrollo

La arquitectura de patrón cliente-servidor se organiza como un conjunto de servicios y


servidores asociados, y de clientes que acceden y usan los servicios. El siguiente ejemplo ilustra una
organización en tiempo de operación, de uso muy común para sistemas distribuidos. En la Figura N°
10 se describe el patrón cliente-servidor.

FIGURA N° 10: C LIENTE SERVIDOR . V ARGAS , PRISCILLA (2021)

Los principales componentes de este modelo son:

I. Un conjunto de servidores que ofrecen servicios a otros componentes. Ejemplos de éstos


incluyen servidores de impresión; servidores de archivo que brindan servicios de
administración de archivos, y un servidor compilador, que proporciona servicios de
compilación de lenguaje de programación.

II. Un conjunto de clientes que solicitan los servicios que ofrecen los servidores. Habrá
usualmente varias instancias de un programa cliente que se ejecuten de manera
concurrente en diferentes computadoras.

III. Una red que permite a los clientes acceder a dichos servicios. La mayoría de los sistemas
cliente-servidor se implementan como sistemas distribuidos, conectados mediante
protocolos de Internet. 5

Las arquitecturas cliente-servidor se consideran a menudo como arquitecturas de sistemas


distribuidos; sin embargo, el modelo lógico de servicios independientes que opera en servidores
separados puede implementarse en un solo computador. De nuevo, un beneficio importante es la

5Sommerville, I. (2005). Ingenieria del software (M. I. A. Galipienso, A. Botia Martinez, F. Mora Lizan, & J. P. Trigueros
Jover, Trans.; 7th ed.). Pearson Educacion.

Instituto Profesional AIEP / Educación Online 12


separación e independencia. Los servicios y servidores pueden cambiar sin afectar otras partes del
sistema.

Es posible que los clientes deban conocer los nombres de los servidores disponibles, así como
los servicios que proporcionan. Sin embargo, los servidores no necesitan conocer la identidad de los
clientes o cuántos clientes acceden a sus servicios. Los clientes acceden a los servicios que
proporciona un servidor, a través de llamadas a procedimiento remoto usando un protocolo
solicitud-respuesta, como el protocolo http utilizado en la WWW. En esencia, un cliente realiza una
petición a un servidor y espera hasta que recibe una respuesta.

FIGURA N° 11: ARQUITECTURA CLIENTE SERVIDOR E JEMPLO . V ARGAS , PRISCILLA (2021)

La Figura N° 11 es un ejemplo de un sistema que se basa en el modelo cliente-servidor. Se


trata de un sistema multiusuario basado en la Web, para ofrecer un repertorio de películas y
fotografías. En este sistema, varios servidores manejan y despliegan los diferentes tipos de medios.
Los cuadros de video necesitan transmitirse rápidamente y en sincronía, aunque a una resolución
relativamente baja. Tal vez estén comprimidos en un almacén, de manera que el servidor de video
puede manipular en diferentes formatos la compresión y descompresión del video. Sin embargo, las
imágenes fijas deben conservarse en una resolución alta, por lo que es adecuado mantenerlas en un
servidor independiente.

El catálogo debe manejar una variedad de consultas y ofrecer vínculos hacia el sistema de
información Web, que incluye datos acerca de las películas y los videos, así como un sistema de
comercio electrónico que soporte la venta de fotografías, películas y videos. El programa cliente es
simplemente una interfaz integrada de usuario, construida mediante un navegador Web, para
acceder a dichos servicios.

La ventaja más importante del modelo cliente-servidor consiste en que es una arquitectura
distribuida. Éste puede usarse de manera efectiva en sistemas en red con distintos procesadores
distribuidos. Es fácil agregar un nuevo servidor e integrarlo al resto del sistema, o bien, actualizar de
manera clara los servidores sin afectar otras partes del sistema.6

6 Sommerville, I. (2005). Ingenieria del software (M. I. A. Galipienso, A. Botia Martinez, F. Mora Lizan, & J. P. Trigueros
Jover, Trans.; 7th ed.). Pearson Educacion.

Instituto Profesional AIEP / Educación Online 13


4.2. Ejemplo Aplicación Patrón Cliente Servidor

• Ejemplo Cliente-Servidor en Android7: https://www.jc-mouse.net/proyectos/ejemplo-cliente-


servidor-en-android

• Video de Ejecución Cliente servidor: https://www.youtube.com/watch?v=VzK00rhhhNk&t=71s

7Ejemplo Cliente-Servidor en Android. (n.d.). Jc-Mouse.Net. Retrieved May 18, 2021, from https://www.jc-
mouse.net/proyectos/ejemplo-cliente-servidor-en-android

Instituto Profesional AIEP / Educación Online 14


5. Ideas clave

En este capítulo hemos visto los principales patrones de arquitectura de software, La


arquitectura y el diseño difieren en tres áreas como son el nivel de abstracción, entregables y áreas
de enfoque.

Los patrones de diseño son el esqueleto de las soluciones a problemas comunes en el


desarrollo de software. En otras palabras, brindan una solución ya probada y documentada a
problemas de desarrollo de software que están sujetos a contextos similares. Los patrones de
diseño facilitan la reutilización de arquitecturas y diseños de software exitosos.

Si queremos creer que realmente existe diferencia, entonces es fácil verla midiendo el
impacto al aplicar el patrón: si este es relevante a la totalidad del sistema, entonces hablamos de un
patrón de arquitectura; en cambio, si este sólo concierne a un subcomponente, nos referimos a un
patrón de diseño.

Arquitectura de
Software

Estilos Patrones Patrones de Diseño


Arquitectónicos Arquitectónicos

FIGURA N° 12: E STRUCTURA DE LA ARQUITECTURA DE SOFTWARE. V ARGAS ,


PRISCILLA (2021)

Instituto Profesional AIEP / Educación Online 15


6. Referencias Bibliográficas

Sommerville, I. (2005). Ingenieria del software (M. I. A. Galipienso, A. Botia Martinez, F. Mora Lizan,
& J. P. Trigueros Jover, Trans.; 7th ed.). Pearson Educacion.

De arevalomaria, L. T. las E. (2010, diciembre 2). Introducción al Patrón de Arquitectura por Capas.
Wordpress.com. https://arevalomaria.wordpress.com/2010/12/02/introduccion-al-patron-de-
arquitectura-por-capas/

Huaman, W. C. (2018, septiembre 7). Los 10 patrones comunes de arquitectura de software.


Medium. https://medium.com/@maniakhitoccori/los-10-patrones-comunes-de-arquitectura-de-
software-d8b9047edf0b

Novoseltseva, E. (2020, junio 2). 5 principales patrones de Arquitectura de Software. Apiumhub.com.


https://apiumhub.com/es/tech-blog-barcelona/principales-patrones-arquitectura-software/

PATRONES DE ARQUITECTURA Y DISEÑO DE SOFTWARE. (2018, agosto 14). Com.mx.


https://www.desarrollodepaginasweb.com.mx/patrones-de-arquitectura-de-software/

Unknown. (s. f.). El Tavo = { c#, asp.net, MVC, WCF, y más}. Eltavo.net. Recuperado 13 de mayo de
2021, de http://www.eltavo.net/2014/08/patrones-implementando-patron.html

Instituto Profesional AIEP / Educación Online 16

También podría gustarte