la programmation

Maîtriser les Templates Flask

Les templates, ou modèles, sont une composante essentielle du framework Flask, qui est largement utilisé pour développer des applications web en Python. Les templates permettent de séparer la logique de présentation du code Python, ce qui rend le développement web plus organisé et plus maintenable. Dans cet article, nous allons explorer en profondeur les bases des templates dans Flask.

Articles similaires

Qu’est-ce qu’un Template dans Flask ?

Un template dans Flask est un fichier HTML qui inclut des balises spéciales qui sont remplacées par des valeurs dynamiques lors de la génération de la page web. Ces valeurs dynamiques sont généralement fournies par le code Python de l’application Flask. Les templates permettent de créer des pages web dynamiques en insérant des données spécifiques dans des emplacements prédéfinis.

Structure d’un Template Flask

Un template Flask suit généralement une structure HTML de base avec l’ajout de balises spéciales appelées « balises Jinja ». Jinja est un moteur de template utilisé par Flask pour le rendu des templates. Voici un exemple simple de structure de template Flask :

html
html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{ title }}title>
head>
<body>
    <h1>{{ heading }}h1>
    <p>{{ content }}p>
body>
html>

Dans cet exemple, les balises {{ }} indiquent les endroits où les données dynamiques seront insérées. Par exemple, {{ title }}, {{ heading }}, et {{ content }} seront remplacés par les valeurs correspondantes fournies par l’application Flask.

Utilisation des Templates dans Flask

Pour utiliser un template dans une application Flask, il faut d’abord définir un répertoire dans lequel seront stockés les templates. Par convention, ce répertoire est nommé templates et est situé dans le répertoire racine de l’application Flask. Ensuite, on peut rendre un template à l’aide de la fonction render_template fournie par Flask. Voici un exemple de code Python illustrant l’utilisation d’un template dans une application Flask :

python
from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def index():
    return render_template('index.html', title='Page d\'accueil', heading='Bienvenue', content='Ceci est le contenu de la page d\'accueil.')

if __name__ == '__main__':
    app.run(debug=True)

Dans cet exemple, la fonction render_template est utilisée pour rendre le template index.html avec les valeurs spécifiées pour title, heading, et content.

Passer des Données aux Templates

Pour passer des données d’une vue Python à un template, on peut simplement fournir ces données en tant qu’arguments à la fonction render_template. Ces données peuvent être de divers types, tels que des chaînes de caractères, des nombres, des listes ou même des objets plus complexes. Par exemple :

python
@app.route('/')
def index():
    user = {'username': 'John', 'email': '[email protected]'}
    return render_template('index.html', user=user)

Dans le template correspondant, on peut accéder aux valeurs associées à user à l’aide des balises Jinja, comme ceci :

html
html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Welcome, {{ user.username }}title>
head>
<body>
    <h1>Welcome, {{ user.username }}h1>
    <p>Email: {{ user.email }}p>
body>
html>

Contrôle de Flux et Structures de Contrôle

Les templates Jinja permettent également l’utilisation de structures de contrôle, telles que les boucles et les conditions, pour rendre les pages web de manière dynamique en fonction des données fournies. Voici un exemple de boucle dans un template Jinja :

html
<ul>
    {% for item in items %}
        <li>{{ item }}li>
    {% endfor %}
ul>

Dans cet exemple, la boucle for itère sur chaque élément de la liste items et le rend à l’intérieur d’une balise

  • .

    Conclusion

    En conclusion, les templates sont une composante essentielle du framework Flask pour le développement d’applications web en Python. Ils permettent de séparer la logique de présentation du code Python, rendant ainsi le développement web plus structuré et plus facile à maintenir. Grâce à Jinja, les templates dans Flask offrent une grande flexibilité pour rendre les pages web de manière dynamique en insérant des données spécifiques aux emplacements appropriés. En comprenant les bases des templates dans Flask, les développeurs peuvent créer des applications web puissantes et élégantes.

    • Plus de connaissances

    Bien sûr, plongeons davantage dans les détails sur l’utilisation avancée des templates dans Flask.

    Héritage de Templates

    L’un des concepts clés dans Flask est l’héritage de templates, qui permet de réutiliser le code HTML commun à travers différentes pages de votre application web. Avec l’héritage de templates, vous pouvez définir un template de base contenant la structure générale de votre site, puis créer des templates enfants qui étendent ce template de base et ajoutent leur propre contenu spécifique. Voici comment cela fonctionne :

    Template de base (base.html) :

    html
    html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}{% endblock %}title>
