Framework Python – Django – Partie 1

OUTILS DE DÉVELOPPEMENT – AGENDA

FRAMEWORK PYTHON
Les structures de contrôles, les collections et les classes python dans les Framework python, l’accès
▪ Introduction: Rappel sur les notions de base
aux données, la gestion des vues, la création des Template et des formulaires. ▪ Partie 1: Le Framework Django
▪ Partie 2: Les URLs et les vues
1) Elément du langage python ▪ Partie 3: L’accès aux données et les ORM
▪ Partie 4: Gestion des vues
2) L’accès aux données et les ORM
▪ Partie 5: Template
3) Gestion des vues et les Template ▪ Partie 6: Les formulaires
▪ Soumission du projet : 75% de la note finale
4) Gestion des formulaires ▪ Examen final : 25% de la note finale
1

2
PR. AZROUMAHLI CHAIMAE

PARTIE 1: LE FRAMEWORK DJANGO 1) PRÉSENTATION DU FRAMEWORK DJANGO

❑ Django est Framework libre et open source pour le création et le
SÉANCE 4 développement des applications Web avec Python.

1.1. Alternatives:
1) Présentation du Framework Django En Python les alternatives sont notamment :
2) Composants du Framework Django ▪ Flask (microframework avec Jinja2 pour les templates et SQLAlchemy pour ORM)
▪ Pyramid
3) Préparation et environnement du serveur
▪ Tornado (orienté programmation asynchrone et Web Sockets)
4) Versionnage GIT ▪ FastAPI pour construire rapidement une API en Python
5) Application Web avec le Framework Django ▪ Falcon
▪ ..
1.2. Application créer avec Django :
✓ Youtube, Spotify, Instagram, DropBox, ….
3
4

Framework Python - 1
Framework Python – Django – Partie 1

1) PRÉSENTATION DU FRAMEWORK DJANGO 1) PRÉSENTATION DU FRAMEWORK DJANGO

1.3. Caractéristiques et fonctionnalités: 1.4. Framework Web généraliste :
❑ Interface Admin
❑ Framework Web de référence Django offre :
❑ ORM (Object Relational Mapper) ▪ MVT : Modèle Vue Template
❑ Les Templates ▪ Système de Templates
❑ Migrations (intégrées tardivement, l’un des meilleurs système de migrations existant) ▪ ORM: Object Relational Mapper
❑ Formulaires, Vues génériques (comme SQLAlchemy ou Doctrine)

❑ Authentification ▪ Serveur Web intégré

❑ Gestion complète des exceptions ▪ Interface d’Admin complète,
souple et extensible
❑ Bonne documentation

5 6

PARTIE 1: LE FRAMEWORK DJANGO 2) COMPOSANTS DU FRAMEWORK DJANGO

 Structure d’une application Web standard : ▪ Traitement des données
SÉANCE 4 ▪ Gestion des rôles
Front End Back End ▪ …
Serveur client Serveur Web
1) Présentation du Framework Django Request
2) Composants du Framework Django
3) Préparation et environnement du serveur Response

4) Versionnage GIT HTTP

HyperText Transfer Protocol
5) Application Web avec le Framework Django
Page Web
Image /vidéo Générer une Page Web avec le HTML

PDF Générer les données demandée par

l’utilisateur: le client affiche
7 le résultat (React, Vue, …)
8

Framework Python - 2
Framework Python – Django – Partie 1

2) COMPOSANTS DU FRAMEWORK DJANGO PARTIE 1: LE FRAMEWORK DJANGO

 Structure d’une application Web standard :
Back End Un ensemble de end points (des API a consommer)
SÉANCE 4
Serveur Web
/demandes
1) Présentation du Framework Django
/stockages Liste des API 2) Composants du Framework Django
3) Préparation et environnement du serveur
Response
HTTP
HyperText Transfer Protocol /clients
▪ Angular 4) Versionnage GIT
▪ React 5) Application Web avec le Framework Django
▪ Vue JS
▪ Pure JavaScript
▪ …

10
9

3) PRÉPARATION ET ENVIRONNEMENT DU
SERVEUR PARTIE 1: LE FRAMEWORK DJANGO
✓ L’environnement de développement Python:

