Architecture Modèle-Vue-Template (MVT) et Modèle-Vue-Contrôleur (MVC)

La plupart des frameworks web modernes, y compris Django et (conceptuellement) Flask, suivent une architecture logicielle qui sépare l'application en trois composants principaux :

• Modèle (Model) : Représente les données de l'application (généralement stockées dans une base de données) et la logique métier associée à ces données (comment les données sont créées, modifiées, validées, etc.).
• Vue (View) : Gère la présentation des données à l'utilisateur (généralement en générant du HTML). La vue récupère les données du modèle et les transmet au template.
• Template : Un fichier (généralement HTML) qui définit la structure de la page web, avec des emplacements pour insérer des données dynamiques. Le template est utilisé par la vue pour générer le rendu final.

Django suit explicitement le modèle MVT (Model-View-Template), qui est une variante du modèle MVC (Model-View-Controller). Dans MVT :

• Le *Modèle* est le même que dans MVC.
• La *Vue* correspond au *Contrôleur* de MVC (elle gère la logique de l'application et interagit avec le modèle).
• Le *Template* correspond à la *Vue* de MVC (il gère la présentation).

Flask n'impose pas strictement le modèle MVT/MVC, mais il est courant d'organiser les applications Flask en suivant ces principes.

Cette séparation des préoccupations (données, logique, présentation) permet de rendre le code plus clair, plus organisé, plus facile à maintenir et à tester.

Modèles (Models) : la représentation des données

Les modèles représentent les données de votre application. Ils définissent la structure des données (quels champs, quels types de données) et la logique métier associée (comment créer, modifier, valider, supprimer les données).

Dans de nombreuses applications web, les modèles interagissent avec une base de données (relationnelle ou non) pour stocker et récupérer les données.

• Avec Django : Les modèles sont généralement définis comme des classes Python qui héritent de `django.db.models.Model`. Django fournit un ORM (Object-Relational Mapper) puissant qui permet d'interagir avec la base de données en utilisant des objets Python, sans avoir à écrire de requêtes SQL directement.
• Avec Flask : Flask ne fournit pas d'ORM intégré. Vous pouvez utiliser une bibliothèque externe comme SQLAlchemy, Pony ORM, ou Peewee, ou interagir directement avec la base de données en utilisant une bibliothèque de connecteur (comme `psycopg2` pour PostgreSQL, ou `mysql-connector-python` pour MySQL).

Exemple (modèle Django) :

# models.py (Django)
from django.db import models

class Article(models.Model):
    titre = models.CharField(max_length=200)
    contenu = models.TextField()
    date_publication = models.DateTimeField(auto_now_add=True)

    def __str__(self):
        return self.titre

Dans cet exemple, `Article` est un modèle qui représente un article de blog. Il a trois champs : `titre` (une chaîne de caractères), `contenu` (un texte long), et `date_publication` (une date et heure). Django utilisera ce modèle pour créer une table dans la base de données, et vous pourrez interagir avec cette table en utilisant des objets Python.

Exemple (modèle Flask avec SQLAlchemy, simplifié) :

# models.py (Flask + SQLAlchemy)
from flask_sqlalchemy import SQLAlchemy

db = SQLAlchemy()

class Article(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    titre = db.Column(db.String(200))
    contenu = db.Column(db.Text)
    date_publication = db.Column(db.DateTime)

    def __repr__(self):
        return f'
'

Vues (Views) : la logique de l'application

Les vues sont des fonctions (ou des classes) qui reçoivent une requête HTTP (par exemple, une demande d'affichage d'une page web) et retournent une réponse HTTP (par exemple, le code HTML de la page, ou des données JSON pour une API).

Les vues contiennent la *logique* de votre application. Elles interagissent avec les modèles (pour récupérer ou modifier les données), effectuent des calculs, et préparent les données à afficher.

• Avec Django : Les vues sont généralement définies dans un fichier `views.py` (mais ce n'est pas une obligation). Django fournit des vues basées sur des fonctions et des vues basées sur des classes.
• Avec Flask : Les vues sont généralement définies comme des fonctions, décorées avec `@app.route()` pour les associer à des URL.

Exemple (vue Django, basée sur une fonction) :

# views.py (Django)
from django.shortcuts import render
from .models import Article

def liste_articles(request):
    articles = Article.objects.all()  # Récupère tous les articles de la base de données
    return render(request, 'blog/liste_articles.html', {'articles': articles})

Dans cet exemple :

• `liste_articles` est une vue (une fonction) qui prend une requête HTTP (`request`) en argument.
• Elle récupère tous les articles de la base de données en utilisant le modèle `Article`.
• Elle appelle la fonction `render` pour générer une réponse HTTP. `render` prend la requête, le nom du template (`blog/liste_articles.html`), et un contexte (un dictionnaire contenant les données à passer au template) en arguments.

Exemple (vue Flask) :

# app.py (Flask)
from flask import Flask, render_template

app = Flask(__name__)

#Simule des données
articles = [
  {"titre": "Article 1", "contenu": "Contenu de l'article 1"},
  {"titre": "Article 2", "contenu": "Contenu de l'article 2"}
]

@app.route('/articles')
def liste_articles():
    return render_template('liste_articles.html', articles=articles)

Dans cet exemple :

• `liste_articles` est une vue (une fonction) décorée avec `@app.route('/articles')`. Cela signifie que cette fonction sera appelée lorsque l'utilisateur accède à l'URL `/articles`.
• La fonction retourne le résultat de l'appel à `render_template`, qui prend le nom du template (`liste_articles.html`) et un contexte (ici, la liste `articles`) en arguments.

Templates : la présentation des données

Les templates sont des fichiers (généralement HTML) qui définissent la *présentation* des données. Ils contiennent la structure de la page web, avec des emplacements pour insérer des données dynamiques.

Les templates utilisent un langage de templating spécifique (Jinja2 pour Flask, le langage de template de Django pour Django) qui permet d'insérer des variables, d'effectuer des boucles, des conditions, etc., à l'intérieur du code HTML.

Les vues récupèrent les données (depuis les modèles ou d'autres sources) et les passent aux templates. Les templates utilisent ces données pour générer le rendu final (le code HTML qui sera envoyé au navigateur de l'utilisateur).

Exemple (template Django, `blog/liste_articles.html`) :

{# templates/blog/liste_articles.html (Django) #}

Liste des articles


  {% for article in articles %}
    
{{ article.titre }}
  {% endfor %}

Dans cet exemple :

• `{% for article in articles %}` et `{% endfor %}` sont des balises de contrôle du langage de template de Django. Elles permettent de faire une boucle sur la liste `articles` (passée par la vue).
• `{{ article.titre }}` est une balise de variable. Elle affiche la valeur de l'attribut `titre` de l'objet `article`.

Exemple (template Jinja2, utilisé par Flask, `liste_articles.html`) :

{# templates/liste_articles.html (Flask/Jinja2) #}

Liste des articles


  {% for article in articles %}
    
{{ article.titre }}
  {% endfor %}

La syntaxe est très similaire à celle du langage de template de Django.

Les templates permettent de séparer la logique de l'application (dans les vues) de la présentation (dans les templates). Cela rend le code plus clair, plus facile à maintenir et à tester.

Résumé : l'interaction entre modèles, vues et templates

Voici un résumé de l'interaction entre les modèles, les vues et les templates :

1. Un utilisateur fait une requête à votre application web (par exemple, il accède à une URL).
2. Le framework web (Django ou Flask) reçoit la requête et détermine quelle vue doit être appelée (en fonction de l'URL).
3. La vue est appelée. Elle contient la logique de l'application.
4. La vue interagit avec le(s) modèle(s) pour récupérer ou modifier les données (si nécessaire).
5. La vue prépare les données à afficher (par exemple, en les filtrant, en les triant, etc.).
6. La vue choisit un template et lui passe les données.
7. Le moteur de template génère le code HTML final en utilisant le template et les données.
8. La vue retourne la réponse HTTP (contenant le code HTML généré) au navigateur de l'utilisateur.

Ce modèle MVT/MVC permet de bien organiser votre code et de séparer les différentes préoccupations (données, logique, présentation).