head>
<body>
    <div id="sidebar">
        
    div>
    <div id="content">
        {% block content %}{% endblock %}
    div>
body>
html>

    Template enfant :

    html
    {% extends "base.html" %}

{% block title %}Page d'accueil{% endblock %}

{% block content %}
    <h1>Bienvenue sur notre site!h1>
    
{% endblock %}

    Dans cet exemple, le template enfant étend le template de base en utilisant la directive {% extends "base.html" %}. Les blocs {% block %} sont ensuite remplis avec du contenu spécifique à la page.

    Inclusion de Templates

    Une autre fonctionnalité utile des templates Flask est l’inclusion de templates, qui vous permet de réutiliser des parties de code HTML sur plusieurs pages sans avoir à les copier-coller. Vous pouvez créer des templates pour des éléments communs tels que des en-têtes, des pieds de page ou des barres de navigation, puis les inclure dans d’autres templates selon vos besoins. Voici un exemple :

    Template pour l’en-tête (header.html) :

    html
    <header>
    <h1>Mon Site Webh1>
    
header>

    Template pour le pied de page (footer.html) :

    html
    <footer>
    
    <p>© 2024 Mon Site Webp>
footer>

    Template principal (main.html) :

    html
    html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{ title }}title>
head>
<body>
    {% include "header.html" %}
    
    
    <h1>{{ heading }}h1>
    <p>{{ content }}p>

    {% include "footer.html" %}
body>
html>

    Dans cet exemple, les templates d’en-tête et de pied de page sont inclus dans le template principal à l’aide de la directive {% include %}.

    Utilisation de Fichiers Statiques

    Flask permet également de servir des fichiers statiques tels que des feuilles de style CSS, des scripts JavaScript et des images, ce qui est essentiel pour le développement d’interfaces utilisateur riches et attrayantes. Pour servir des fichiers statiques, vous devez simplement placer ces fichiers dans un répertoire appelé static à la racine de votre application Flask, puis référencer ces fichiers dans vos templates HTML. Voici un exemple :

    Structure du répertoire de l’application :

    arduino
    myapp/
    app.py
    templates/
        index.html
    static/
        css/
            style.css
        js/
            script.js
        img/
            logo.png

    Dans le template HTML, vous pouvez référencer ces fichiers statiques de la manière suivante :

    html
    html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Mon Site Webtitle>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
head>
<body>
    <h1>Bienvenue sur Mon Site Webh1>
    <img src="{{ url_for('static', filename='img/logo.png') }}" alt="Logo">
    <script src="{{ url_for('static', filename='js/script.js') }}">script>
body>
html>

    Dans cet exemple, la fonction url_for('static', filename='...') est utilisée pour générer les URL des fichiers statiques, ce qui garantit que les chemins sont correctement résolus même si l’application est déployée dans un sous-répertoire.

    Conclusion

    Les templates jouent un rôle crucial dans le développement d’applications web avec Flask. En utilisant des techniques telles que l’héritage de templates, l’inclusion de templates et la gestion des fichiers statiques, vous pouvez créer des interfaces utilisateur dynamiques et attrayantes tout en maintenant une structure de code propre et organisée. En comprenant pleinement ces fonctionnalités, vous serez en mesure de développer des applications web Flask robustes et conviviales.

    Bouton retour en haut de la page