1 Interpréteur Python
SÉANCE 4
[Link]

2 Editeur (IDE): VS Code, PyCharm, Vim, Brackets, Sublime, ….

1) Présentation du Framework Django
2) Composants du Framework Django
Microsoft Visual Code: [Link]
3) Préparation et environnement du serveur
✓ Les dépendances et les système de gestion de version : 4) Versionnage GIT
3 L’outil pip: Système de gestion des paquets 5) Application Web avec le Framework Django

4 Système décentralisés: GitHub

[Link] 12
11

Framework Python - 3
Framework Python – Django – Partie 1

4) VERSIONNAGE GIT 4) VERSIONNAGE GIT

4.1. Justification du besoin : 4.2. Workflow des distribution:
❑ Conserver l’historique des modifications apportées chaque jour: Main Feature Develop Release HotFix
 et revenir en arrière en cas de besoin ▪ Main : master
❑ Partager le développement entre plusieurs personnes. V 0.0 V 1.1 V 1.2 V 2.0 ▪ Develop
 Permettre un accès partagé au système de fichiers versionné. (developpement)
 Permettre un accès distant depuis diverses plateformes. ▪ Feature (nouvelle
❑ Retrouver rapidement l’origine d’un Bug en cas de régression. version)
▪ Release (production)
 plusieurs versions peuvent coexister ( branches de développement,
▪ HotFix (Traitement des
branches beta, branches production )
Comment gérer des mini bug)
distributions ?  Utiliser de l’intégration continue (Github, Jenkins, etc.)

 Introduire des vérifications, tests, production d’artefacts lors d’une

mise à jour d’un dépôt. 13 14

4) VERSIONNAGE GIT 4) VERSIONNAGE GIT

4.3. Les logiciels de gestion de version : 4.4. Les systèmes décentralisés de versionnage:
Les logiciel de gestion des versions permet de: Exemple des logiciel de versionnage:
 Agit sur une arborescence de fichiers ▪ Bazaar
 Permet de mutualiser un développement ▪ Mercurial
 Permet de stocker toute évolution du code source ▪ Git
 Ajoute une nouvelle dimension au système de fichiers: le temps
 Les avantages des systèmes décentralisés :
 Deux modèles des
logiciel de versionnage: Centralisé Décentralisés ▪ Un système ne dépendant pas d’une seule machine.
▪ Travailler sans connexion.
▪ Un seul dépôt de référence ▪ Plusieurs dépôts pour un ▪ Participation “progressive” à un projet:
▪ Besoin d’un serveur même logiciel
 Accès au code
▪ Besoin de synchronisation ▪ Chacun peut travailler à son
rythme de façon synchronisée  Contribution proposée
▪ Conflits plus fréquents …
ou pas des autres  Contributeur “actif” si acceptée
15 16

Framework Python - 4
Framework Python – Django – Partie 1

4) VERSIONNAGE GIT 4) VERSIONNAGE GIT

4.5. Les composants d’un logiciel de versionnage : (1/2) 4.5. Les composants d’un logiciel de versionnage : (2/2)
 Dépôt:  Branches :  Le Checkout :  Commit :
Un dépôt apparaît de l’extérieur comme un Consiste à récupérer pour la première fois Mis à jour la copie locale (puis si on veut, le dépôt).
un développement « secondaire » est mis en
système de fichiers composé de répertoires route pour une nouvelle fonctionnalité, …, bugs, … les fichiers déjà existant au sein d’un ▪ Une nouvelle révision est alors créée
au sein desquels on peut naviguer, lire et écrire projet du dépôt. ▪ il faut que la copie de travail corresponde à la
selon les permissions dont on dispose.  Master : ▪ Le résultat est une copie de travail dernière version du dépôt.
Version principale à partir d’elle, on peut créer des ▪ Sous git cela consiste aussi à choisir
 Dépôt de référence: sa branche de travail
branches.  update (pull) :
Dépôt contenant les versions livrées d’un projet L’update synchronise la copie de travail locale avec
- Un dépôt est un emplacement central où  Merge :
 Destin d’une branche: le dépôt en récupérant la dernière version des
