• 20 hours
  • Medium

Free online content available in this course.

course.header.alt.is_video

course.header.alt.is_certifying

Got it!

Last updated on 12/12/19

Ajoutez une vue

Log in or subscribe for free to enjoy all this course has to offer!

Dans le chapitre précédent vous avez découvert les bonnes pratiques liées à une architecture MVT ainsi que leur utilisation dans un projet Django.

Il est temps de les mettre en pratique ! Dans ce chapitre vous découvrirez comment afficher le message "Salut tout le monde !" à tout visiteur qui arrive sur la page d'accueil. Bien entendu, ce n'est qu'une première étape !

A la fin du chapitre, nous ajouterons également une seconde route pour afficher les albums de l'application. Commençons !

Structurer une application en suivant le MVT

Par défaut, une application Django contient les fichiers suivants :

  • models.py : regroupe les modèles,

  • views.py : concentre les vues.

Mais qu'en est-il des templates et des URLs ? Ajoutons-les tout de suite !

Les gabarits

L'application ne comprend également aucun gabarits. Empressons-nous d'en créer un !

Les templates sont, par convention, regroupés dans le répertoire templates d'une application. Créez-le :

$ mkdir store/templates

Pour plus de clarté, ajoutez un sous-répertoire au nom de l'application.

$ mkdir store/templates/store

Laissez-le vide pour le moment. Nous le remplirons avec de nouveaux templates appelés par des vues !

Les URLs

Une URL étant le premier point d'entrée d'une requête, il est logique que le fichier se situe dans le répertoire consacré à la configuration du projet. Pourtant, vous y ajouterez de nombreuses autres routes à mesure que le projet croîtra. Il est donc important de regrouper les routes ! C'est pourquoi une bonne pratique consiste à créer un fichier urls.py par application et de l'importer dans les routes du projet.

Créez un nouveau document dans l'application :

$ touch store/urls.py

Puis importez-en le contenu dans disquaire_project/urls.py :

disquaire_project/urls.py

urlpatterns = [
url(r'^store/', include('store.urls')),
url(r'^admin/', admin.site.urls)
]

La méthode url() associe un schéma de route à un ensemble de vue. Plus précisément, elle prend en premier paramètre une expression régulière représentant un schéma et en second paramètre la vue à associer.

L'ajout de la méthode url(r'^store/', include('store.urls')), ajoute toutes les routes de store.urls aux routes du projet en les préfixant par store/.

Si vous lancez le serveur, vous remarquerez qu'une erreur apparaît :

$ ./manage.py runserver
...
django.core.exceptions.ImproperlyConfigured: The included URLconf '<module 'store.urls' from '/Users/celinems/sites/oc/exercices_exemples/decouvrez_django/disquaire_project/store/urls.py'>' does not appear to have any patterns in it. If you see valid patterns in the file then the issue is probably caused by a circular import.

Django vous indique qu'il n'existe aucune route dans le fichier que vous essayez d'importer. C'est normal ! Votre fichier est vide à ce stade. Vous le remplirez sous peu.

Créer une vue

Ajouter une vue

Votre première vue affichera le message "Salut tout le monde !" lorsque l'utilisateur entrera l'URL http://127.0.0.1:8000/store/

Pourquoi ne pas commencer par la page d'accueil, autrement dit la route /?

Très bonne question, mais ne soyez pas trop impatient ! Nous utiliserons une manière différente d'afficher cette route. Pour l'instant, je souhaite vous montrer comment ajouter une vue à une application de manière très simple.

Ouvrez le fichier views.py et ajoutez la première vue :

views.py

def index(request):
message = "Salut tout le monde !"
return message

Assez simple, n'est-ce pas ?!

Néanmoins, il y a un petit problème : une vue doit retourner une réponse valide pouvant être interprétée par un navigateur. Par exemple :

HTTP/1.1 200 OK
Date: Tue, 01 Aug 2017 14:36:27 GMT
Server: WSGIServer/0.2 CPython/3.6.2
Content-Type: text/html
X-Frame-Options: SAMEORIGIN
Content-Length: 11702
<!DOCTYPE html>
<html lang="fr">
...

Alors, comment faire ?

Django contient l'objet HttpResponse qui fait justement cela pour vous ! Importez-le et utilisez-le dans la vue :

views.py

from django.http import HttpResponse
def index(request):
message = "Salut tout le monde !"
return HttpResponse(message)

Ajouter une route

Parfait, la vue est créée ! Ajoutez la route permettant d'y accéder :

store/urls.py

from django.conf.urls import url
from . import views # import views so we can use them in urls.
urlpatterns = [
url(r'^$', views.index), # "/store" will call the method "index" in "views.py"
]

Pas de magie ! La méthode url() associe l'url / à la méthode index du fichier views.py.

Néanmoins, si vous lancez votre serveur et entrez l'URL   http://127.0.0.1:8000/, une page d'erreur apparaîtra ! Avez-vous trouvé pourquoi ? En effet, les routes contenues dans store/urls.py sont appelées dans disquaire_project/urls.py avec le préfixe store/. Naviguez donc à l'url  http://127.0.0.1:8000/store   et vous verrez apparaitre le magnifique message entré précédemment dans la vue :

Créer la page d'accueil

Comment faire pour la page d'accueil ? Vous allez procéder légèrement différemment. En effet, vous ne souhaitez pas utiliser de préfixe !

Vous allez donc directement appeler la vue index dans le fichier disquaire_project/urls.py et réserver la route /store pour une autre action.

Modifiez disquaire_project/urls.py comme suit :

from store import views
urlpatterns = [
url(r'^$', views.index),
url(r'^store/', include('store.urls')),
url(r'^admin/', admin.site.urls)
]

Et voilà !

Lister les albums

Ajoutez une nouvelle vue qui listera tous les albums de votre application ! Par souci de simplification, nous n'utiliserons pas la base de données pour le moment. Ajoutez simplement un jeu de données en pur Python dans models.py :

models.py

# from django.db import models
ARTISTS = {
'francis-cabrel': {'name': 'Francis Cabrel'},
'lej': {'name': 'Elijay'},
'rosana': {'name': 'Rosana'},
'maria-dolores-pradera': {'name': 'María Dolores Pradera'},
}
ALBUMS = [
{'name': 'Sarbacane', 'artists': [ARTISTS['francis-cabrel']]},
{'name': 'La Dalle', 'artists': [ARTISTS['lej']]},
{'name': 'Luna Nueva', 'artists': [ARTISTS['rosana'], ARTISTS['maria-dolores-pradera']]}
]

Suivez la même procédure pour ajouter une nouvelle vue mais avec une étape supplémentaire :

  • ajout d'une url dans store/urls.py,

  • ajout d'une vue dans views.py

  • récupération des données du modèle

urls.py

urlpatterns = [
url(r'^$', views.listing),
]

views.py

from .models import ALBUMS
...
def listing(request):
albums = ["<li>{}</li>".format(album['name']) for album in ALBUMS]
message = """<ul>{}</ul>""".format("\n".join(albums))
return HttpResponse(message)

Naviguez à l'url /store... et la liste des albums s'affiche !

Code du chapitre

Retrouvez l'intégralité du code de ce chapitre à cette adresse.

Example of certificate of achievement
Example of certificate of achievement