Modèle-View-Contrôleur (MVC) · Cartes mentales

Modèle-View-Contrôleur (MVC). Une carte mentale modifiable avec des branches colorées, des idées secondaires et des liens. Les courbes montrent les liens; les flèches indiquent les relations où le sens compte.

MVC sépare une application en trois parties avec une seule règle : le contrôleur gère les entrées, le modèle possède l'état et les règles, et la vue restitue le modèle ; et ni la vue ni le contrôleur ne touchent directement l'état.

Modèle-View-Contrôleur (MVC) · Cartes mentales

Le canevas MindMap interactif de cette explication : chaque couloir, ligne et flèche ci-dessus appartient à un véritable diagramme QueryChart que vous pouvez ouvrir et modifier.

Comment lire cette carte mentale

  • Commencez par le sujet central, puis suivez une branche colorée pour explorer ses idées.
  • Les courbes montrent les liens; les flèches indiquent les relations où le sens compte.

User input

Cette branche rassemble “User interacts with the interface”.

Controller

Cette branche rassemble “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

Cette branche rassemble “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

Cette branche rassemble “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”.

Liens entre les branches

Le contrôleur gère les entrées ; le modèle possède l'État ; la vue donne : trois responsabilités, trois voies.

Ni la vue ni le contrôleur n'écrivent de données ; tous les changements transitent par le modèle.

Le modèle informe les observateurs plutôt que de commander la vue, de sorte qu'un modèle peut piloter plusieurs vues.

La séparation rend chaque partie testable individuellement : la récompense originale du modèle.

MVC est l'ancêtre de nombreux modèles modernes (MVVM, MVP, magasins de style Redux), préservant tous la même séparation.

Relations et enseignements clés

  • Le contrôleur gère les entrées ; le modèle possède l'État ; la vue donne : trois responsabilités, trois voies.
  • Ni la vue ni le contrôleur n'écrivent de données ; tous les changements transitent par le modèle.
  • Le modèle informe les observateurs plutôt que de commander la vue, de sorte qu'un modèle peut piloter plusieurs vues.
  • La séparation rend chaque partie testable individuellement : la récompense originale du modèle.
  • MVC est l'ancêtre de nombreux modèles modernes (MVVM, MVP, magasins de style Redux), préservant tous la même séparation.

Quand utiliser ce visuel

  • Présentation du modèle à un développeur avant de lire la documentation d'un framework : le triangle est la carte implémentée par chaque framework.
  • Expliquer pourquoi une base de code est difficile à modifier : l'état géré dans la vue est une violation MVC et il est visible sur le canevas.
  • Comparaison de MVC avec les architectures en couches dans le visuel d'architecture propre.

Comment cela fonctionne

  1. Adapter le sujet central

    Renommez le sujet pour votre projet ou votre cours.

  2. Développer les branches

    Modifiez les idées et ajoutez des exemples ou des notes.

  3. Relier les idées

    Reliez les branches; utilisez une flèche lorsque le sens est important.

Questions fréquentes

Qu’est-ce que MVC ?

MVC (Modèle-View-Contrôleur) est un modèle logiciel qui divise une application en trois parties : le contrôleur gère les entrées, le modèle possède les données et les règles métier, et la vue restitue le modèle. L'avantage de la séparation est que chaque pièce peut être développée et testée indépendamment, et que le même modèle peut être représenté par de nombreuses vues. C’est le modèle sur lequel la plupart des frameworks Web sont construits.

Pourquoi le modèle est-il au centre de MVC ?

Parce que le modèle est la seule source de vérité. Si le contrôleur et la vue pouvaient écrire des données, ils dériveraient et se disputeraient l'état. Conserver toutes les modifications dans le modèle signifie qu’il existe exactement un seul endroit où résident les règles de données, et que la vue est toujours une projection d’un modèle cohérent. Le visuel place les deux boîtes de modèles dans leur propre voie pour cette raison.

Que se passe-t-il si je mets de la logique dans la vue ?

Vous obtenez un anti-modèle parfois appelé « fat view » : du code d'affichage mélangé à des règles métier, qui ne peut être testé sans rendu, et qui s'écarte du modèle. La même critique s’applique à un contrôleur qui détient la logique métier au lieu de déléguer. La discipline de MVC est que chaque voie reste dans sa voie : les trois lignes distinctes du visuel constituent la règle rendue visible.

Quel est le lien entre MVC et les frameworks modernes ?

La plupart des frameworks modernes conservent le triangle avec de nouveaux noms : MVVM ajoute une couche de modèle de vue, MVP donne à la vue un présentateur et les bibliothèques de gestion d'état comme Redux sont essentiellement le modèle avec une règle de notification plus stricte. La boucle centrale du canevas (l'entrée change d'état, l'état pilote la sortie) est l'invariant que chacun d'entre eux conserve.

Modifier cette carte mentale dans QueryChart

Ouvrez cette carte mentale sur un espace modifiable. Déplacez les idées et ajoutez des branches et des liens.

Modifier cette carte mentale dans QueryChart

Plus dans Cartes mentales