Générateur Express.js

• Plutôt que de créer une application Express.js à partir de zéro, on peut utiliser un générateur d’application Express.js pour créer une structure de projet de base.

• express-generator est le générateur d’application Express.js officiel qui crée une structure de projet de base pour une application Express.js.

• Il est recommandé d’utiliser express-generator pour générer une application Express.js, car cela vous permet de gagner du temps en évitant de créer la structure de projet manuellement.

Installation de express-generator

Pour utiliser express-generator sans l’installer globalement, on pourra utiliser npx :

npx express-generator [options] [nom]

Ou on peut l’installer globalement avec npm, et alors on pourra utiliser la commande express de n’importe où :

npm install -g express-generator

Création d’une application Express.js

Pour créer une application Express.js avec express-generator après l’avoir installé globalement, on peut utiliser la commande express :

express [options] [nom]

Info

Historiquement, Jade était utilisé comme moteur de template par Express.js et est toujours utilisé par défaut par express-generator.

Cependant, Jade a été renommé en Pug en 2012 et il sera bientôt déprécié au profit de Pug.

On peut déjà utiliser Pug à la place de Jade en passant l’option --view=pug à express-generator.

Créons une application Express.js avec express-generator !

Placez vous dans le répertoire où vous souhaitez créer l’application, par exemple tutoriel-api, puis exécutez la commande suivante :

express --view=pug myapp

Rappel

Un moteur de template est utilisé pour générer des pages HTML à partir d’une syntaxe simplifiée.

Anti-sèche Pug - Référence rapide sur la syntaxe de Pug.

Cela dit, dans ce tutoriel nous n’allons pas vraiment utiliser le moteur de template et les views, nous allons plutôt nous concentrer sur la création d’une API RESTful avec Express.js.

Le générateur crée une structure de projet de base pour une application Express.js :

myapp/
├── bin/
│   └── www
├── public
├── routes/
│   ├── index.js
│   └── users.js
├── views/
│   ├── error.pug
│   ├── index.pug
│   └── layout.pug
├── app.js
├── package.json

Et nous précise qu’il faut se placer dans le répertoire de l’application, installer les dépendances, puis lancer le serveur en mode développement.

Comme précédemment, on modifie le fichier package.json pour utiliser nodemon à la place de node pour le script start :

1. Ajout de nodemon en tant que dépendance de développement, puis installons les dépendances :

cd myapp
npm install --save-dev nodemon
npm install

2. Modification du script start dans le fichier package.json pour utiliser nodemon :

package.json

"scripts": {
  "start": "nodemon ./bin/www"
}

3. Lançons l’application avec npm start :

DEBUG=myapp:* npm start

Ouvrez votre navigateur et accédez à http://localhost:3000/ pour voir la page d’accueil de l’application Express.js :

4. Ajoutez le dossier myapp à votre éditeur de code et prenez un temps pour explorer les fichiers et dossiers générés.

5. Modifiez le fichier views/index.pug pour afficher un message différent sur la page d’accueil.

6. Effectuez un commit Git de vos modifications ou bien initialisez un nouveau dépôt Git si vous avez installé cette application dans un nouveau répertoire.

Dans la section suivante, nous allons explorer les routes créées par défaut par le générateur Express.js et ajouter des routes supplémentaires pour gérer les opérations CRUD (Create, Read, Update, Delete) sur une ressource utilisateur.