Mise en place de l'environnement de travail

Dans les parties précédentes, vous avez réalisé votre premier site web, en écrivant directement le code CSS et HTML. Dans la pratique, rare sont les sites web réalisés de cette manière. Deux méthodes sont courramment utilisées aujourd'hui : les générateurs de sites statiques et les sites web dynamiques.

• Avec un générateur de site statique, l'utilisateur crée ses pages web dans un langage plus convivial que le HTML (très souvent Markdown), et un logiciel convertit cet ensemble de fichiers markdown en un ensemble de fichiers html qui constituent le site web.

• Avec un site web dynamique, lorsqu'un navigateur web consulte une page, cette page ne correspond pas à un fichier html stocké quelque part : elle est générée à la volée, et transmise au navigateur (c'est ce qui se passe par exemple lorsque l'on fait une requête sur un moteur de recherche, ou qu'on consulte ses courriers électroniques).

Ce TP (et quelques suivants) seront consacrés à la réalisation d'un site web en utilisant le générateur de site statique Pelican (il en existe de nombreux autres).

Environnement de travail

Le terminal (ou console) est un outil qui permet de contrôler l'ordinateur en mode texte uniquement : l'utilisateur·ice tape une commande au clavier, et le terminal affiche la réponse. La souris n'est ici pas utilisée.

Création

Durant cette partie, la fenêtre du terminal ressemblera à peu près à ceci :

1. Lancez l'application Terminal.

2. Tapez ls, suivi de a touche Entrée. Le contenu de votre répertoire doit s'afficher.

   À partir de maintenant, toutes les commandes (« Tapez COMMANDE ») devront être suivies de la touche Entrée.

3. Tapez mkdir siteweb. Ouvrez le navigateur de fichier pour vérifier que ce dossier a été créé (mais qu'il est vide).

4. Tapez cd siteweb : le répertoire de travail est maintenant le répertoire siteweb.

5. Tapez pelican-quickstart pour initialiser le site web. Ce logiciel vous pose de nombreuses questions. Ne répondez qu'aux questions suivantes (et appuyez sur Entrée pour accepter la réponse par défaut des autres questions) :

   Question		Réponse
   What will be the title of this web site?	→	Le titre de votre site web (le même que le site web créé dans les TP précédents).
   Who will be the author of this web site?	→	Votre nom (qui apparaîtra sur votre site web).
   Do you want to specify a URL prefix? e.g., http://example.com (Y/n)	→	n

6. Tapez pelican pour générer votre site web pour la première fois.

7. Fermez le terminal.

Configuration

Ouvrez le fichier pelicanconf.py, et ajoutez les lignes suivantes à la fin du fichier.

DEFAULT_DATE = 'fs'
STATIC_PATHS = ['blog']

Utilisation

À chaque fois que vous travaillerez avec Pelican, vous aurez besoin d'ouvrir deux fenêtres (ou onglets) de terminal.

1. Dans chacuns des deux terminaux, déplacez-vous dans le répertoire de votre site web : cd siteweb.
2. Dans le premier terminal, tapez make serve. Cette commande lance un serveur web qui vous permet de visualiser votre site web à l'adresse http://localhost:8000. Laissez ce terminal ouvert.
3. Dans le second terminal, tapez pelican. Cette commande va générer le site web, c'est-à-dire lire les fichiers au format markdown (ainsi que d'autres fichiers : templates, images, etc.) et les convertir en HTML. À chaque fois que vous modifierez votre site web, pour le mettre à jour, vous lancerez à nouveau cette commande (vous y verrez également s'afficher d'éventuelles erreurs dans vos fichiers).

C'est bon, vous pouvez admirer votre premier site web généré avec Pelican. Il est vide et moche, mais nous améliorerons cela plus tard.

Évaluation

Si, en vous connectant à l'adresse http://localhost:8000, vous voyez un site web, vous pouvez passer au TP suivant.