Leçon 5 / 8
Leçon 05 · Node.js

Express — les bases

Pourquoi Express ?

Node.js permet de créer un serveur HTTP en quelques lignes, mais dès que ton application grossit, gérer manuellement chaque URL, chaque méthode HTTP et chaque réponse devient fastidieux. Express.js est un framework minimaliste qui simplifie tout ça.

Il ajoute une couche de routing, de middleware et d'utilitaires par-dessus le http natif de Node. C'est le framework web le plus utilisé dans l'écosystème Node.js.

💡

Express n'est pas inclus dans Node.js — c'est un paquet npm à installer. Il reste très léger : il t'offre le strict nécessaire et te laisse ajouter uniquement ce dont tu as besoin.

Installer Express

Dans le répertoire de ton projet, initialise npm si ce n'est pas déjà fait, puis installe Express comme dépendance de production :

Terminal
# Initialiser le projet (crée package.json)
npm init -y

# Installer Express
npm install express

# express apparaît dans node_modules/ et dans package.json

Créer une app Express

La structure minimale d'une application Express tient en cinq lignes. On importe Express, on crée l'instance app, on définit au moins une route, puis on démarre le serveur avec app.listen().

server.js
const express = require('express');
const app = express();

// Route d'accueil
app.get('/', (req, res) => {
  res.send('Bonjour depuis Express !');
});

// Démarrer le serveur sur le port 3000
app.listen(3000, () => {
  console.log('Serveur démarré sur http://localhost:3000');
});

Lance-le avec node server.js, puis ouvre http://localhost:3000 dans ton navigateur.

Routes GET

Une route GET répond aux requêtes de type GET — c'est ce que fait ton navigateur quand tu tapes une URL. La méthode app.get(chemin, callback) définit la route.

server.js
// Route d'accueil
app.get('/', (req, res) => {
  res.send('Page d\'accueil');
});

// Route /articles
app.get('/articles', (req, res) => {
  res.json([{ id: 1, titre: 'Premier article' }]);
});

// Route avec paramètre dynamique : /articles/42
app.get('/articles/:id', (req, res) => {
  res.send('Article n° ' + req.params.id);
});

Routes POST

Les routes POST reçoivent des données envoyées par un formulaire ou une API. Pour lire le corps (body) d'une requête JSON, il faut activer le middleware express.json() avant de déclarer les routes.

server.js
// Middleware pour parser le JSON
app.use(express.json());

// Route POST /articles
app.post('/articles', (req, res) => {
  const { titre, contenu } = req.body;
  console.log('Reçu :', titre, contenu);
  res.status(201).json({ message: 'Article créé', titre });
});

req.params, req.query, req.body

Express expose les données de la requête sur l'objet req en trois endroits selon leur origine :

  • req.params — segments dynamiques de l'URL. Ex : /articles/:idreq.params.id.
  • req.query — paramètres de la query string. Ex : /articles?page=2req.query.page.
  • req.body — corps de la requête (JSON, formulaire). Nécessite un middleware de parsing.
server.js
// GET /articles/7?lang=fr
app.get('/articles/:id', (req, res) => {
  const id   = req.params.id;   // "7"
  const lang = req.query.lang;  // "fr"
  res.json({ id, lang });
});

res.send, res.json, res.status

L'objet res contient les méthodes pour construire et envoyer la réponse HTTP :

  • res.send(texte) — envoie du texte brut ou du HTML. Définit automatiquement le Content-Type.
  • res.json(objet) — sérialise l'objet en JSON et définit Content-Type: application/json.
  • res.status(code) — définit le code HTTP. Se chaîne avec .send() ou .json().
server.js
// Réponse 200 avec JSON
res.json({ ok: true });

// Erreur 404
res.status(404).send('Page introuvable');

// Erreur serveur 500 avec JSON
res.status(500).json({ erreur: 'Problème interne' });

Servir des fichiers statiques

Pour servir des images, CSS, JavaScript ou tout autre fichier statique, Express fournit le middleware intégré express.static(). Indique-lui le dossier racine et il gère automatiquement les requêtes vers ces fichiers.

server.js
// Les fichiers dans le dossier "public/" sont servis directement
// Ex : public/style.css → accessible via /style.css
app.use(express.static('public'));

// Avec un préfixe d'URL : /static/style.css
app.use('/static', express.static('public'));

Place express.static() avant tes routes dans le code. Les fichiers statiques sont servis en premier, ce qui évite qu'une route ne capture par erreur une requête vers un asset (image, CSS…).

Moteurs de template — introduction

Express peut générer du HTML dynamique côté serveur grâce à des moteurs de template. Les deux plus populaires sont :

  • EJS (Embedded JavaScript) — syntaxe proche du HTML avec des balises <% %>. Facile à prendre en main si tu connais déjà HTML.
  • Pug (anciennement Jade) — syntaxe épurée sans balises fermantes, basée sur l'indentation. Plus concis, mais avec une courbe d'apprentissage plus marquée.
server.js — EJS
npm install ejs

// Déclarer EJS comme moteur de vues
app.set('view engine', 'ejs');
app.set('views', './views');

// Rendre le template views/index.ejs
app.get('/', (req, res) => {
  res.render('index', { titre: 'Mon site Express' });
});
// À retenir
  • npm install express — Express n'est pas inclus dans Node, il s'installe via npm.
  • const app = express() crée l'instance de l'application ; app.listen(port) démarre le serveur.
  • app.get(route, callback) et app.post(route, callback) définissent les routes.
  • req.params / req.query / req.body — trois sources de données dans la requête.
  • res.send(), res.json(), res.status(code).send() — construire la réponse HTTP.
  • express.static('public') sert automatiquement les fichiers statiques d'un dossier.