I - Introduction à ExpressJS

1. Présentation d'ExpressJS

Historique et évolution

ExpressJS a été créé par TJ Holowaychuk en 2010 comme une solution légère pour développer des applications web avec Node.js. À cette époque, Node.js commençait tout juste à gagner en popularité, mais il manquait d'un framework web standardisé qui simplifierait le développement d'applications.

L'évolution d'ExpressJS peut être divisée en plusieurs phases importantes :

• 2010-2014 : Développement initial et adoption croissante. TJ Holowaychuk était le principal contributeur.
• 2014 : TJ Holowaychuk quitte le projet, qui est repris par la communauté et StrongLoop.
• 2015 : StrongLoop est acquis par IBM, qui continue à soutenir le développement.
• 2016 : ExpressJS rejoint la Node.js Foundation (devenue plus tard l'OpenJS Foundation).
• 2019-présent : Développement continu avec une attention particulière à la sécurité et aux performances.

Aujourd'hui, ExpressJS est maintenu par l'OpenJS Foundation et bénéficie d'une large communauté de contributeurs. La version actuelle (5.x) apporte des améliorations significatives en termes de performances et de fonctionnalités par rapport aux versions précédentes.

Philosophie et principes de conception

ExpressJS est construit autour de plusieurs principes fondamentaux :

1. Minimalisme : Express fournit uniquement les fonctionnalités essentielles, sans imposer de structure rigide ou de conventions strictes.

2. Flexibilité : Le framework est conçu pour s'adapter à différents styles de programmation et besoins de projet.

3. Non-obstruction : Express ajoute une couche d'abstraction légère sur Node.js sans masquer ses fonctionnalités sous-jacentes.

4. Extensibilité : Le système de middlewares permet d'étendre facilement les fonctionnalités selon les besoins.

5. Performance : La conception légère minimise l'impact sur les performances par rapport à Node.js brut.

Cette philosophie se résume souvent par l'expression "unopinionated" (non dogmatique), ce qui signifie qu'Express ne vous force pas à suivre une structure ou un modèle particulier, contrairement à des frameworks plus prescriptifs comme Ruby on Rails ou Laravel.

Comparaison avec d'autres frameworks

Pour mieux comprendre le positionnement d'ExpressJS, comparons-le à d'autres frameworks populaires :

ExpressJS se distingue par sa simplicité et sa flexibilité, ce qui en fait un excellent choix pour les développeurs qui souhaitent garder le contrôle sur l'architecture de leur application.

Écosystème ExpressJS

L'écosystème ExpressJS est vaste et comprend :

• Middlewares officiels : Modules maintenus par l'équipe ExpressJS (body-parser, cors, etc.)
• Middlewares tiers : Des milliers de modules créés par la communauté
• Frameworks dérivés : Des frameworks construits sur Express (NestJS, Sails.js, etc.)
• Outils de développement : Générateurs d'applications, outils de débogage, etc.
• Documentation et ressources : Tutoriels, livres, cours en ligne

Cet écosystème riche permet aux développeurs de trouver facilement des solutions à la plupart des problèmes courants sans avoir à réinventer la roue.

2. Installation et configuration

Prérequis (Node.js)

Avant d'installer ExpressJS, vous devez avoir Node.js installé sur votre système. Les versions recommandées sont :

• Pour Express 4.x : Node.js 0.10 ou supérieur
• Pour Express 5.x : Node.js 18 ou supérieur

Vous pouvez vérifier votre version de Node.js avec la commande :

1node --version

Si Node.js n'est pas installé ou si vous avez besoin de mettre à jour, visitez nodejs.org pour télécharger la dernière version stable.

Installation via npm

L'installation d'ExpressJS se fait via npm (Node Package Manager), qui est inclus avec Node.js. Pour créer un nouveau projet Express :

1. Créez un nouveau répertoire pour votre projet et accédez-y :

1mkdir mon-projet-express
2cd mon-projet-express

2. Initialisez un projet Node.js :

1npm init -y

Cette commande crée un fichier package.json avec des valeurs par défaut.

3. Installez ExpressJS :

1npm install express

Pour les projets de production, il est recommandé de spécifier la version d'Express :

1npm install express@5.1.0  # Pour installer Express 5.1.0 spécifiquement

Structure de base d'un projet

Une structure de projet ExpressJS typique peut ressembler à ceci :

mon-projet-express/
├── node_modules/        # Dépendances installées
├── public/              # Fichiers statiques (CSS, JS, images)
│   ├── css/
│   ├── js/
│   └── images/
├── routes/              # Définitions des routes
│   ├── index.js
│   └── users.js
├── views/               # Templates pour le rendu côté serveur
│   ├── layouts/
│   └── partials/
├── middlewares/         # Middlewares personnalisés
├── models/              # Modèles de données
├── controllers/         # Logique de contrôleur
├── app.js               # Point d'entrée de l'application
├── package.json         # Métadonnées et dépendances du projet
└── package-lock.json    # Versions exactes des dépendances

Cette structure n'est pas imposée par Express, mais elle représente une organisation courante qui favorise la maintenabilité.

Configuration initiale

Voici un exemple de configuration de base pour une application Express :

1// app.js
2const express = require('express');
3const path = require('path');
4
5// Création de l'application Express
6const app = express();
7
8// Configuration du port
9const port = process.env.PORT || 3000;
10
11// Configuration des middlewares intégrés
12app.use(express.json()); // Pour parser les requêtes JSON
13app.use(express.urlencoded({ extended: false })); // Pour parser les données de formulaire
14app.use(express.static(path.join(__dirname, 'public'))); // Pour servir les fichiers statiques
15
16// Configuration des routes
17app.get('/', (req, res) => {
18  res.send('Hello World!');
19});
20
21// Démarrage du serveur
22app.listen(port, () => {
23  console.log(`Serveur démarré sur http://localhost:${port}`);
24});
25
26module.exports = app; // Pour les tests

Cette configuration de base met en place une application Express qui :

• Parse automatiquement les requêtes JSON et les données de formulaire
• Sert les fichiers statiques depuis le répertoire "public"
• Définit une route simple pour la page d'accueil
• Démarre un serveur sur le port 3000 (ou un port défini par une variable d'environnement)

3. Premier pas avec ExpressJS

Création d'un serveur simple

Créons un serveur HTTP minimal avec ExpressJS :

1// server.js
2const express = require('express');
3const app = express();
4const port = 3000;
5
6app.listen(port, () => {
7  console.log(`Serveur en écoute sur http://localhost:${port}`);
8});

Ce code crée un serveur HTTP qui écoute sur le port 3000, mais il ne fait rien d'autre pour l'instant. Pour le démarrer :

1node server.js

Hello World avec ExpressJS

Ajoutons une route pour répondre aux requêtes :

1// server.js
2const express = require('express');
3const app = express();
4const port = 3000;
5
6// Définition d'une route pour la méthode GET sur le chemin "/"
7app.get('/', (req, res) => {
8  res.send('Hello World!');
9});
10
11app.listen(port, () => {
12  console.log(`Serveur en écoute sur http://localhost:${port}`);
13});

Maintenant, lorsque vous visitez http://localhost:3000 dans votre navigateur, vous verrez "Hello World!" s'afficher.

Structure des requêtes et réponses

ExpressJS enrichit les objets de requête (req) et de réponse (res) de Node.js avec des méthodes et propriétés supplémentaires :

Objet Request (req) :

• req.params : Paramètres de route (ex: /users/:id)
• req.query : Paramètres de requête (ex: ?name=john)
• req.body : Corps de la requête (pour POST, PUT, etc.)
• req.headers : En-têtes HTTP
• req.cookies : Cookies (avec middleware cookie-parser)
• req.path : Chemin de la requête
• req.method : Méthode HTTP (GET, POST, etc.)

Objet Response (res) :

• res.send() : Envoie une réponse
• res.json() : Envoie une réponse JSON
• res.render() : Rend un template
• res.redirect() : Redirige vers une autre URL
• res.status() : Définit le code de statut HTTP
• res.cookie() : Définit un cookie
• res.download() : Invite à télécharger un fichier

Exemple d'utilisation :

1app.get('/users/:id', (req, res) => {
2  const userId = req.params.id;
3  const name = req.query.name || 'Inconnu';
4  
5  res.status(200).json({
6    userId: userId,
7    name: name,
8    message: `Utilisateur ${userId} récupéré avec succès`
9  });
10});

Démarrage et arrêt du serveur

Pour démarrer le serveur, vous exécutez simplement le fichier JavaScript avec Node.js :

1node server.js

Pour arrêter le serveur, vous pouvez utiliser Ctrl+C dans le terminal.

En développement, il est recommandé d'utiliser nodemon pour redémarrer automatiquement le serveur lorsque des fichiers sont modifiés :

1. Installation de nodemon :

1npm install --save-dev nodemon

2. Ajout d'un script dans package.json :

1"scripts": {
2  "start": "node server.js",
3  "dev": "nodemon server.js"
4}

3. Démarrage du serveur en mode développement :

1npm run dev

Pour la gestion des processus en production, des outils comme PM2 sont recommandés :

1npm install -g pm2
2pm2 start server.js --name "mon-app-express"

Exercices pratiques

Exercice 1: Créer un serveur ExpressJS simple

Créez un serveur ExpressJS qui répond "Hello World" sur la route principale et affiche la date et l'heure actuelles sur la route "/date".

Exercice 2: Configuration d'un projet ExpressJS

Créez un projet ExpressJS complet avec la structure de répertoires recommandée et configurez-le pour servir des fichiers statiques et gérer différentes routes.

Ressources supplémentaires

• Documentation officielle d'ExpressJS
• GitHub d'ExpressJS
• Tutoriel MDN sur Express/Node.js
• Express Generator - Outil pour générer rapidement une structure d'application