02 Guide pas-à-pas - Atelier 2

Dockerisez les rendez-vous
du zoo (CMS flat-file)

Le studio créatif livre un mini-CMS PHP en deux dossiers : le moteur et le contenu. Vous emballez les deux dans une image PHP + Apache avec deux COPY. Cinq étapes guidées.

Ce qu'on vous fournit

Le dossier labos/semaine-1/demande-2-web-flat/ contient :

Vous y ajoutez : Dockerfile, .dockerignore, construire.sh, demarrer.sh, arreter.sh, votre README.md.

Avant de commencer

Pré-requis

Vue d'ensemble

Le parcours en cinq étapes

La grande idée de l'atelier : tout va dans l'image. Vous copiez le moteur et le contenu avec deux COPY, vous construisez, vous lancez. Cliquez sur une étape pour y accéder.

Étape 01

Inspecter moteur et contenu

Étape 02

Écrire le Dockerfile

Étape 03

Construire et démarrer

Étape 04

Vérifier dans le navigateur

Étape 05

Encapsuler dans 3 scripts

01

Inspecter le moteur et le contenu

Comprendre où vivent les fichiers et comment le moteur trouve le contenu. Aucun code PHP à écrire.

Indications

Ouvrez les fichiers dans votre éditeur, regardez sans modifier :

  • moteur/index.php - liste les articles. Repérez la ligne qui cherche les fichiers : __DIR__ . '/fp-content/articles'. Cette ligne dit "le dossier fp-content/ doit être à côté de moi".
  • moteur/article.php - affiche un article par identifiant.
  • fp-content/articles/festival-oiseaux-migrateurs-2026.html - notez le bloc <!-- METADONNEES ... --> en tête. C'est ce que le moteur lit pour générer la liste.

Pourquoi deux dossiers séparés ?

Le moteur est du code, écrit par un développeur. Le contenu est des annonces, écrites par n'importe qui au zoo (chargé de communication, responsable événements). Garder les deux séparés permet à chacun de travailler de son côté sans risquer de toucher l'autre.

Vous pouvez expliquer en une phrase ce que fait chaque dossier, et où le moteur s'attend à trouver le contenu une fois en production.
02

Écrire le Dockerfile

Construire une image PHP + Apache qui contient le moteur, et qui contient aussi le dossier fp-content/ à la bonne place.

Indications

  • Image de base : php:8.2-apache. C'est PHP 8.2 avec Apache déjà configuré pour servir /var/www/html/.
  • Le moteur (le contenu de moteur/, pas le dossier lui-même) va dans /var/www/html/ pour qu'Apache puisse exécuter index.php directement à la racine.
  • fp-content/ va dans /var/www/html/fp-content/, c'est-à-dire à côté de index.php. C'est exactement ce qu'attend le moteur (revoir l'étape 1).
  • Deux instructions COPY, une pour chaque dossier. Pas de RUN, pas de magie.
  • EXPOSE 80 documente le port Apache.

Squelette à compléter :

Dockerfile - squelette
FROM image-de-base

LABEL pavillon="evenements"

# Copier le moteur PHP a la racine servie par Apache
COPY source-moteur destination-moteur

# Copier le contenu comme sous-dossier, a cote de index.php
COPY source-contenu destination-contenu

EXPOSE 80
Attention au slash final dans COPY. COPY moteur/ /var/www/html/ copie le contenu du dossier moteur. COPY moteur /var/www/html/ (sans slash) copie le dossier en lui-même, ce qui crée /var/www/html/moteur/ et Apache ne trouvera pas votre index.php à la racine.
Le Dockerfile contient un FROM, deux COPY, et un EXPOSE. Vous pouvez expliquer pour chaque COPY ce qui est copié et où.
03

Construire et démarrer le conteneur

Construire l'image avec un nom et une version sémantiques, puis lancer un conteneur qui expose le site sur un port de votre poste.

Indications

Mêmes commandes qu'à l'Atelier 1, juste un nom d'image différent :

Terminal
$ docker build -t "zoo-evenements:1.0" -t "zoo-evenements:latest" .

$ docker run -d --name "zoo-evenements" -p "8080:80" zoo-evenements:latest

Au premier build, vous verrez Docker télécharger php:8.2-apache (environ 400 Mo, c'est normal : PHP et Apache sont inclus).

docker ps liste votre conteneur en état Up. docker images montre zoo-evenements avec un tag 1.0 et latest.
04

Vérifier dans le navigateur

Voir le site rendu par votre conteneur, exactement comme un visiteur l'aurait sur la borne du zoo.

Démarche

  1. Ouvrez http://localhost:8080/ dans votre navigateur.
  2. Vous devez voir la page d'accueil avec les trois articles du studio créatif : Festival des oiseaux migrateurs, Journée des pollinisateurs, Nuit des musées marin.
  3. Cliquez sur un article : la fiche complète s'ouvre via article.php?identifiant=....
La page d'accueil liste les 3 articles dans l'ordre attendu. Cliquer sur une vignette ouvre l'article complet avec son contenu HTML. Le style (police, couleurs, bandeau) du decoration/decoration-evenements.css s'applique.
Si la page d'accueil affiche "Aucun article", c'est presque toujours que fp-content/ n'est pas au bon endroit dans l'image. Lancez docker exec -it zoo-evenements ls /var/www/html/ : vous devez voir index.php, article.php, decoration/ ET fp-content/ côte à côte. Si fp-content/ manque ou est ailleurs, corrigez votre deuxième COPY et reconstruisez.
Si le navigateur affiche le code PHP brut ou télécharge un fichier au lieu de le rendre, vous avez probablement pris une image qui n'exécute pas PHP (par exemple httpd:alpine). L'image php:8.2-apache est spécifiquement faite pour ça.
05

Encapsuler dans trois scripts et finaliser

Comme à l'Atelier 1, les commandes Docker vivent dans trois scripts bash bien nommés. Plus le .dockerignore. Plus votre README.md.

Trois scripts

Mêmes principes qu'à l'Atelier 1 : kebab-case, set -e, variables en tête. Différences pour cette demande :

  • construire.sh : docker build -t zoo-evenements:1.0 -t zoo-evenements:latest .
  • demarrer.sh : docker run -d --name zoo-evenements -p 8080:80 zoo-evenements:latest
  • arreter.sh : docker stop zoo-evenements puis docker rm zoo-evenements

.dockerignore

Vous n'avez pas besoin que vos scripts et votre README soient dans l'image. Ajoutez-les au .dockerignore :

.dockerignore - extrait minimal
.git
*.log
*.tmp
construire.sh
demarrer.sh
arreter.sh
README.md
.dockerignore

README.md

Trois sections obligatoires (Ce que c'est, Comment lancer, Ce qu'on voit). Précisez quel port vous utilisez sur l'hôte (par défaut 8080) et donnez l'URL exacte à ouvrir.

La séquence ./construire.sh ; ./demarrer.sh rend le site accessible sur http://localhost:8080/. ./arreter.sh stoppe et supprime le conteneur proprement.

Bonus - permettre les mises à jour sans rebuild

Avec la livraison ci-dessus, chaque nouvel article publié par le studio créatif vous oblige à reconstruire l'image. Pour un studio qui publie au fil de l'eau, c'est lourd. Le bonus consiste à monter fp-content/ en volume Docker plutôt que de le copier dans l'image : le studio peut alors déposer un nouvel article et il apparait sans construire.sh.

Le bonus nécessite une vidéo de preuve (max 30 s) qui montre l'ajout d'un 4e article sans rebuild.

Voir le Guide 2 BONUS →