Express JS › Construire une App avec le Générateur

De quoi s’agit-il ?

Express n’impose aucune structure ou composants à utiliser. Il s’agit d’un micro framework minimaliste. Les routes, les vues, les fichiers statiques (css, js, médias…) et toute autre logique spécifique à l’application peuvent être structurés dans un nombre quelconque de fichiers avec n’importe quelle structure de répertoire.

Bien qu’il soit parfaitement possible d’avoir l’ensemble de l’application Express dans un unique fichier, il est d’usage de diviser votre application en fichiers découpés par fonctions de l’application tout en suivant une architecture de développement (MVC…).

En ce sens, Express propose un générateur d’application nommé express-generator, qui permet de rapidement mettre sur pied un squelette d’application modulaire que nous pouvons facilement étendre pour créer des applications web.

Ce package va ainsi nous permettre de générer automatiquement les grands aspects abordés au cours de cette formation : création de serveur, middlewares, routage, modules, moteur de template…

Installer le générateur

npm install express-generator -g

Utiliser le générateur

Création de l’application

La commande Express permet de créer un projet par le biais de ce générateur. Vous pouvez visualiser ses options avec la commande suivante :

express -h

On peut par exemple créer un projet nommé 📁 demo contenant un squelette d’application Express. Ce projet initialisera le moteur de template Pug, le préprocesseur Sass ainsi qu’un fichier 📄 .gitignore à la racine.

express demo --view pug --css sass --git

Installation des dépendances

cd demo
npm install

Exécution de l’application

set DEBUG=demo:*
npm start

DEBUG=demo:*
npm start

L’application est générée selon l’arborescence suivante :

├── 📂 bin
│   └── 📄 www
├── 📂 public
│   ├── 📂 images
│   ├── 📂 javascripts
│   └── 📂 stylesheets
│       └── 📄 style.sass
├── 📂 routes
│   ├── 📄 index.js
│   └── users.js
├── 📂 views
│   ├── 📄 error.pug
│   ├── 📄 index.pug
│   └── 📄 layout.pug
├── 📄 .gitignore
├── 📄 app.js
├── 📄 package.json

Elle est par défaut accessible sur le port 3000 à l’adresse : http://localhost:3000.