Skip to main content
Ce guide a pour objectif d’aligner l’environnement de travail de toute l’équipe pour le TP. Nous allons installer les outils nécessaires, configurer Node.js (LTS) avec npm, installer les extensions indispensables pour WebStorm, et initialiser nos configurations sur Apidog.

​
1. Les Outils Principaux : Utilité et Installation

​
🖥️ WebStorm (IDE Frontend & API)

Utilité : C’est un environnement de développement intégré (IDE) ultra-complet de JetBrains, spécialisé dans l’écosystème JavaScript/TypeScript. Il offre une autocomplétion intelligente, une gestion de Git intégrée et un terminal performant.
  • Fonctionnement : Il analyse le code en temps réel pour détecter les erreurs, formater le code selon les bonnes pratiques et automatiser les refactorisations (renommage de variables, imports automatiques).
  • Téléchargement : Télécharger WebStorm
💡 Astuce : Au premier lancement, choisissez l’option “Non-commercial use” (Usage non-commercial) pour l’utiliser gratuitement.

​
🗄️ DataGrip (Gestionnaire de Base de Données)

  • Utilité : C’est l’outil de JetBrains dédié aux bases de données. Il permet de se connecter à PostgreSQL, d’explorer les tables, d’exécuter des requêtes SQL et de visualiser les données graphiquement.
  • Fonctionnement : Il se connecte via un driver à votre conteneur PostgreSQL local ou distant et fournit une interface visuelle pour administrer la base sans taper de lignes de commande complexes.
  • Téléchargement : Télécharger DataGrip
💡 Astuce : Tout comme WebStorm, cochez “Non-commercial use” au démarrage pour bénéficier de la gratuité.

​
🐳 Docker Desktop (Conteneurisation)

  • Utilité : Permet de lancer des applications et services (comme notre base PostgreSQL) dans des environnements isolés appelés “conteneurs”. Cela évite d’avoir à installer PostgreSQL “en dur” sur vos machines et garantit que tout le monde a exactement la même version.
  • Fonctionnement : Il lit un fichier de configuration docker-compose.yml) et télécharge une image officielle (ex: Postgres 16) pour l’exécuter instantanément en tâche de fond.
  • Téléchargement : Télécharger Docker Desktop

​
🐕 Apidog (Requêtes et Documentation API)

  • Utilité : Outil tout-en-un pour concevoir, tester et documenter les APIs. Il remplace avantageusement Postman en intégrant nativement la génération de documentation et le mock de données.
  • Fonctionnement : Il envoie des requêtes HTTP (GET, POST, etc.) vers votre serveur NestJS local et affiche la réponse (JSON, codes de statut) de manière structurée.
  • Téléchargement : Télécharger Apidog

​
📦 2. Tutoriel : Installation de Node.js (LTS) et NPM

Pour éviter les conflits de versions entre collègues, nous installons la version Node.js LTS (Long Term Support).

​
🪟 Méthode pour Windows (Via NVM-Windows)

Il est fortement déconseillé d’installer Node via le site officiel directement, car changer de version plus tard devient complexe. Nous utilisons NVM (Node Version Manager).
  1. Télécharger NVM : Allez sur le GitHub de nvm-windows, téléchargez le fichier nvm-setup.exe (de la dernière version) et installez-le.
  2. Ouvrir un terminal (PowerShell ou Invite de commandes) en mode Administrateur.
  3. Installer Node LTS : Tapez la commande suivante pour installer la version LTS actuelle :
nvm install lts
  1. Activer la version :
nvm use lts
  1. Vérifier l’installation :
node -v
npm -v

​
🐧 Méthode pour Linux (Ubuntu / Debian / Mint)

Sur Linux, nous utilisons également nvm pour éviter d’utiliser sudo avec npm, ce qui casse souvent les permissions.
  1. Installer NVM : Ouvrez votre terminal et exécutez le script d’installation officiel :
curl -o- [https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh](https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh) | bash
  1. Recharger le terminal : Fermez et réouvrez votre terminal, ou tapez :
source ~/.bashrc
  1. Installer Node LTS :
nvm install --lts
  1. Vérifier l’installation :
node -v
npm -v

​
🔌 3. Plugins WebStorm Indispensables

Pour installer un plugin dans WebStorm : Settings/Preferences (Ctrl+Alt+S) -> Plugins -> Onglet Marketplace -> Chercher le plugin -> Install.
Nom du PluginUtilité / Pourquoi l’installer ?
PrettierIndispensable pour le code propre. Il reformate automatiquement votre code (indentation, points-virgules, guillemets) à chaque sauvegarde. Tout le monde aura ainsi exactement le même style de code.
DockerPermet de gérer vos conteneurs Docker (les allumer, les éteindre, voir les logs de la base Postgres) directement depuis un onglet dans WebStorm, sans ouvrir l’application Docker Desktop.
Dotenv (…)Ajoute la coloration syntaxique et l’autocomplétion pour les fichiers .env (où nous stockerons les identifiants de la base de données).
NestJS ToolkitAjoute des raccourcis et facilite la navigation entre les modules, contrôleurs et services spécifiques à l’architecture NestJS.

​
🚀 4. Premières Configurations : Premier appel API avec Apidog

Une fois que notre projet NestJS tourne en local (généralement sur le port 3000), voici comment configurer Apidog pour tester le point d’accès (endpoint) “Hello World”.

​
Étape 1 : Créer un projet dans Apidog

  1. Ouvrez Apidog et connectez-vous (ou utilisez le mode invité).
  2. Cliquez sur “New Project”.
  3. Nommez-le (ex: TP Fullstack) et choisissez le type HTTP.

​
Étape 2 : Configurer l’Environnement (Bonne pratique)

Au lieu d’écrire http://localhost:3000 manuellement dans chaque requête, on crée une variable d’environnement :
  1. En haut à droite, cliquez sur l’icône d’engrenage ou sur le menu déroulant des environnements (par défaut “No Environment”).
  2. Cliquez sur “Manage Environments” -> “New Environment”.
  3. Nommez-le Local.
  4. Dans la section Base URL, ajoutez une ligne :
  • Name : Général (ou laissez vide pour l’URL par défaut)
  • URL : http://localhost:3000
  1. Cliquez sur Save. Sélectionnez ensuite Local dans le menu déroulant en haut à droite.

​
Étape 3 : Créer et exécuter la première requête API

  1. Dans la barre latérale gauche, cliquez sur le bouton ”+” à côté de API puis sur “New API”.
  2. Configuration de la requête :
  • Méthode HTTP : GET (dans le menu déroulant).
  • URL : Tapez simplement / (Apidog va automatiquement préfixer avec l’URL de votre environnement local, ce qui donnera http://localhost:3000/).
  • Nom de la requête : Changez “New API” en Hello World.
  1. Tester : Cliquez sur l’onglet “Run” (ou le bouton bleu Send).
  2. Résultat : Dans la partie inférieure (Response), vous devriez voir le statut 200 OK et le texte renvoyé par NestJS : "Hello World!".