Tutoriel pour apprendre à utiliser le framework web Django

XIII-B-1-a. Windows▲

XIII-B-1-b. MacOS▲

XIII-B-1-c. Linux▲

sudo apt-get install git
 # ou
sudo yum install git
 # ou
sudo dnf install git
 # ou
sudo zypper install git

Git conserve toutes les modifications apportées à un ensemble de fichiers dans un « repository » (ou « dépôt »). Nous allons devoir en créer un pour notre projet. Ouvrez votre terminal et allez dans le répertoire djangogirls. Ensuite, tapez les commandes suivantes :

$ git init
Initialise un dépôt Git vide à l'emplacement ~/djangogirls/.git/
$ git config --global user.name "Votre nom"
$ git config --global user.email you@exemple.com

L'initialisation d'un dépôt git ne se fait qu'une fois par projet. De même, vous n'aurez plus jamais à réentrer votre nom d'utilisateur ou votre email.

Git va surveiller et conserver les modifications concernant l'ensemble des fichiers et dossiers présents dans ce répertoire, à l'exception de certains fichiers que nous aimerions exclure. Pour cela, nous allons créer un fichier appelé .gitignore dans le répertoire principal du projet. Ouvrez votre éditeur et créez un nouveau fichier en copiant le contenu suivant :

*.pyc
__pycache__
myvenv
db.sqlite3
/static
.DS_Store

Enregistrez ce fichier .gitignore dans votre répertoire principal « djangogirls ».

Avant de taper la commande git add ou lorsque vous ne vous souvenez plus des changements que vous avez effectués dans votre projet, pensez à taper la commande git status. Cela permet surtout d'éviter les mauvaises surprises, comme l'ajout ou l'envoi d'un mauvais fichier. La commande git status permet d'obtenir des informations sur tous les fichiers non suivis/modifiés/mis à jour, l'état de la branche, et bien plus encore. Voici ce qui se passe lorsque vous tapez cette commande :

$ git status
On branch master

Initial commit

Untracked files:
  (use "git add <file>..." to include in what will be committed)

        .gitignore
        blog/
        manage.py
        mysite/

nothing added to commit but untracked files present (use "git add" to track)

Pour le moment, nous n'avons fait que regarder l'état de notre branche. Pour enregistrer nos changements, nous allons devoir taper les commandes suivantes :

$ git add --all .
$ git commit -m "My Django Girls app, first commit"
 [...]
 13 files changed, 200 insertions(+)
 create mode 100644 .gitignore
 [...]
 create mode 100644 mysite/wsgi.py

