Comment créer une application Web d’une seule page avec Flask

Ce didacticiel vous aidera à créer une application Web d’une seule page avec Flask. C’est l’un des frameworks Python Web les plus populaires. Il est considéré comme un micro-cadre, basé sur le fait de faire une seule tâche à la fois et de bien la faire. La puissance de Flask réside dans son extensibilité et son modèle d’extension est très puissant. Flask prend en charge de nombreuses fonctionnalités telles qu’un serveur de développement intégré, des tests unitaires et un mécanisme d’extension afin que nous puissions ajouter des fonctionnalités supplémentaires.

Il peut être utilisé pour créer n’importe quoi, d’une petite page statique à une application volumineuse et complexe. Dans ce blog, nous allons faire le tour de ce framework, de l’installation au rendu de votre première page. Nous verrons ce que vous pouvez utiliser sous le capot, y compris un bref aperçu de quelques autres packages qui aident à faire briller une application Flask.

Dans ce blog, nous allons faire le tour de ce framework, de l’installation au déploiement. Nous verrons ce que vous pouvez utiliser sous le capot, y compris un bref aperçu de quelques autres packages qui aident à faire briller une application Flask.

Pourquoi devriez-vous utiliser Flask ?

Comme je l’ai mentionné plus tôt, Flask fait bien une chose : créer des applications Web. Non seulement il le fait très bien, mais il est conçu pour offrir la meilleure expérience de développement. Il est construit sur Python3, ce qui contribue à rendre le développement fluide, et il a été conçu dès le départ pour prendre en charge de nombreuses extensions et faciliter l’intégration d’applications tierces. Il est relativement petit et la réutilisation du code est un gros plus. Comment fonctionne une application Flask ? Faisons une application Flask de base pour mieux comprendre cela.

Installation 

Installation de l’environnement virtuel

Remarque : Python et Pip doivent être installés sur votre machine pour suivre les étapes à venir.

Vous devez toujours utiliser un environnement virtuel pour gérer les dépendances de votre projet, à la fois en développement et en production. Si vous utilisez Python 3, il est déjà fourni avec le module venv pour créer des environnements virtuels. Pour créer un environnement virtuel, exécutez la commande suivante :

mkdir myproject
cd myproject
python3 -m venv venv

Maintenant, un environnement virtuel est installé sur votre machine Mais avant de commencer à travailler sur votre projet, activez l’environnement que vous venez de créer. Dans notre cas, il peut être démarré avec :

. venv/bin/activate

Ce préfixe, c’est-à-dire « (env) » écrit sur le côté gauche, indique que votre environnement virtuel est actuellement actif. Il peut également avoir un autre nom en fonction de la façon dont il a été nommé lors de la création.

Installation du flacon

Flask est disponible en Python 2 et 3 et est facile à installer. Beaucoup préfèrent l’approche pip pour l’installation des dépendances, en raison de sa facilité d’utilisation. Mais vous pouvez aussi faire un sudo apt-get install flask plutôt que de faire : sudo pip install flask pour installer Flask.

Flask peut être installé à l’aide de la commande suivante :

pip3 install flask

Flask devrait maintenant être installé avec succès sur votre machine.

Remarque : Certaines dépendances sont installées automatiquement lors de l’installation de Flask. Ceux-ci incluent Werkzeug : qui implémente WSGI, Jinja : qui rend les pages, et quelques autres. Ces dépendances sont nécessaires pour que toutes les fonctions de base de Flask fonctionnent correctement.

De plus, une fois l’installation terminée, vous pouvez exécuter la commande suivante pour confirmer que l’installation a été effectuée correctement et quelle version utilisez-vous :

python -c "import flask; print(flask.__version__)"

Création de votre premier programme Flask : Hello World !

Maintenant que vous avez installé Flask, il est temps de créer votre premier projet !

Créez un répertoire de projet en :

mkdir flask-tutorial  #You can name the folder anything you want
cd flask-tutorial

Une application Flask peut être aussi simple qu’un seul fichier, ici pour démontrer que nous allons créer un fichier nommé hello.py dans le dossier flask-tutorial.

