Tutorial : création application web flask
Etape 1 : création d’ un environnement virtuel pour un projet Flask :
1. Installer virtualenv:
pip install virtualenv
2. Créer un environnement virtuel : À l'intérieur du répertoire du projet, exécutez la
commande suivante pour créer un nouvel environnement virtuel:
virtualenv venv
3. Activer l'environnement virtuel : Sur Windows
venv\Scripts\activate
4. Installer flask dans l'environnement virtuel : Une fois l'environnement virtuel activé,
vous pouvez installer flask à l'intérieur de cet environnement.
pip install flask
Pour quitter l'environnement virtuel, utilisez la commande :
Deactivate
Etape 2 : création d’ une application flask :
1. Créer un fichier Python pour l'application :
3) Lancer l'application :
python [Link]
from flask import Flask
# Crée une instance de l'application Flask
app = Flask(__name__) #Crée une instance de l'application Flask
# Définir une route pour l'URL racine "/"
@[Link]('/') # associer l'URL / à la fonction accueil()
def accueil():
return "Bonjour, le monde !"
# Lancer l'application
if __name__ == '__main__':
[Link](debug=True) # Lance l'application en mode débogage pour voir les erreurs
4) Ajouter des templates HTML :
<!DOCTYPE html>
<html>
<head>
<title>Ma Première App Flask</title>
</head>
<body>
<h1>Bonjour, le monde depuis Flask !</h1>
</body>
</html>
5) Modifier [Link] pour rendre ce template HTML :
from flask import Flask, render_template
app = Flask(__name__) #Crée une instance de l'application Flask
@[Link]('/') # associer l'URL / à la fonction accueil()
def home():
return render_template('[Link]')
if __name__ == '__main__':
[Link](debug=True, port=5001)# Lance l'application en mode débogage pour voir les erreurs
Etape 3 : création d’ une application simple flask : CRUD (Créer, Lire, Mettre à
jour, Supprimer)
1) Installer les dépendances :
SQLAlchemy : Object Relational Mapping pour faciliter les opérations sur la base de
données.
pip install flask flask_sqlalchemy
2) Structure du projet :
[Link] : Contient le code de l'application Flask.
templates/ : Contient les fichiers HTML pour afficher l'interface utilisateur.
[Link] : Définition du modèle de la base de données (optionnel).
from flask import Flask, render_template, request, redirect, url_for
from flask_sqlalchemy import SQLAlchemy
app = Flask(__name__)
[Link]['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///[Link]' # l'URL de la base de
#données SQLite
[Link]['SQLALCHEMY_TRACK_MODIFICATIONS'] = False
db = SQLAlchemy(app)
# Définition du modèle
class Item([Link]):
id = [Link]([Link], primary_key=True)
name = [Link]([Link](100), nullable=False)
# Créer la base de données
with app.app_context():
db.create_all()
# Route pour lire tous les éléments
@[Link]('/')
def index():
items = [Link]()
return render_template('[Link]', items=items)
# Route pour créer un nouvel élément
@[Link]('/create', methods=['GET', 'POST'])
def create():
if [Link] == 'POST':
name = [Link]['name']
new_item = Item(name=name)
[Link](new_item)
[Link]()
return redirect(url_for('index'))
return render_template('[Link]')
# Route pour mettre à jour un élément
@[Link]('/update/<int:id>', methods=['GET', 'POST'])
def update(id):
item = [Link](id)
if [Link] == 'POST':
[Link] = [Link]['name']
[Link]()
return redirect(url_for('index'))
return render_template('[Link]', item=item)
# Route pour supprimer un élément
@[Link]('/delete/<int:id>')
def delete(id):
item = [Link](id)
[Link](item)
[Link]()
return redirect(url_for('index'))
if __name__ == '__main__':
[Link](debug=True)
3) Créer les templates HTML :
Template [Link] :
<!DOCTYPE html>
<html>
<head>
<title>CRUD avec Flask</title>
</head>
<body>
<h1>Liste des éléments</h1>
<a href="{{ url_for('create') }}">Créer un nouvel élément</a>
<ul>
{% for item in items %}
<li>
{{ [Link] }}
<a href="{{ url_for('update', id=[Link]) }}">Modifier</a>
<a href="{{ url_for('delete', id=[Link]) }}">Supprimer</a>
</li>
{% endfor %}
</ul>
</body>
</html>
Template [Link] :
<!DOCTYPE html>
<html>
<head>
<title>Créer un élément</title>
</head>
<body>
<h1>Créer un nouvel élément</h1>
<form method="POST">
<input type="text" name="name" required>
<button type="submit">Créer</button>
</form>
<a href="{{ url_for('index') }}">Retour</a>
</body>
</html>
Template modifier
<!DOCTYPE html>
<html>
<head>
<title>Modifier un élément</title>
</head>
<body>
<h1>Modifier l'élément</h1>
<form method="POST">
<input type="text" name="name" value="{{ [Link] }}" required>
<button type="submit">Mettre à jour</button>
</form>
<a href="{{ url_for('index') }}">Retour</a>
</body>
</html>