Modelo-Vista-Controlador (MVC) · Mapas mentales
Modelo-Vista-Controlador (MVC). Un mapa mental editable con ramas de colores, ideas secundarias y conexiones. Las líneas curvas muestran relaciones; las flechas aparecen cuando importa la dirección.
MVC separa una aplicación en tres partes con una sola regla: el controlador gestiona la entrada, el modelo es dueño del estado y de las reglas, y la vista renderiza el modelo; ni la vista ni el controlador tocan el estado directamente.
Modelo-Vista-Controlador (MVC) · Mapas mentales
El lienzo interactivo de MindMap de esta explicación: cada carril, cada fila y cada flecha de arriba forma parte de un diagrama real de QueryChart que puedes abrir y editar.
Cómo leer este mapa mental
- Empieza por el tema central y sigue una rama de color para explorar sus ideas.
- Las líneas curvas muestran relaciones; las flechas aparecen cuando importa la dirección.
User input
Esta rama reúne “User interacts with the interface”.
Controller
Esta rama reúne “The controller is the traffic cop: it reads the user's action, decides what it means and tells the model what to change. It holds no state itself.”, “Controller updates the model”.
Model
Esta rama reúne “The model is the single source of truth — data and the rules that govern it. Both the controller and the view read from it, which is why they never fight over state.”, “Model notifies observers of the change”.
View
Esta rama reúne “The view is a projection of the model: it never changes data directly, it only asks the model and displays what it returns.”, “User sees the updated interface”.
Conexiones entre ramas
El controlador gestiona la entrada, el modelo es dueño del estado y la vista renderiza: tres responsabilidades, tres carriles.
Ni la vista ni el controlador escriben datos; todos los cambios pasan por el modelo.
El modelo notifica a los observadores en lugar de mandar sobre la vista, así que un mismo modelo puede alimentar muchas vistas.
La separación hace que cada parte se pueda probar por separado: la recompensa original del patrón.
MVC es el antecesor de muchos patrones modernos (MVVM, MVP, los stores al estilo Redux), y todos conservan la misma separación.
Relaciones clave y conclusiones
- El controlador gestiona la entrada, el modelo es dueño del estado y la vista renderiza: tres responsabilidades, tres carriles.
- Ni la vista ni el controlador escriben datos; todos los cambios pasan por el modelo.
- El modelo notifica a los observadores en lugar de mandar sobre la vista, así que un mismo modelo puede alimentar muchas vistas.
- La separación hace que cada parte se pueda probar por separado: la recompensa original del patrón.
- MVC es el antecesor de muchos patrones modernos (MVVM, MVP, los stores al estilo Redux), y todos conservan la misma separación.
Cuándo usar este diagrama
- Presentar el patrón a alguien que desarrolla antes de que lea la documentación de un framework: el triángulo es el mapa que implementa cualquier framework.
- Explicar por qué un código es difícil de cambiar: gestionar el estado en la vista es una violación de MVC, y se ve en el lienzo.
- Comparar MVC con las arquitecturas por capas del diagrama de la arquitectura limpia.
Cómo funciona
Adapta el tema central
Cambia el nombre del tema para adaptarlo a tu proyecto o clase.
Desarrolla las ramas
Edita las ideas y añade ejemplos o notas.
Conecta ideas relacionadas
Dibuja conexiones entre ramas; usa flechas cuando la dirección importe.
Preguntas frecuentes
¿Qué es MVC?
MVC (Modelo-Vista-Controlador) es un patrón de software que separa una aplicación en tres partes: el controlador gestiona la entrada, el modelo es dueño de los datos y de las reglas de negocio, y la vista renderiza el modelo. La ventaja de la separación es que cada parte se puede desarrollar y probar de forma independiente, y que un mismo modelo se puede mostrar en muchas vistas. Es el patrón sobre el que están construidos la mayoría de los frameworks web.
¿Por qué el modelo es el centro de MVC?
Porque el modelo es la única fuente de verdad. Si tanto el controlador como la vista pudieran escribir datos, se separarían y se pelearían por el estado. Mantener todos los cambios en el modelo significa que hay exactamente un sitio donde viven las reglas de los datos, y que la vista siempre es una proyección de un modelo coherente. Por eso el diagrama coloca las dos cajas del modelo en su propio carril.
¿Qué pasa si pongo lógica en la vista?
Obtienes un antipatrón que a veces se llama «vista gorda»: código de presentación mezclado con reglas de negocio, que no se puede probar sin renderizar y que se separa del modelo. La misma crítica vale para un controlador que guarda lógica de negocio en lugar de delegarla. La disciplina de MVC es que cada carril se quede en su carril: las tres filas separadas del diagrama son esa regla hecha visible.
¿Qué relación tiene MVC con los frameworks modernos?
La mayoría de los frameworks modernos conservan el triángulo con nombres nuevos: MVVM añade una capa de modelo de vista, MVP le da un presentador a la vista y las bibliotecas de gestión de estado como Redux son en esencia el modelo con una regla de notificación más estricta. El bucle central del lienzo (la entrada cambia el estado, el estado dirige la salida) es el invariante que conserva cada uno de ellos.
Editar este mapa mental en QueryChart
Abre este mapa mental en un lienzo editable. Mueve ideas, añade ramas y dibuja conexiones.