from flask import Flask  #importing flask elements to make everything work
app = Flask(__name__)

@app.route("/")
def hello():
  return 'Hello World!'
if __name__ == '__main__':
  app.run(debug=True)

Ici, nous importons la fonction render_template Flask et rendons notre modèle HTML dans le chemin home (/).

Pour exécuter cette application simple, utilisez la commande ci-dessous dans le dossier spécifique que vous avez créé.

python3 Hello.py

Si la commande ci-dessus fonctionnait, vous verriez alors une réponse semblable à celle-ci :

* Serving Flask app 'hello' (lazy loading)
* Environment: production
* Debug mode: on
* Running on http://127.0.0.1:5000/
* Restarting with stat
* Debugger is active!
* Debugger PIN: 710-125-169

Maintenant, allez sur http://127.0.0.1:5000/ pour voir les résultats. Vous pouvez fermer le serveur en appuyant sur CTRL+C

Rendu des pages HTML avec Flask

Votre application actuelle n’utilise aucun fichier HTML. Les sites Web et les applications Web utilisent principalement HTML pour afficher des informations destinées au visiteur. C’est pourquoi nous allons maintenant voir comment incorporer des fichiers HTML dans votre projet, qui peuvent être affichés sur un navigateur Web.

Tout d’abord, dans votre répertoire flask-tutorial, créez des dossiers appelés static et templates. Dans le dossier des modèles, créez votre fichier index.html. Pour mettre en valeur ici, je vais juste mettre un élément h1 :

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <meta http-equiv="X-UA-Compatible" content="IE=edge">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    <title>Document</title></head><body>    <h1>You just rendered your first html page in Flask!</h1>  </body></html>

Maintenant, ouvrez votre fichier hello.py et apportez les modifications suivantes :

from flask import Flask, render_template
app = Flask(__name__)

@app.route("/")
def hello():
  return render_template ("index.html")
if __name__ == '__main__':
  app.run(debug=True)

Enregistrez ensuite le fichier, accédez à http://127.0.0.1:5000/ et actualisez. Vous devriez maintenant pouvoir y voir le contenu de votre fichier Html.

Impressionnant! Vous venez de rendre votre première page Html dans Flask !

Maintenant que vous construisez votre site à partir de maintenant, assurez-vous simplement que tous vos fichiers statiques (tels que vos bibliothèques/fichiers CSS et JavaScript) sont correctement configurés, vous devez placer ces fichiers dans une configuration de dossier « statique » qui nous avons créé précédemment, sauf si vous le remplacez spécifiquement lors de l’initialisation de Flask.

Forfaits Flacon

En plus de Flask lui-même, il existe un certain nombre d’autres packages qui peuvent être utilisés dans une application. Celui que vous voulez rechercher est le Flask-WebClient. Le package WebClient fournit une interface pratique pour interagir avec le serveur Web, écrire des URL et JSON. Lorsque vous interagissez avec le serveur Web, un objet client Web est créé. Dans Flask, cela se fait en instanciant une instance WebClient à partir d’une instance de flask_init(). Dans Flask, il n’est pas nécessaire d’accéder directement au serveur Web. Le WebClient fournit cette fonctionnalité à la place.

Derniers mots

C’était facile non ? Voici comment créer une application Web d’une seule page avec Flask. Une application Flask complète aura généralement besoin des éléments suivants : MySQL pour héberger la base de données Apache ou Nginx pour servir l’application, ou les deux, selon votre cas d’utilisation Contrôle de version pour gérer votre code et éviter les conflits de version Un CDN pour servir fichiers statiques Fragments et écouteurs pour écouter les requêtes HTTP Formulaires pour permettre l’utilisation de formulaires Web pour interagir avec le site. Un moteur de template pour rendre votre site plus attractif. Un utilitaire pour visualiser et modifier le contenu de la base de données, du panneau d’administration… et bien plus encore… Ceci n’est qu’un exemple de liste de ce qui peut être installé avec très peu d’effort.

Voici quelques tutoriels utiles que vous pouvez lire :

Spread the love
 
   

Laisser un commentaire