Améliorer la coloration syntaxique des blocs de code

docs/06-symfony/02-routage.md

@@ -10,7 +10,7 @@ Dans Symfony, il y a deux manières de définir les routes de l'application. On
 
 Exemple :
 
-```
+```php
 class HomeController extends AbstractController
 {
     #[Route('/home', name: 'home')]
@@ -26,8 +26,8 @@ Ici, on explique que lorsqu'on sera à l'adresse ```/home```, il faudra appeler
 
 On peut aussi passer par un fichier qui liste toutes les routes de l'application. En reprenant le même exemple, il faudra éditer le fichier ```routes.yaml``` disponible dans le dossier ```config```.
 
-```
-home
+```yaml
+home:
     path : /home
     controller : App\Controller\HomeController::index
 ```

docs/06-symfony/03-controleurs.md

@@ -8,7 +8,7 @@ Dans une application Symfony, et plus généralement dans une application qui su
 
 Prenons un exemple : 
 
-```
+```php
 use App\Repository\PostRepository;
 use Symfony\Component\HttpFoundation\Response;
 use Symfony\Component\Routing\Annotation\Route;

docs/06-symfony/04-twig.md

@@ -10,7 +10,7 @@ Prenons un exemple :
 
 Dans un contrôleur, on demande à Symfony de générer une page HTML en lui passant le chemin vers un template Twig et éventuellement des données à lui passer en second paramètre.
 
-```
+```php
 #[Route('/hello', name: 'presentation')]
 public function presentation(): Response
 {
@@ -28,7 +28,7 @@ On lui passe en second paramètre les données qu'on va utiliser dans le templat
 
 Le fichier ```index.html.twig``` va alors ressembler à ceci : 
 
-```
+```twig
 <h1>Votre prénon est {{ firstname }}</h1>
 
 {% if age >= 18 %}

docs/06-symfony/05-modeles.md

@@ -12,7 +12,7 @@ On dispose également de deux autres classes pour travailler avec notre entité.
 
 Prenons un exemple :
 
-```
+```php
 namespace App\Entity;
 use App\Repository\PostRepository;
 use Doctrine\ORM\Mapping as ORM;
@@ -49,7 +49,7 @@ De même avec la propriété ```$content``` qui a un type texte long.
 Lorsqu'on voudra récupérer des données, on fera appel au ```PostRepository``` en utilisant des méthodes comme ```findAll()``` ou ```findBy()```
 
 
-```
+```php
 public function index(PostRepository $repo): Response
 {
     $posts = $repo->findAll();

docs/06-symfony/06-formulaires.md

@@ -10,7 +10,7 @@ Elle consiste en l'introduction d'un objet ```Form```, sur lequel on a des méth
 
 Reprenons notre exemple de l'entité ```Post``` qu'on a vu dans le chapitre précédent. Pour gérer le formulaire qui va permettre d'ajouter un nouvel article, on va d'abord créer une classe ```PostType```, qu'on rangera dans un dossier ```Form```.
 
-```
+```php
 namespace App\Form;
 
 use App\Entity\Post;
@@ -40,7 +40,7 @@ class PostType extends AbstractType
 
 Puis dans le contrôleur, on gère le formulaire. Une seule route peut servir à prendre en compte l'affichage du formulaire et sa soumission.
 
-```
+```php
 use App\Entity\Post;
 use App\Form\PostType;
 use Doctrine\ORM\EntityManagerInterface;
@@ -72,7 +72,7 @@ Ici, l'objet ```post``` va automatiquement être rempli avec les données saisie
 
 Côté vue, on utilise des commandes Twig pour afficher le formulaire.
 
-```
+```twig
 {% form_theme postForm 'bootstrap_5_layout.html.twig' %}
 
 {{form_start(postForm)}}

docs/06-symfony/07-services.md

@@ -10,7 +10,7 @@ Symfony propose déjà des services tout en un, par exemple pour gérer des logs
 
 Prenons un exemple :
 
-```
+```php
 function SayHello(string $prenom, string $lang='EN') : string
 {
    $hellos = [
@@ -30,7 +30,7 @@ Transformons la en service. Nous créons un fichier ```HelloService.php``` que n
 
 Dedans, nous écrivons une classe : 
 
-```
+```php
 <?php
 
 namespace App\Service;
@@ -53,7 +53,7 @@ class HelloService
 
 Si nous souhaitons faire appel à la méthode ```SayHello``` de ce service dans une méthode d'un contrôleur relié à une route, nous pouvons injecter ce service dans les paramètres de la méthode.
 
-```
+```php
 use App\Service\HelloService;
 use Symfony\Component\HttpFoundation\Response;
 
@@ -74,7 +74,7 @@ public function hello(string $firstname, HelloService $helloService)
 
 Si nous souhaitons utiliser ce service dans une méthode d'une autre classe, nous pouvons l'injecter grâce au constructeur.
 
-```
+```php
 use App\Service\HelloService;
 
 class ServiceB

docs/06-symfony/08-JS-Symfony.md

@@ -24,7 +24,7 @@ Vous pouvez ensuite taper la commande ```npm run watch``` pour le dévoloppement
 
 Vous pouvez ensuite mettre à jour votre template Twig de base comme suit : 
 
-```
+```twig
 <head>
     <!-- ... -->
 

docs/07-JavaScript/02-les-variables.md

@@ -14,7 +14,7 @@ Pour déclarer une variable, on écrit le mot-clé ```const``` ou ```let```, sui
 
 Par exemple : 
 
-```
+```js
 const PI = 3.141592
 
 let age = 32
@@ -33,7 +33,7 @@ Dans une variable, on peut ranger différents types de données :
 
  Les tableaux sont des collections de données ou de variables. Ils peuvent contenir tous les types de données, ou même un mix des types. Ils s'écrivent entre crochets, avec les données séparées par une virgule. Un tableau peut contenir d'autres tableaux. Par exemple :
 
-```
+```js
 const numbers = [2, 4, 6, 8]
 
 const mixed = ['texte', 2, true]
@@ -43,7 +43,7 @@ const array_in_array = [[0, 1], [2, 3]]
 
 Les objets sont une façon de représenter un objet abstrait qui dispose de propriétés, chacune ayant une valeur. Ils s'écrivent entre accolades, avec des couples proprité/valeur séparés par des virgules. On sépare la proprité de la valeur par un signe deux points. Par exemple :
 
-```
+```js
 const person = {
     first_name : 'John',
     last_name : 'Doe',

docs/07-JavaScript/03-les-conditions.md

@@ -10,7 +10,7 @@ Pour écrire une condition, on utilise le mot-clé ```if```, suivi entre parenth
 
 Exemple :
 
-```
+```js
 if(age >= 18) {
     console.log('vous êtes majeur')
 }
@@ -22,7 +22,7 @@ On peut éventuellement ajouter un autre bout de code qui sera exécuté si la c
 
 Exemple :
 
-```
+```js
 if(age >= 18) {
     console.log('vous êtes majeur')
 } else {
@@ -36,7 +36,7 @@ On peut également utiliser une version raccourcie, qu'on appelle une ternaire p
 
 Exemple :
 
-```
+```js
 const phrase = 'Vous êtes ' + (age >= 18 ? 'majeur' : 'mineur')
 ```
 

docs/07-JavaScript/04-les-boucles.md

@@ -19,7 +19,7 @@ Il existe différents types de boucle en JavaScript :
 
 Elle permet de répeter les choses un nombre défini de fois. Imaginons qu'on souhaite réaliser un compteur :
 
-```
+```js
 for (let i = 1; i <= 5; i++) {
     console.log("compteur: " + i)
 }
@@ -31,7 +31,7 @@ Dans ce code, on part avec ```i``` à 1. On indique qu'on continue tant que ```i
 
 Elle permet de répeter les choses tant qu'une condition est remplie. En reprennant l'exemple de la boucle ```for```, cela donne :
 
-```
+```js
 let i = 1 
 while (i <= 5) {
     console.log("compteur: " + i)
@@ -46,7 +46,7 @@ On peut également remplacer le ```i++``` par ```i = i + 1```.
 
 Elle permet de parcourir les clefs d'un tableau ou les propriétés d'un objet.
 
-```
+```js
 const person = { firstname: 'john', lastname: 'Doe', age: 32 };
 
 for (const property in person) {
@@ -60,7 +60,7 @@ Cette boucle affichera d'abord ```firstname```, puis ```lastname``` puis ```age`
 
 Elle permet de parcourir les éléments d'un tableau. Prenons un exemple : 
 
-```
+```js
 const skills = ['HTML', 'CSS', 'PHP']
 for (let skill in skills) {
     console.log(skill) 

docs/07-JavaScript/05-les-fonctions.md

@@ -10,7 +10,7 @@ Une fonction peut prendre en entrée des paramètres que l'on va utiliser dans l
 
 Prenons un example :
 
-```
+```js
 function sayHello(prenom) {
     return 'Bonjour ' + prenom
 }
@@ -21,7 +21,7 @@ Cette fonction permet de renvoyer une chaine de caractère qui dit ```bonjour```
 On peut aussi stocker la fonction dans une variable. Par exemple :
 
 
-```
+```js
 const sayHello = function (prenom) {
     return 'Bonjour ' + prenom
 }
@@ -31,15 +31,15 @@ On l'appellera de la même manière.
 
 On peut aussi utiliser ce qu'on appelle les fonctions fléchées. 
 
-```
+```js
 const sayHello = (prenom) => {
     return 'Bonjour ' + prenom
 }
 ```
 
 Si la fonction ne comporte qu'une seule instruction de retour, on peut l'écrire sur une seule ligne en enlevant les accolades et le mot-clé ```return```.
 
-```
+```js
 const sayHello = (prenom) => 'Bonjour ' + prenom
 ```
 

docs/07-JavaScript/06-events.md

@@ -10,7 +10,7 @@ Pour déclancher du code quand un de ces évènement se produit, on utilise ce q
 
 Par exemple, si on souhaite réagir au clic sur un élement du DOM, par exemple un bouton, on peut écrire le code suivant : 
 
-```
+```js
 const button = document.querySelector('#loginBT')
 
 button.addEventListener('click', function () {
@@ -20,7 +20,7 @@ button.addEventListener('click', function () {
 
 Pour une frappe dans un champ texte, on peut écrire le code suivant : 
 
-```
+```js
 const input = document.querySelector('input');
 
 input.addEventListener('input', updateValue);
@@ -32,7 +32,7 @@ function updateValue(e) {
 
 Pour écouter les déplacement de la souris, on peut écrire quelque chose comme ça.
 
-```
+```js
 document.addEventListener('mousemove', (e) => {
    console.log(`la souris a bougé en ${e.offsetX}/${e.offsetY}.`
   }

docs/07-JavaScript/07-POO.md

@@ -8,7 +8,7 @@ Il serait bien difficule de décrire en totalité les principes de la programmat
 
 Imaginons que vous travailliez sur un annuaire. Vous allez donc devoir gérer des personnes. Chacune aura par exemple un nom, un prénom et un email. C'est l'occasion de ce créer un type d'objet dédié, en écrivant ce qu'on appelle une classe.
 
-```
+```js
 class Person {
 
     firstname = ''
@@ -25,15 +25,15 @@ class Person {
 
 Dans cette classe, on définit des propriété, auxquelles on assigne une valeur par défaut, puis grâce à la méthode ```constructor``` on assigne les données reçues à la construction. Quand on va construire un objet ```Person```, on le fera comme ceci :
 
-```
+```js
 const personne = new Person('John', 'Doe', 'john.doe@gmail.com')
 ```
 
 On pourra accéder aux proprités de l'objet comme avec n'importe quel objet littéral (ceux avec les accolades). Ainsi, pour récupérer l'email on écrira ```personne.email```.
 
 On peut aussi écrire des méthodes dans notre classe. Par exemple, rajoutons une méthode qui renverra une chaine formatée pour afficher la personne :
 
-```
+```js
 class Person {
 
     firstname = ''

docs/07-JavaScript/08-les-erreurs.md

@@ -8,7 +8,7 @@ Lorsque l'on écrit un code, celui-ci peut parfois générer des erreurs. On peu
 
 Pour générer une exception, on utilise le mot-clef ```throw``` et l'objet ```Error```. On écrira par exemple : 
 
-```
+```js
 if(age < 18) {
     throw new Error('Vous devez être majeur')
 }
@@ -17,7 +17,7 @@ if(age < 18) {
 
 On peut capturer une exception en utilsant le bloc ```try...catch```.
 
-```
+```js
 try {
     // code qui peut renvoyer des erreurs
 } catch (e) {

docs/07-JavaScript/09-la gestion-asynchrone.md

@@ -14,7 +14,7 @@ Les callback consistent en l'écriture d'une fonction qui prend elle même une f
 
 Imaginons que l'on souhaite exécuté une fonction qui attendrait 2 secondes puis retournerait un message. On pourrait écrire les choses comme suit : 
 
-```
+```js
 const wait = (duration, cb) => {
     setTimeOut(() => {
         cb()
@@ -38,7 +38,7 @@ Mais si on doit gérer plusieurs callback imbriqués, on va tomber dans ce qu'on
 
 Les promesses sont une autre façon de gérer le code asynchrone. Elle s'écrivent de la façon suivante :
 
-```
+```js
 const wait = (duration) => {
     return new Promise((resolve, reject) => {
         setTimeout(() => resolve(duration), duration)
@@ -48,7 +48,7 @@ const wait = (duration) => {
 
 Ici, la fonction ```wait``` retourne une promesse, qui prend en paramètre deux callback. ```resolve``` sera appelé en cas de succès et ```reject``` en cas d'échec. On pourra alors apeller la fonction ```wait``` comme suit : 
 
-```
+```js
 wait(2000)
     .then((duration) => {
         console.log(`j'ai attendu ${duration}ms`)
@@ -60,7 +60,7 @@ wait(2000)
 
 L'avantage sur les callback est que si on renvoie une nouvelle promesse dans un ```then``` on peut alors enchainer les méthodes.
 
-```
+```js
 wait(2000)
     .then((duration) => {
         console.log(`j'ai attendu ${duration}ms`)
@@ -73,7 +73,7 @@ wait(2000)
 
 On peut aussi écrire les choses plus simplement avec les mots-clef ```async``` et ```await```. On déclarre une fonction comme asynchrone avec le mot-clef ```async```. Dans ce cas là, son retour sera une promesse. L'avantage, c'est qu'à l'interieur de cette fonction, on peut appeller une fonction qui retourne une promesse avec le mot clé ```await```. Le code qui suit attendra la résolution de la promesse pour être exécuté.
 
-```
+```js
 const wait = (duration) => {
     return new Promise((resolve, reject) => {
         setTimeout(() => resolve(duration), duration)