Patrón de diseño: MVC | Explicación completa y simple

Introducción

Hola buenas, mi nombre es Daniela Barazarte y te quiero dar la bienvenida a esta explicación completa del patrón de diseño de modelo-vista-controlador, esta explicación será tan simple y directa que hasta un niño de 5 años podría entenderla.

Si prefieres los videos, aquí tienes un tutorial completo hecho por mí en YouTube, está en idioma español pero tiene subtítulos: https://www.youtube.com/watch?v=b2tPRbQJing

Teoría

Lógica

"Patrón de diseño"

• Patrón: es un tipo de sucesos u objetos repetitivos
• Diseño: actividad creativa que tiene por fin proyectar objetos que sean útiles y estéticos

"Modelo-Vista-Controlador"

• Modelo: cosa que sirve como pauta para ser imitada, reproducida o copiada.
• Vista: sentido corporal que permite ver las cosas materiales.
• Controlador: que sirve para controlar algo o a alguien.

Definición simple

• El modelo que maneja los datos y la lógica de negocio (ej: clases)
• La vista que muestra los datos al usuario (ej: plantillas, archivos)
• El controlador contiene las clases que se encargan de conectar el modelo y la vista, procesar las solicitudes del usuario y actualizar los datos en el modelo según corresponda.

Patrón de diseño Modelo-Vista-Controlador se llama así porque divide el programa en un "Modelo" el cual sirve para ser utilizada en diferentes partes del sistema, en una "Vista" la cual puedes ver ya que está hecha con código HTML y CSS, y "Controlador" pues es el que controla lo que sucede entre el modelo y la vista.

Estructura

Un proyecto tendrá cada uno de sus componentes separados en:

• Modelo
• Vista
• Controlador

La separación de responsabilidades entre estos componentes permite una mayor modularidad y reutilización de código, así como una mayor facilidad de mantenimiento y escalabilidad de la aplicación.

Además, el patrón MVC fomenta el desarrollo de aplicaciones basadas en la web y en dispositivos móviles, ya que permite separar la lógica del servidor y del cliente de forma clara y eficiente.

Práctica

Ejercicio

Tienes el trabajo de crear una Página Web para un gimnasio, en ese gimnasio se pueden registrar miembros y también se pueden registrar los diferentes equipamientos que hay, el inventario para las ventas, las ventas, etc. Tu tarea es hacer que un administrador pueda registrar los equipamientos del gimnasio desde la página web.

Hay dos métodos para resolver la tarea:

• Poner todo en la misma carpeta/proyectos
• Emplear MVC para estructurarlo todo en diferentes carpetas/proyectos

Método: sin patrón de diseño MVC

Los métodos, vistas, clases, código y muchos otros componentes estarían en el mismo lugar.

Método: con patrón de diseño MVC

Ahora, los métodos, las vistas, las clases y demás están separados en cada uno de los proyectos de modelo, vista y controlador

Importancia

El patrón de diseño MVC tiene varios beneficios:

• Facilita la reutilización de código y la modularidad de la aplicación.
• Hace que el código sea más fácil de mantener y actualizar.
• Permite una separación clara de responsabilidades entre los diferentes componentes de la aplicación.
• Facilita el trabajo en equipo y la colaboración entre los desarrolladores.
• Permite una mayor flexibilidad y escalabilidad en el diseño de la aplicación.

Agradecimiento

Muchas gracias por leer. Si este post te ha ayudado, agradezco que le des like, comentes cualquier duda que tengas y me sigas para que este mismo post pueda ayudar a muchas otras personas

Me puedes encontrar en mis otras redes como Twitter, GitHub y LinkedIn