13. Annexes
13.1. Installation de Node.js
[Node.js] se télécharge sur nodejs.org : on choisit la version LTS (support à long terme), 22 de préférence ([Vite] 7 demande au moins la version 20.19). L'installateur [Windows] installe aussi [npm]. On vérifie l'installation dans une console :
Pour faire cohabiter plusieurs versions de [Node.js] sur une même machine, on peut utiliser [nvm-windows] (sous [Windows]) ou [nvm] (sous [Linux] et [macOS]).
Les exemples et l'étude de cas n'exigent d'installer aucun outil globalement : [Vite], [TypeScript], [vue-tsc] (et, pour le serveur, l'outil [nest]) font partie des dépendances de chaque projet, installées par [npm install].
13.2. Installation de Visual Studio Code
[Visual Studio Code] se télécharge sur code.visualstudio.com. Pour les fichiers [.vue], on installe l'extension Vue (Official) (éditeur Vue.volar), depuis le panneau des extensions (Ctrl-Maj-X) : coloration syntaxique, complétion, vérification des types [TypeScript] dans les templates, navigation vers la définition d'un composant ou d'une prop.
On ouvre un projet par le menu Fichier / Ouvrir le dossier (le dossier [exemples-vuejs], par exemple), et l'on y ouvre une console par le menu Terminal / Nouveau terminal.
13.3. L'extension Vue.js devtools
L'extension Vue.js devtools s'installe depuis la boutique d'extensions de [Chrome], [Edge] ou [Firefox]. Elle ajoute un onglet « Vue » aux outils de développement du navigateur (F12), qui montre :
- l'arbre des composants de la page, et, pour chacun, ses props, son état ([ref], [reactive], [computed]) ;
- les stores [Pinia] et leur contenu ;
- les routes du routeur et la route courante ;
- une chronologie des événements émis par les composants.
On peut y modifier une donnée et voir la page se mettre à jour : un excellent moyen de comprendre la réactivité.
13.4. Installation de MySQL avec Laragon
Le serveur JSON a besoin de [MySQL] (ou [MariaDB]). [Laragon] (laragon.org) en installe un sous [Windows], prêt à l'emploi, avec l'outil d'administration [HeidiSQL]. Après installation :
- le bouton « Démarrer tout » lance le serveur [MySQL], sur le port 3306 ;
- l'utilisateur [root] n'a pas de mot de passe : ce sont les valeurs par défaut du fichier [.env.example] du serveur ;
- dans [HeidiSQL] (bouton « Base de données »), le menu Fichier / Exécuter un fichier SQL exécute le script [database/dbrdvmedecins2.sql].
Sous [Linux] ou [macOS], on installe [MySQL] ou [MariaDB] avec le gestionnaire de paquets du système, et l'on exécute le script avec le client en ligne de commande : [mysql -u root -p < database/dbrdvmedecins2.sql].
13.5. Installation de curl
[curl] est livré avec [Windows] 10 et 11, [macOS] et la plupart des distributions [Linux]. On vérifie sa version :
L'option [--json], utilisée dans ce document, existe depuis la version 7.82 (2022). Avec une version plus ancienne, on remplace [--json @fichier] par [-H "Content-Type: application/json" -d @fichier], ou l'on installe une version récente depuis curl.se.
Sous [PowerShell], il faut taper [curl.exe] et non [curl] : dans [PowerShell], [curl] est un alias d'une autre commande ([Invoke-WebRequest]), qui ne comprend pas les options de [curl]. L'invite de commandes ([cmd]) n'a pas ce problème.