sont stockées : Fusion de branches entre elles fichiers du dépôt:
Une branche peut soit être à nouveau fusionnée Fusion d’une branche avec le master (main)
▪ l’historique des versions des fichiers ▪ C’est à cette occasion peuvent apparaître les
dans le « master » soit disparaître soit donner lieu
▪ les logs, les dates, auteurs, tags, etc à un nouveau programme. conflits de version

17 18

4) VERSIONNAGE GIT 4) VERSIONNAGE GIT

4.6. La procédure de versionnage Git : 4.7. Versionnage des dépendances avec Git : (1/4)
1) La configuration Git :
Local (Disk) Remote (Cloud)
$ git config --global [Link] "FirstName LastName"
$ git config --global [Link] "email@[Link]"
Working Directory Staging Area Local git Repo Remote git repo $ git config --global [Link] true
$ git config --global [Link] vscode
Git add
$ git config --list
Git commit
Git push
2) Initialiser un répertoire local Git :
Git pull $ git init
$ git status
Git checkout

Git merge
19 20

Framework Python - 5
Framework Python – Django – Partie 1

4) VERSIONNAGE GIT 4) VERSIONNAGE GIT

4.7. Les commandes Git : (2/4) 4.7. Les commandes Git : (3/4)
3) Les fichiers mis en scène « staging »: 4) Les fusion « commits »:
$ git add --global <file-name> $ git commit -m "First Commit" # Fusion d’un projet avec un message
$ git add --global <file-name1> <file-name2> <file-name3> <file-name4> $ git reset --soft <commit> # annule toutes modifications apportées après ce commit
$ git add . # les nouveaux fichiers et les modifications, sans suppressions. $ git log # L’historique des commits
$ git add –u # Modifications et suppressions, sans les nouveaux fichiers
5) Pull et push a partir d’un répertoire distant:
$ git add --all # git add . && git add –u → Mis à jour tous les changements
$ git add –A # équivalente à l’option –all sur les nouvelle versions Git $ git remote add origin « link » # ajouter une association « origin »
$ git push -u origin master # M-à-j les références distantes avec l’association
$ git rm --cashed <file-name> # supprimer des fichiers du git local.
#--cached supprime le fichier de référentiel git. $ git clone « clone » # équivalente à l’option
$ git pull # Récupérer et intégrer à un autre référentiel ou à une
$ git reset <file-name> # Annuler les modifications locales apportées à branche locale
l'état d'un référentiel Git
21 22

4) VERSIONNAGE GIT PARTIE 1: LE FRAMEWORK DJANGO

4.7. Les commandes Git : (4/4)
6) Créer et utiliser une branche :
SÉANCE 4
$ git branch branch_name # crée une nouvelle branche
$ git checkout branch_name # utiliser la branche 1) Présentation du Framework Django
$ git merge branch_name #fusionner la branche actuelle avec la branche branch_name 2) Composants du Framework Django
3) Préparation et environnement du serveur
4) Versionnage GIT
5) Application Web avec le Framework Django

24
23

Framework Python - 6
Framework Python – Django – Partie 1

5) APPLICATION WEB AVEC LE FRAMEWORK 5) APPLICATION WEB AVEC LE FRAMEWORK

DJANGO DJANGO
5.1. Architecture d’une application Web Django: (1/2) 5.1. Architecture d’une application Web Django: (2/2)
La logique ✓ Simplification de l’architecture :
Demande de Vue Template
l'utilisateur logique personnalisée Données de contexte
l'utilisateur fait une et connexion aux passées de la vue au html Model Template
Template
demande en cliquant sur modèles et Template.
Whole Input By
l'URL de son navigateur Logical Data Presentation
VIEW Strcture
Data user
Layer

Résolution
Model Select, Design,
Update, Delete
View Data to
display
ORM

URL
d'URL Model Data
L'URL est résolue et Données obtenues à partir formatting
correspond à une VUE. d'une base de données
25 26

5) APPLICATION WEB AVEC LE FRAMEWORK 5) APPLICATION WEB AVEC LE FRAMEWORK

