diff --git a/B-poo.md b/B-poo.md
index 7126af1ff6e88304f857c54014c11c817314080d..acd44d1847d62bf27ab3f3975e145a71e05c9ebe 100644
--- a/B-poo.md
+++ b/B-poo.md
@@ -148,7 +148,7 @@ Pour pouvoir utiliser ces syntaxes, nous allons modifier la configuration de Bab
```
*Pour ne pas alourdir trop le code de la méthode render() je vous recommande de créer une nouvelle méthode `renderAttribute()` -appelée dans la méthode `render()`- qui va être en charge du rendu de l'attribut html.*
- Testez ce nouveau code, le rendu devra cette fois être :<br><a href="images/readme/pizzaland-03.jpg"><img src="images/readme/pizzaland-03.jpg" width="80%"></a>
+ Testez ce nouveau code, le rendu devra cette fois être :<br><a href="images/readme/pizzaland-03.png"><img src="images/readme/pizzaland-03.png" width="80%"></a>
## B.4. Héritage : La classe Img
1. **Créez maintenant une nouvelle classe `Img`** qui hérite de `Component` et dont le constructeur s'utilise comme ceci :
```js
@@ -158,7 +158,7 @@ Pour pouvoir utiliser ces syntaxes, nous allons modifier la configuration de Bab
```js
document.querySelector( '.pizzasContainer' ).innerHTML = img.render();
```
- Le rendu doit être identique à la capture précédente : <br><a href="images/readme/pizzaland-03.jpg"><img src="images/readme/pizzaland-03.jpg" width="80%"></a>
+ Le rendu doit être identique à la capture précédente : <br><a href="images/readme/pizzaland-03.png"><img src="images/readme/pizzaland-03.png" width="80%"></a>
## Étape suivante
Si vous avez terminé cette partie sur la POO, il est l'heure de mettre en place les modules dans la partie suivante : [C. Les modules](C-modules.md).
\ No newline at end of file
diff --git a/C-modules.md b/C-modules.md
index 10c7aab0694b34412ced62b7a05df72769453b32..924c46a8fc3e6182371b00371c3796b6b3abb24b 100644
--- a/C-modules.md
+++ b/C-modules.md
@@ -76,9 +76,9 @@ Dans un premier temps nous ferons abstraction de ces questions de compatibilité
export default function checkValue(value){...} // OK aussi !
```
-2. **Compilez votre code et testez la page dans le navigateur** : le résultat doit être identique à celui obtenu précédemment :<br><a href="images/readme/pizzaland-05.jpg"><img src="images/readme/pizzaland-05.jpg" width="80%"></a>
+2. **Compilez votre code et testez la page dans le navigateur** : le résultat doit être identique à celui obtenu précédemment :<br><a href="images/readme/pizzaland-03.png"><img src="images/readme/pizzaland-03.png" width="80%"></a>
-3. **Ouvrez l'onglet Réseau/Network des devtools, vous devez normalement voir le chargement automatique des différents modules** (une ligne par fichier JS) :<br><a href="images/readme/pizzaland-06-modules.jpg"><img src="images/readme/pizzaland-06-modules.jpg" width="80%"></a>
+3. **Ouvrez l'onglet Réseau/Network des devtools, vous devez normalement voir le chargement automatique des différents modules** (une ligne par fichier JS) :<br><a href="images/readme/pizzaland-06.png"><img src="images/readme/pizzaland-06.png" width="80%"></a>
## C.3. Rendre les modules compatibles avec les vieux navigateurs
@@ -128,7 +128,7 @@ Comme vu en cours, le bundler le plus employé en JS est [Webpack](https://webpa
```
5. **Lancez la compilation** : stoppez le watch précédent (<kbd>CTRL</kbd>+<kbd>C</kbd>), effacez tout le contenu du dossier `build` et relancez la compilation à l'aide de la commande `npm run watch` (*qui lancera cette fois webpack et plus Babel*)
-6. **Enfin, vérifiez dans le navigateur que la page s'affiche toujours** et que dans l'onglet "Réseau"/"Network" vous n'avez maintenant bien plus qu'un seul fichier JS téléchargé par le navigateur : le `build/main.bundle.js`<a href="images/readme/pizzaland-07-modules-webpack.jpg"><img src="images/readme/pizzaland-07-modules-webpack.jpg" width="80%"></a>
+6. **Enfin, vérifiez dans le navigateur que la page s'affiche toujours** et que dans l'onglet "Réseau"/"Network" vous n'avez maintenant bien plus qu'un seul fichier JS téléchargé par le navigateur : le `build/main.bundle.js`<a href="images/readme/pizzaland-07.png"><img src="images/readme/pizzaland-07.png" width="80%"></a>
## C.4. mode dev vs mode prod
diff --git a/D-poo-avancee.md b/D-poo-avancee.md
index 9acdecb06ca3b46167b60e819f53cbe72ce26a80..23e68ae9836b66e06605552f1be0a1d441367688 100644
--- a/D-poo-avancee.md
+++ b/D-poo-avancee.md
@@ -47,7 +47,7 @@
);
document.querySelector( '.pizzasContainer' ).innerHTML = c.render();
```
- doit afficher la page suivante :<br><a href="images/readme/pizzaland-04.jpg"><img src="images/readme/pizzaland-04.jpg" width="80%"></a>
+ doit afficher la page suivante :<br><a href="images/readme/pizzaland-04.png"><img src="images/readme/pizzaland-04.png" width="80%"></a>
3. **Créez une classe `PizzaThumbnail`** (dans `js/components/PizzaThumbnail.js`) qui hérite de la classe `Component` :
+ le constructeur prend en paramètre un objet nommé `pizza` dont le format correspond à celui d'un élément du tableau `data` (cad. propriétés `nom`, `base`, `prix_petite`, `prix_grande` et `image`)
@@ -72,6 +72,7 @@
const pt = new PizzaThumbnail(data[0]);
document.querySelector( '.pizzasContainer' ).innerHTML = pt.render();
```
+ <br><a href="images/readme/pizzaland-04b.png"><img src="images/readme/pizzaland-04b.png" width="80%"></a>
## D.2. La classe HomePage
@@ -82,7 +83,7 @@
***NB:** en théorie, un simple override du constructor et l'utilisation de la méthode [Array.map](https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/Array/map) doivent suffire !*
- Le résultat attendu est le suivant :<br><a href="images/readme/pizzaland-05.jpg"><img src="images/readme/pizzaland-05.jpg" width="80%"></a>
+ Le résultat attendu est le suivant :<br><a href="images/readme/pizzaland-05.png"><img src="images/readme/pizzaland-05.png" width="80%"></a>
## D.3. *Propriétés et méthodes statiques :* La classe PageRenderer
1. Créez une classe `Page` (dans un module `js/pages/Page.js`) :
diff --git a/images/readme/pizzaland-00.jpg b/images/readme/pizzaland-00.jpg
index dabe73afe86c8a6589eaecc7013eb83f7460f690..c321992678235e7a74010d76f981e4ed01a58d8b 100644
Binary files a/images/readme/pizzaland-00.jpg and b/images/readme/pizzaland-00.jpg differ
diff --git a/images/readme/pizzaland-03.jpg b/images/readme/pizzaland-03.jpg
deleted file mode 100644
index b8ec1bfd21bd19cdd5ed9fa6ce98483389499e97..0000000000000000000000000000000000000000
Binary files a/images/readme/pizzaland-03.jpg and /dev/null differ
diff --git a/images/readme/pizzaland-03.png b/images/readme/pizzaland-03.png
new file mode 100644
index 0000000000000000000000000000000000000000..d0d442a2a0549006f8963076e7990a5cc6710ffc
Binary files /dev/null and b/images/readme/pizzaland-03.png differ
diff --git a/images/readme/pizzaland-04.jpg b/images/readme/pizzaland-04.jpg
deleted file mode 100644
index c787fd76618e0a687e0ca5063dc4e3524c6b10ae..0000000000000000000000000000000000000000
Binary files a/images/readme/pizzaland-04.jpg and /dev/null differ
diff --git a/images/readme/pizzaland-04.png b/images/readme/pizzaland-04.png
new file mode 100644
index 0000000000000000000000000000000000000000..628f610525730728e667661b8252c3b35b29caca
Binary files /dev/null and b/images/readme/pizzaland-04.png differ
diff --git a/images/readme/pizzaland-04b.png b/images/readme/pizzaland-04b.png
new file mode 100644
index 0000000000000000000000000000000000000000..51226bdfc3eaa92d6dea0b80f5fd732e04a70aeb
Binary files /dev/null and b/images/readme/pizzaland-04b.png differ
diff --git a/images/readme/pizzaland-05.jpg b/images/readme/pizzaland-05.jpg
deleted file mode 100644
index bef0220daf46aecc7fe67b0f14133f30f45b8f9e..0000000000000000000000000000000000000000
Binary files a/images/readme/pizzaland-05.jpg and /dev/null differ
diff --git a/images/readme/pizzaland-05.png b/images/readme/pizzaland-05.png
new file mode 100644
index 0000000000000000000000000000000000000000..032da2c99ffa024e20272136f5d392c536508784
Binary files /dev/null and b/images/readme/pizzaland-05.png differ
diff --git a/images/readme/pizzaland-06-modules.jpg b/images/readme/pizzaland-06-modules.jpg
deleted file mode 100644
index 5530781db1029aa64ae93e4125662ab99b5f86ef..0000000000000000000000000000000000000000
Binary files a/images/readme/pizzaland-06-modules.jpg and /dev/null differ
diff --git a/images/readme/pizzaland-06.png b/images/readme/pizzaland-06.png
new file mode 100644
index 0000000000000000000000000000000000000000..3ad2144dcfc971fa78603f929046c1af2be8af8e
Binary files /dev/null and b/images/readme/pizzaland-06.png differ
diff --git a/images/readme/pizzaland-07-modules-webpack.jpg b/images/readme/pizzaland-07-modules-webpack.jpg
deleted file mode 100644
index c038efd68101d15f6546d64d06d579a24172f9e7..0000000000000000000000000000000000000000
Binary files a/images/readme/pizzaland-07-modules-webpack.jpg and /dev/null differ
diff --git a/images/readme/pizzaland-07.png b/images/readme/pizzaland-07.png
new file mode 100644
index 0000000000000000000000000000000000000000..4b1a21e1d8681f9ac034c65170095fc7d1807cb6
Binary files /dev/null and b/images/readme/pizzaland-07.png differ