s outenance s tage l3 info g uillaume a nsel création dun site internet dynamique avec le framework...
TRANSCRIPT
![Page 1: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/1.jpg)
SOUTENANCE STAGE L3 INFOGUILLAUME ANSEL
Création d’un site Internet dynamique avec le framework Django
![Page 2: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/2.jpg)
Plan
Guillaume Ansel
1. Introduction2. Présentation du sujet choisi3. Conception Générale4. Conception Détaillée5. Synthèse6. Conclusion
2
![Page 3: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/3.jpg)
1. INTRODUCTION
Guillaume Ansel3
![Page 4: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/4.jpg)
1. Introduction
Guillaume Ansel
Stage de Licence Informatique Durée : 10 semaines
Sujet : « Création d’un site Internet dynamique pour la société Studio Odyssée »
Entreprise d’accueil : Studio Odyssée
Encadrement : Virginie MARION-POTY
4
![Page 5: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/5.jpg)
2. PRÉSENTATION DU SUJET
Guillaume Ansel5
![Page 6: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/6.jpg)
2. Présentation du sujet
Guillaume Ansel
« Création d’un site Internet pour la société Studio Odyssée »
6
![Page 7: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/7.jpg)
2. Présentation du sujet
Guillaume Ansel7
Présentation des activités de la société Logiciel Internet Infographie Marketing & Communication
Site dynamique Contenu dynamique Espace client
![Page 8: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/8.jpg)
3. CONCEPTION GÉNÉRALE
Guillaume Ansel8
![Page 9: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/9.jpg)
3. Conception Générale3.1 Les outils
Guillaume Ansel9
Développement du site avec le langage Python Utilisation du framework web Django (pre-1.0) Gestion des sources avec Subversion
Codage des pages en XHTML 1.0 Mise en page avec les feuilles de style CSS (Cascading
Style Sheets)
![Page 10: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/10.jpg)
3. Conception Générale3.2 Le framework
Guillaume Ansel10
Le développement du site s’appuie sur l’utilisation du framework django.
Nombreux avantages : Inclus un ORM (Object-Relational Mapping) Interface d’administration générée automatiquement Gestion des URL propre Système de template puissant (Système de mise en cache) (Internationalisation)
![Page 11: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/11.jpg)
3. Conception Générale3.3 Le principe
Guillaume Ansel11
Conception proche du système MVC (Modèle Vue Contrôleur)
![Page 12: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/12.jpg)
3. Conception Générale3.3 Le principe
Guillaume Ansel12
Modèle Couche de données Encapsulées dans des objets grâce à l’ORM Abstraction par rapport au support de stockage Gestion des liaisons de type :
Un à Un Un à Plusieurs Plusieurs à Plusieurs
Gestion des contraintes d’intégrités Django créé la BDD à partir des modèles
![Page 13: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/13.jpg)
3. Conception Générale3.3 Le principe
Guillaume Ansel13
Vue Correspond à une page Web offrant un service spécifique Définit quelle données doit être affichées et renvoie une
réponse HTTP. Différente réponse HTTP selon les cas :
200: requête valide contenant la page demandée 403: requête non autorisée 404: la page demandée n’existe pas 500: erreur dans l’exécution du code de la vue D’autres type de réponses si besoin
![Page 14: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/14.jpg)
3. Conception Générale3.3 Le principe
Guillaume Ansel14
Contrôleur N’apparait pas explicitement du point de vue du
développeur Peut-être considéré comme étant le framework lui-même
Redirige les URL vers la vue correspondante Django utilise une interprétation différente du patron de
conception original MVC, plus proche des besoins des auteurs du framework.
![Page 15: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/15.jpg)
3. Conception Générale3.3 Le principe
Guillaume Ansel15
Template Présentation des données Langage de template puissant
Structure conditionnelle Boucle Héritage Filtres
Sortie en format texte HTML CSV Texte
![Page 16: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/16.jpg)
4. CONCEPTION DÉTAILLÉE
Guillaume Ansel16
![Page 17: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/17.jpg)
4. Conception Détaillée4.1 Les applications
Guillaume Ansel17
Projet vs Application Un projet regroupe un ensemble de fonctionnalités Les fonctionnalités peuvent être regroupées dans des
applications Une application peut-être partagée par plusieurs projets
différents
Nom du projet: studioodyssee
![Page 18: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/18.jpg)
4. Conception Détaillée4.1 Les applications
Guillaume Ansel18
Liste des applications
Index
Actualite
Projet
Membres
Contrib
![Page 19: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/19.jpg)
4. Conception Détaillée4.2 Diagramme de classe UML
Guillaume Ansel19
![Page 20: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/20.jpg)
4. Conception Détaillée4.3 Fonctionnement nominal
Guillaume Ansel20
Le visiteu
r envoie
une requêt
e
Lien FastCGI entre le serveur Web et process
us django
Le framework traite
la requête (session, identification, …)
Redirection
vers la vue
corresponda
nte
La vue réalise les opérations demandées• Charge les
données des modèles
• Traite les formulaires si besoin
• Renvoie une réponse HTTP
Réponse HTTP
(200, 403, 404, 500,
…) contenant
la page demandée par le visiteur
![Page 21: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/21.jpg)
4. Conception Détaillée4.4 Exemple
Guillaume Ansel21
class Billet(models.Model):titre = models.CharField(u’Titre’, max_length=128)contenu = models.TextField(u’Contenu’)contenu_html = models.TextField(editable=False)auteur = models.ForeignKey(User)publication_date = models.DateField(u’Date de publication’, auto_now_add=True)
def save(self):self.contenu_html = textile(self.contenu)super(Billet, self).save()
Modèle: Billet
![Page 22: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/22.jpg)
4. Conception Détaillée4.4 Exemple
Guillaume Ansel22
def liste_billet(request):try:
billets = Billet.objects.all().order_by(‘-publication_date’)except:
raise Http404return render_to_response(‘liste_billet.html’, {‘billets’:billets,}, \
context_instance = RequestContext(request))
Vue: liste_billet
![Page 23: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/23.jpg)
4. Conception Détaillée4.4 Exemple
Guillaume Ansel23
<!DOCTYPE html> <html lang="fr"> <head> <title>Studio Odyssée - Un Projet</title> </head> <body>
<div id="liste-billet">{% for billet in billets %}<h2>{{ billet.titre }}</h2><span class="auteur">{{ billet.auteur }}</span>{{ billet.contenu_html|safe }}
{% endfor %}</div></body>
</html>
Template: liste_billet.html
![Page 24: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/24.jpg)
4. Conception Détaillée4.4 Exemple
Guillaume Ansel24
<!DOCTYPE html> <html lang="fr"> <head> <title>Studio Odyssée - Un Projet</title> </head> <body>
<div id="liste-billet"><h2>Billet 1</h2><span class="auteur">Guillaume</span><p>contenu premier billet.</p><h2>Billet 2</h2><span class="auteur">Guillaume</span><p>contenu deuxième billet.</p>
</div></body>
</html>
Résultat:
![Page 25: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/25.jpg)
4. Conception Détaillée4.5 Déploiement
Guillaume Ansel25
En cours de développement Serveur web Python fournit par le framework Pas besoin de serveur Web dédié (Apache, LighTPD) Configuration automatique (d’après le fichier settings.py)
Interface sur 127.0.0.1:8000 par défaut Mais pas utilisable en production
![Page 26: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/26.jpg)
4. Conception Détaillée4.5 Déploiement
Guillaume Ansel26
En production Méthode recommandée : Apache + mod_python Django est compatible avec les protocoles WSGI (CGI,
FastCGI, SCGI)
Hébergement djangohosting.ch Mise en place du site sur un serveur Web LighTPD Interface FastCGI entre LighTPD et le processus django
![Page 27: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/27.jpg)
4. Conception Détaillée4.5 Déploiement
Guillaume Ansel27
En production
LighTPD Processus djangoFastCGI
socket
Requête HTTP
Réponse HTTP
![Page 28: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/28.jpg)
5. Synthèse
Guillaume Ansel28
![Page 29: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/29.jpg)
5. Synthèse
Guillaume Ansel29
Préparation Installation des composantsDéveloppement Découpage en applications Choix des URL Création des modèles de données Ecriture des vues Rédaction des templates associéesDéploiement Apache + mod_python LighTPD + FastCGI
![Page 30: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/30.jpg)
6. Conclusion
Guillaume Ansel30
![Page 31: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/31.jpg)
6. Conclusion
Guillaume Ansel31
Projet intéressant car s’inscrivant dans le cadre d’une création d’entreprise
Cadre de travail intéressant, participation active dans les choix techniques
Apprentissage d’un nouveau langage de programmation (Python)
Nouvelle technique de développement basé sur l’utilisation du framework django (DRY « Don’t Repeat Yourself »)
![Page 32: S OUTENANCE S TAGE L3 INFO G UILLAUME A NSEL Création dun site Internet dynamique avec le framework Django](https://reader035.vdocuments.site/reader035/viewer/2022070309/551d9d9f497959293b8ce22b/html5/thumbnails/32.jpg)
Questions ?
Guillaume Ansel32