DJANGO DJANGO
5.3. Structure fichier d’un projet Django : (1/3) 5.3. Structure fichier d’un projet Django : (2/3)
Project_name Project_name
❑ __init__.py définit que ce dossier un package complet: ❑ Migrations les migrations utiliser pour générer les tables
▪ Vide par défauts de la base de données.
▪ L'implication de ce fichier en fait un projet python Venv Project_name Apps ❑ [Link] utilisé pour enregistrer les modèles Django dans
Venv Project_name ❑ [Link] détermine les propriétés de l’application: l'administration Django.
▪ Utilisé pour ajouter toutes les applications et ❑ [Link] utilisé pour aider l'utilisateur à inclure la
App_1 migrations
applications middleware au projet. configuration de l'application pour son application.
__init__.py [Link]
❑ [Link] définit les URLs utiliser par l’application: [Link] ❑ __init.py représente que le répertoire de l'application est
▪ Il contient tous les points de terminaison que nous App_2 un package complet
[Link] [Link] ❑ [Link] les modèles d'applications web sous forme de
devrions avoir pour notre site Web.
❑ [Link] et [Link] utiliser pour le déploiement: __init__.py classes et méthodes.
[Link] ▪ Asynchronous Server Gateway Interface. ❑ [Link] code de test pour l’applications Web
App_n [Link]
▪ Web Server Gateway Interface ❑ [Link] fournir une interface à travers laquelle un
[Link] / [Link] ❑ [Link] l’équivalent de django-admin [Link] utilisateur interagit avec une application web Django.
▪ Toutes les vues sont sous forme de classes et méthodes.
27 [Link] 28

Framework Python - 7
Framework Python – Django – Partie 1

5) APPLICATION WEB AVEC LE FRAMEWORK 5) APPLICATION WEB AVEC LE FRAMEWORK

DJANGO DJANGO
5.3. Structure fichier d’un projet Django : (3/3) 5.2. Création d’un projet et application Django : (1/8)
Project_name 1) Installation et configuration du pip :
▪ curl [Link] -o [Link]
Venv Project_name Template ❑ Template Données de contexte passées de ▪ py [Link]
Apps
la vue au html. ▪ Pip help || pip -- version

❑ Static un dossier contenant les fichiers 2) La dépendance de l’environnement virtuel pipenv :

Static statique utiliser par les Templates
▪ Pip install pipenv Si vous préférer travailler avec venv:
❑ Media les médias afficher dans le contexte
de le Template 3) Installation du Django à l’aide de pipenv : ▪ python -m venv myproject
Media ▪ myproject\Scripts\[Link]
▪ Pipenv install Django ▪ py -m pip install Django

4) Vérification de l’installation :

▪ django-admin --version
29 30

5) APPLICATION WEB AVEC LE FRAMEWORK 5) APPLICATION WEB AVEC LE FRAMEWORK

DJANGO DJANGO
5.2. Création d’un projet et application Django : (2/8) 5.2. Création d’un projet et application Django : (3/8)
5) Activer l’environnement virtuel : 8) Créer une application du projet : |projectName
▪ Pipenv shell ▪ Py [Link] startapp applicationName |projectName
| projectName/
|projectName |
| projectName/
|projectName/ ▪ Ajouter le nom de l’application dans le fichier |
| applicationName/
6) Créer un projet Django : | |  __init__.py [Link] –(paramètres du projet) dans le dossier | applicationName/
| | migrations/
▪ Django-admin #verifier les commandes | |  [Link] projectName | |
| migrations/
|__init__.py
| |  [Link] | |
| |__init__.py
__init__.py
▪ Django-admin startproject projectName
| |  [Link]  projectName/[Link] | __init__.py
| [Link]
| |  [Link] … | | [Link]
[Link]
7) Exécuter le projet sur un serveur : | | [Link]
| [Link]
INSTALLED_APPS = [
▪ Py [Link] runserver |[Link] …. | [Link]
| [Link]
‘applicationName’ | | [Link]
[Link]
] | [Link]
| [Link]
… |
| [Link]
31 32

Framework Python - 8
Framework Python – Django – Partie 1

5) APPLICATION WEB AVEC LE FRAMEWORK 5) APPLICATION WEB AVEC LE FRAMEWORK