Allez sur GitHub.com et inscrivez-vous gratuitement (si vous possédez déjà un compte, c'est très bien !)

Ensuite, créez un nouveau dépôt en lui donnant le nom « my-first-blog ». Pensez à laisser les options par défaut. Dans notre cas, il n'est pas nécessaire de cocher la case « initialise with a README ». Vous pouvez aussi laisser l'option .gitignore vide, car nous avons déjà créé ce fichier précédemment. Enfin, comme nous n'avons pas besoin d'une licence pour notre application, laissez le champ License à None.

La page suivante vous donne l'URL qui va vous permettre de cloner votre dépôt. Choisissez la version « HTTPS » et copiez l'URL, car nous allons rapidement en avoir besoin :

Nous avons maintenant besoin de relier nos deux dépôts : celui sur notre ordinateur et celui sur GitHub. On utilise l'expression « hook » en anglais pour décrire cette étape.

Tapez les instructions suivantes dans votre console (remplacez <votre-nom-d′utilisateur-github> avec le nom d'utilisateur de votre compte GitHub et sans les chevrons) :

$ git remote add origin https://github.com/<votre-nom-d′utilisateur-github>/my-first-blog.git
$ git push -u origin master

Entrez votre nom d'utilisateur et mot de passe Github. Vous devriez voir quelque chose comme ceci :

Username for 'https://github.com': votre-nom
Password for 'https://votre-nom@github.com':
Counting objects: 6, done.
Writing objects: 100% (6/6), 200 bytes | 0 bytes/s, done.
Total 3 (delta 0), reused 0 (delta 0)
To https://github.com/votre-nom/my-first-blog.git
 * [new branch]      master -> master
Branch master set up to track remote branch master from origin.

Votre code est maintenant sur GitHub. Allez jeter un coup d'œil ! Votre code est maintenant au même endroit que d'autres projets super cool : Django, le tutoriel Django Girls et les nombreux autres projets libres qui sont hébergés sur GitHub.

Une fois enregistré sur PythonAnywhere, vous serez automatiquement redirigé sur votre écran d'accueil, où se trouve la liste des consoles. Cliquez sur le lien « Bash » dans la partie « start a new console ». C'est la version PythonAnywhere des consoles que vous avez sur votre ordinateur.

Importons notre code depuis Github vers PythonAnywhere en créant un « clone » de notre dépôt. Tapez la commande suivante dans la console de PythonAnywhere (n'oubliez pas d'utiliser votre nom d'utilisateur Github à la place de <your-github-username>):

$ git clone https://github.com/<votre-nom-d′utilisateur-github>/my-first-blog.git

Cette commande va permettre d'effectuer une copie de votre code vers PythonAnywhere. La commande tree my-first-blog permet d'afficher un aperçu de ce qui se trouve maintenant sur votre serveur :

$ tree my-first-blog
my-first-blog/
├── blog
│   ├── __init__.py
│   ├── admin.py
│   ├── migrations
│   │   ├── 0001_initial.py
│   │   └── __init__.py
│   ├── models.py
│   ├── tests.py
│   └── views.py
├── manage.py
└── mysite
    ├── __init__.py
    ├── settings.py
    ├── urls.py
    └── wsgi.py

XIII-C-1-a. Créer un virtualenv sur PythonAnywhere▲

$ cd my-first-blog

$ virtualenv --python=python3.4 myvenv
Running virtualenv with interpreter /usr/bin/python3.4
[...]
Installing setuptools, pip...done.

$ source myvenv/bin/activate


(mvenv) $  pip install django~=1.10.0
Collecting django
[...]
Successfully installed django-1.10

XIII-C-1-b. Créer une base de données sur PythonAnywhere▲

(mvenv) $ python manage.py migrate
Operations to perform:
[...]
  Applying sessions.0001_initial... OK


(mvenv) $ python manage.py createsuperuser

Maintenant, notre code est sur PythonAnywhere, notre virtualenv est prêt, les fichiers statiques sont recueillis et la base de données est initialisée. Nous sommes prêts à le publier comme une application web !

Retourner sur la page d'accueil de PythonAnywhere en cliquant sur le logo en haut à gauche. Ensuite, cliquez sur l'onglet Web et Add a new web app.

Après avoir confirmé votre nom de domaine, choisissez manual configuration dans la boîte de dialogue (NB : ne choisissez pas l'option « Django »). Enfin, choisissez Python 3.4 et cliquez sur « next » pour fermer l'assistant de configuration.

XIII-C-2-a. Configurer le virtualenv▲

Une fois l'assistant fermé, vous serez automatiquement conduite sur la page de configuration dédiée à votre application web. Dès que vous aurez besoin de modifier quelque chose concernant votre appli, c'est là que vous devrez aller.

Dans la section « Virtualenv », cliquez sur le texte en rouge qui indique « Enter the path to a virtualenv » (entrer le chemin d'accès de votre environnement virtuel), et entrez ceci : /home/<your-username>/my-first-blog/myvenv/. Cliquez sur la boîte bleue avec la case à cocher pour sauvegarder le chemin d'accès.

N'oubliez pas de mettre votre nom d'utilisateur. Ne vous inquiétez pas : si vous faites une erreur, PythonAnywhere vous le signalera.

XIII-C-2-b. Configurer le fichier WSGI▲

import os
import sys

path = '/home/<your-username>/my-first-blog'  # use your own username here
if path not in sys.path:
    sys.path.append(path)

os.environ['DJANGO_SETTINGS_MODULE'] = 'mysite.settings'

from django.core.wsgi import get_wsgi_application
from django.contrib.staticfiles.handlers import StaticFilesHandler
application = StaticFilesHandler(get_wsgi_application())

Si vous constatez une erreur lorsque vous essayez de visiter votre site web, les journaux d'erreurs devraient vous permettre de comprendre ce qui ne marche pas. Vous trouverez un lien vers ces fichiers dans l'onglet Web de PythonAnywhere. Regardez s'il y a des messages d'erreurs ; les plus récents seront en bas du fichier. Les bogues les plus fréquents que vous pouvez rencontrer sont les suivants :

• oublier une étape lors du passage dans la console. Vous devriez avoir fait toutes les étapes suivantes : créer un environnement virtuel, l'activer, installer Django, lancer la commande « collectstatic » et enfin créer la base de données ;
• se tromper dans le chemin d'accès à l'environnement virtuel : si c'est le cas, vous trouverez un petit message d'erreur en rouge dans l'onglet « web », section virtualenv ;
• se tromper lors de la création du fichier de configuration WSGI : pensez à vérifier si le chemin d'accès que vous avez entré est bien celui de « my-first-blog » ;
• Se tromper de version de Python : votre environnement virtuel et votre application web doivent tous les deux être sous Python 3.4.Il y a quelques astuces générales de débogage sur le wiki PythonAnywhere.

Et n'oubliez pas, votre coach est là pour vous aider !