Remerciez-le!

Remerciez @Admin pour avoir partagé cet document gratuitement, de la manière la plus simple, en partageant sur les réseaux sociaux.

CHAPITRE 1 TP 1 09/04/2013 L’objet de ce TP est la découverte du framework web

CHAPITRE 1 TP 1 09/04/2013 L’objet de ce TP est la découverte du framework web Django et la familiarisation avec ses concepts de base. L’accent est mis sur l’aptitude à conﬁgurer son environnement de travail sous UNIX et à créer rapidement une application web fonctionnelle à l’aide du framework. Documents : – Cours : http ://sif.info-ufr.univ-montp2.fr/mmonnerville/django/cours/django.html – Énoncé du TP : http ://sif.info-ufr.univ-montp2.fr/mmonnerville/django/tps/html/index.html – Documentation ofﬁcielle : https ://docs.djangoproject.com Contact cours/TPs : Mathias Monnerville, mathias.monnerville@univ-montp2.fr 1.1 Préparation de l’environnement L’installation de Django va se faire localement dans votre répertoire utilisateur $HOME. Cela per- met d’installer facilement et à tout moment la dernière version du framework. 1. Lancer le script tpinit.sh qui positionne les variables d’environnement et garantit l’uti- lisation d’une version de Python compatible avec Django : $ /net/local/django/tpinit.sh Ce script crée un répertoire $HOME/local et un lien symbolique vers Python 2.7. Il modiﬁe votre $PATH aﬁn que l’éxécution de la commande python dans le terminal lance la version 2.7. Pour que les changements soient pris en compte immédiatement, se déconnecter en fermant sa session ou bien forcer la prise en compte de la nouvelle conﬁguration dans le terminal courant avec : $ source ~/.bash_profile 2. Créer un répertoire django qui comprendra le code source des projets étudiés en scéance de TP : i $ mkdir ~/django && cd ~/django puis récupérer et décompresser l’archive de la version Django 1.5.1 : $ cp /net/local/django/Django-1.5.1.tar.gz . $ tar xzf Django-1.5.1.tar.gz $ cd Django-1.5.1 Installer Django dans son répertoire $HOME/local avec la commande : $ python setup.py install --prefix=~/local $ cd ~/django Enﬁn, vériﬁer que Django est correctement installé en récupérant son numéro de version : $ python -c "import django; print django.get_version()" 1.5.1 1.2 Hello, world ! 1. Créer le projet hello : $ django-admin.py startproject hello $ cd hello 2. Lister le contenu du répertoire avec la commande tree : +-- hello | +-- __init__.py | +-- settings.py | +-- urls.py | +-- wsgi.py +-- manage.py (a) Quelle est l’utilité du script manage.py ? (b) Quel est le rôle du ﬁcher settings.py ? 3. Lancer manage.py avec la sous-commande runserver pour démarrer le serveur de dé- veloppement sur le port 8000. Visiter la page par défaut en faisant pointer votre navigateur sur http://localhost:8000. 4. Créer une nouvelle application world dans ce projet avec la sous-commande startapp de manage.py. Le contenu du répertoire du projet doit ressembler à : +-- hello | +-- __init__.py | +-- settings.py | +-- urls.py | +-- wsgi.py +-- manage.py +-- world +-- __init__.py +-- models.py +-- tests.py +-- views.py 5. Activer cette nouvelle application en modiﬁant le ﬁchier hello/settings.py pour que la variable INSTALLED_APPS (qui est un tuple) contienne l’entrée : INSTALLED_APP = ( ... ’world’, ) 6. Changer la page d’accueil du site en (a) ajoutant une entrée dans la variable urlpatterns du ﬁchier hello/urls.py de manière à router les requêtes à destination de / (GET /) vers une vue nommée home (b) Implémentant une fonction def home(request) dans le ﬁchier world/views.py qui retourne un objet django.http.HttpResponse ayant pour paramètre la chaîne de caractères “Hello, world !” 7. Ajouter une entrée dans urlpatterns pour que l’on puisse spéciﬁer un nom en minus- cules dans l’url et implémenter une fonction hello() dans views.py qui retourne un objet HttpResponse de la forme : return HttpResponse("Hello, <b>%s</b>!" % name) Quel le code HTTP retourné si vous utilisez l’url /julien01 ? Pourquoi ? 1.3 Templates HTML Jusqu’à présent, les vues déﬁnies dans views.py ne retournent pas de document HTML bien formé. Dans la suite du TP, le code HTML de l’application sera déﬁni dans un ou plusieurs ﬁchiers externes. 1. Créer le répertoire templates dans l’application world puis ajouter un ﬁchier home.html dont le contenu est le suivant : <html> <head><title>Hello !</title></head> <body> <h1 style="text-align: center;">Accueil</h1> <p>Bonjour {{ nom }} !</p> <p>Nous sommes le {{ date }}.</p> <p style="color: #00f;">À très bientôt.</p>  <hr/> <div style="font-size: 10px;">Message d’accueil généré automatiquement.</div> </body> </html> 2. Modiﬁer la fonction hello() dans world/views.py de manière à utiliser la fonction render_to_response() du package django.shortcuts. La fonction render_to_response() doit utiliser un dictionnaire Python contenant une clef “nom” dont la valeur sera passée au moteur de rendu du template HTML. 3. Modiﬁer la fonction hello() de manière à ce qu’elle calcule et retourne au template la date du jour dans la variable {{ date }}. 4. Créer un template base.html déﬁnissant l’aspect général du site à l’aide du template tag {% block %}...{% endblock %} pour que base.html puisse être réutilisé sur d’autres pages du site. 5. Modiﬁer le template home.html en simpliﬁant grandement sa structure de manière à héri- ter du template base.html. 6. Dans le template base.html, remplacer tous les attributs CSS style= par des attributs class= et externaliser les déﬁnitions de styles CSS dans un ﬁchier world/static/css/hello.css. 7. Charger les fonctions de gestion des ressources statiques de Django en complétant le tem- plate base.html comme suit : {% load staticfiles %} <html> <head> <title>Hello!</title> <link rel="stylesheet" type="text/css" href="{% static ’css/hello.css’ %}" /> </head> ... </html> Le template tag {% static %} permet de référencer facilement des ressources statiques (CSS, images, javascript etc.) utilisées par l’application. CHAPITRE 2 TP 2 16/04/2013 L’objectif de ce TP est de développer en une seule séance une application web fonctionnelle utilisant le framework Django selon le scénario suivant : Un ancien client vous contacte pour vous proposer le développement du back ofﬁce d’un site d’an- nonces immobilières. Il dispose déjà d’une équipe de créa performante composée d’un designer, de deux graphistes et d’un intégrateur. Les délais sont courts : il souhaite avoir un site à présenter dans deux jours, créa incluse, et vous demande la livraison d’un site fonctionnel en une demi-journée (la durée de ce TP !), prêt à être utilisé par ses équipes. Vous acceptez sa proposition et parvenez à négocier un contrat de 600 euros pour la demi-journée. Documents : – Cours : http ://sif.info-ufr.univ-montp2.fr/mmonnerville/django/cours/django.html – Énoncé du TP : http ://sif.info-ufr.univ-montp2.fr/mmonnerville/django/tps/html/index.html – Documentation ofﬁcielle : https ://docs.djangoproject.com Contact cours/TPs : Mathias Monnerville, mathias.monnerville@univ-montp2.fr 2.1 Déboguer efﬁcacement Aﬁn de faciliter le débogage de l’application tout au long du cycle de développement, vous utili- serez l’application Django tierce (ou “Django app”) nommée Django Debug Toolbar. 1. Créer le projet fastimmo (immobilier rapide) 2. Dans fastimmo, créer puis activer l’application vitrine 3. Créer un template home.html dans l’application vitrine et déﬁnir un chemin d’accès à la page d’accueil / dans le ﬁchier vitrine/urls.py. Utiliser les propriétés d’héritage des templates pour déﬁnir un template commun base.html puis séparer l’entête et le pied de page dans les ﬁchiers header.html et footer.html respectivement. La page d’accueil home.html doit afﬁcher le texte : <h2 class="title">Bienvenue sur FastImmo !</h2> v 4. Installer l’application libre Django Debug Toolbar en récupérant la dernière version sur gi- thub depuis https ://github.com/django-debug-toolbar/django-debug-toolbar, soit en clonant le code avec git, soit en récupérant un ﬁchier zip de la dernière version de la branche master. Suivre la procédure d’installation suivante : (a) Copier le répertoire django_toolbar dans le répertoire du projet fastimmo (b) Modiﬁer settings.py en ajoutant au tuple MIDDLEWARE_CLASSES la chaîne ’debug_toolbar.middleware.DebugToolbarMiddleware’ (c) Déﬁnir la variable suivante dans settings.py : INTERNAL_IPS = (’127.0.0.1’,) (d) Activer l’application debug_toolbar (e) Relancer le serveur web de développement : une barre de contrôle Javascript doit ap- paraitre sur la partie droite de la fenêtre Vous pouvez par exemple utiliser cet outil pour inspecter le contenu des variables passées aux templates HTML, analyser l’efﬁcacité des requêtes SQL effectuées ou remonter la hiérarchie des templates utilisés pour générer la page courante. 2.2 Persistence des données Le client prévoit la gestion d’une centaine d’annonces immobilières. L’utilisation d’une base de données SQLite conviendra parfaitement et sera très facile à déployer en production. 1. Vériﬁer que Python 2.7 supporte sqlite3 nativement en lançant Python dans un terminal et en important le module sqlite3 2. Spéciﬁer les paramètres de connexion à la base de données en modiﬁant la variable DATABASES de settings.py pour que ’ENGINE’ contienne ’django.db.backends.sqlite3’ et ’NAME’ déﬁnisse le nom de la base ’fastimmo.db’ 3. Créer la base de données en utilisant la commande syncdb de manage.py et choisir un login et un mot de passe pour le compte administrateur de l’application. 4. Se connecter à la base de données depuis un terminal avec dbshell et afﬁcher la structure de la base avec la commande .schema : $ python manage.py dbshell SQLite version 3.7.11 2012-03-20 11:35:50 Enter ".help" for instructions Enter SQL statements terminated with a ";" sqlite> .schema Interpréter la sortie de la commande .schema 3. On souhaite enregistrer les annonces immobilières dans deux tables Annonce et TypeBien ayant les champs suivants : Annonce Titre Description Type du bien Date et heure création Surface m2 Nombre de pièces Ville Prix est de type 1,1 TypeBien Type (maison, appart, ...) 1,n (a) Implémenter les modèles Annonce et TypeBien dans vitrine/models.py avec les signatures suivantes : from django.db import models class Annonce(models.Model): ... class TypeBien(models.Model): ... Déﬁnir les attributs suivants de type django.db.models.*Field pour la classe Annonce en utilisant la documentation de référence uploads/s3/ django-tps.pdf