DJANGO DJANGO
5.2. Création d’un projet et application Django : (4/8) 5.2. Création d’un projet et application Django : (5/8)
9) Créer la première VIEW: 10) Associer VIEW à une URL: (1/2)
|projectName |projectName
▪ Dans le fichier applicationName/[Link] on ajoute | projectName/ ▪ Créer le fichier applicationName/[Link] | projectName/
les modèles à utiliser:
| ▪ Ajouter le chemin de la méthode aux ensembles d’URL de |
▪ Obtenir du data de la base de données
| applicationName/ l’application | applicationName/
| | migrations/ | | migrations/
▪ Traitement de données
| | |__init__.py Exemple: | | |__init__.py
▪ …
| | __init__.py from [Link] import path | | __init__.py
Exemple: | | [Link] from . import views | | [Link]
| | [Link] | | [Link]
from [Link] import HttpResponse | | [Link] | | [Link]
urlpatterns=[
| | [Link] path('hello/',[Link]) | | [Link]
def hello(request): | | [Link] | | [Link]
return HttpResponse('hello world') ]
| | [Link] | | [Link]
| |
| [Link] | [Link]
33 34

5) APPLICATION WEB AVEC LE FRAMEWORK 5) APPLICATION WEB AVEC LE FRAMEWORK

DJANGO DJANGO
5.2. Création d’un projet et application Django : (6/8) 5.2. Création d’un projet et application Django : (7/8)
10) Associer VIEW à une URL: (2/2) 11) Création d’une Template :
|projectName |projectName
▪ Créer le fichier applicationName/[Link] | projectName/ ▪ Créer un répertoires: applicationName/template | projectName/
▪ Ajouter le chemin de la méthode aux ensembles d’URL de | ▪ Créer un fichier html: template/[Link] |
l’application. | applicationName/ | applicationName/
▪ Ajouter les chemins des URL de l’app aux ensemble d’URL du | | migrations/ | | migrations/
Exemple:
projet. | | |__init__.py …. | | templates/
| | __init__.py <body> | | |[Link]
Exemple:
| | [Link] <h1>premier projet Django</h1> | [Link]
from [Link] import path,include | | [Link] </body>
| | [Link] …
urlpatterns = [ | | [Link]
… | | [Link]
path('django_demo1_app1/’, | | [Link]
include('django_demo1_app1.urls')) |
] | [Link]
35 36

Framework Python - 9
Framework Python – Django – Partie 1

5) APPLICATION WEB AVEC LE FRAMEWORK

DJANGO PARTIE 1: LE FRAMEWORK DJANGO
5.2. Création d’un projet et application Django : (8/8)
11) Création d’une Template :
SÉANCE 4
|projectName
▪ Créer un répertoires: applicationName/template | projectName/
▪ Créer un fichier html: template/[Link]
▪ Ouvrir la vue applicationName/[Link] et modifier le
|
| applicationName/ 1) Présentation du Framework Django
retour de la méthode | | migrations/ 2) Composants du Framework Django
3) Préparation et environnement du serveur
| | templates/
Exemple: from [Link] import loader
| | |[Link]
def index(request):
| [Link] 4) Versionnage GIT
template = loader.get_template('[Link]') 5) Application Web avec le Framework Django
 Démonstration 1:
return HttpResponse([Link]())

Ou: from [Link] import render ▪ Se familiariser avec un Projet Django

def index(request): ▪ Le Versionnage des dépendances 38
return render(request,'[Link]')
37

PARTIE 1: LE FRAMEWORK DJANGO PARTIE 1: LE FRAMEWORK DJANGO

SÉANCE 4: DÉMONSTRATION
SÉANCE 4: TRAVAUX PRATIQUE
DÉMO 1: Première Application Web avec [Link] Core
▪ Tache 1 : Préparation de l’environnement de développement
▪ Tache 2 : Installation Django et environnement virtuel TP 4: Premier projet et application Django
▪ Tache 3 : Se familiariser avec les différents composants du Framework
▪ Tache 4 : Versionnage des dépendance « requirements »
▪ Tache 5 : Activer une VENV et Création d’un projet Django
▪ Tache 6,7 : l’IDE et Création de la première application du projet
▪ Tache 8 : La première vue et URL de l’application

39 40

Framework Python - 10