Skip to content

Structure de l'application Express

Il n'y a pas une "bonne" manière de structurer une application, mais il y a des pratiques et des principes généraux qui peuvent guider cette structuration.

Choix de la Structure: MVC et API REST

Nous avons structuré l'application en nous basant sur une architecture MVC (Model-View-Controller) en combinaison avec les principes de l'API REST.

MVC:

  • Model (Modèle): Gère la logique liée aux données et à la base de données.
  • View (Vue): Présente les données à l'utilisateur. C'est la couche d'interface utilisateur.
  • Controller (Contrôleur): Interagit entre le modèle et la vue. Il prend les entrées de l'utilisateur via la vue et les processus avec l'aide du modèle et renvoie le résultat final à la vue.

Dans le contexte d'une API REST, les vues sont généralement omises car les réponses sont souvent envoyées au format JSON, et c'est au client de décider comment présenter ces données à l'utilisateur.

API REST:

  • Se basant sur les principes REST, le projet est structuré de manière à organiser les routes, les contrôleurs, et les services de manière logique et cohérente.
  • Les routes définissent les points d'extrémité de l'API et dirigent les requêtes vers les bons contrôleurs.
  • Les contrôleurs traitent les requêtes entrantes et renvoient les réponses appropriées.
  • Les services contiennent la logique métier et interagissent avec les modèles ou les bases de données.

Pourquoi cette Structure ?

  • Organisation et Clarté:

    • Aide à maintenir une séparation claire des préoccupations (Separation of Concerns - SoC), ce qui rend le code plus lisible et maintenable.
    • Facilite la navigation dans le code, particulièrement dans les grands projets.
  • Scalabilité et Maintenabilité:

    • Facilite l'ajout de nouvelles fonctionnalités et composants.
    • Permet de trouver et de résoudre les bugs de manière plus efficace.
  • Collaboration:

    • Aide les développeurs à travailler ensemble plus efficacement en réduisant les conflits de code et en clarifiant les responsabilités.

Adaptabilité

Même si cette structure basée sur MVC et API REST est largement utilisée et éprouvée, vous devez vous sentir libre d'adapter et de modifier cette structure selon les besoins spécifiques de votre projet et de votre équipe. Certaines équipes pourraient préférer une architecture basée sur des microservices, d'autres pourraient adopter une architecture orientée domaine (Domain-Driven Design - DDD), et d'autres pourraient choisir une structure entièrement différente. L'important est de choisir une structure qui soutient les objectifs du projet et favorise la clarté, la maintenabilité, et la scalabilité.

Structure des Dossiers

Pour un projet plus avancé et structuré, nous pouvons donc diviser notre application en plusieurs fichiers et dossiers pour séparer les responsabilités. Voici une structure de dossier améliorée:

plaintext
MonProjetExpress/
├── node_modules/
├── public/
│   ├── images/
│   ├── stylesheets/
│   └── javascripts/
├── src/
│   ├── api/
│   │   ├── controllers/
│   │   │   └── utilisateurController.js
│   │   ├── services/
│   │   │   └── utilisateurService.js
│   │   └── routes/
│   │       └── utilisateurRoutes.js
│   ├── app.js
│   └── server.js
└── package.json
MonProjetExpress/
├── node_modules/
├── public/
│   ├── images/
│   ├── stylesheets/
│   └── javascripts/
├── src/
│   ├── api/
│   │   ├── controllers/
│   │   │   └── utilisateurController.js
│   │   ├── services/
│   │   │   └── utilisateurService.js
│   │   └── routes/
│   │       └── utilisateurRoutes.js
│   ├── app.js
│   └── server.js
└── package.json

1. Création des Dossiers et Fichiers

Après avoir créé votre dossier de projet et initialisé un projet Node.js, créez cette structure de dossier dans votre projet.

2. Installation d'Express

sh
npm install express
npm install express

3. Création des Fichiers de Base

src/app.js

javascript
import express from 'express';
import utilisateurRoutes from './api/routes/utilisateurRoutes';

const app = express();

app.use(express.json());
app.use(express.urlencoded({ extended: false }));

app.use('/api/utilisateurs', utilisateurRoutes);

export default app;
import express from 'express';
import utilisateurRoutes from './api/routes/utilisateurRoutes';

const app = express();

app.use(express.json());
app.use(express.urlencoded({ extended: false }));

app.use('/api/utilisateurs', utilisateurRoutes);

export default app;

src/server.js

javascript
import app from './app';

const PORT = 3000;
app.listen(PORT, () => {
  console.log(`Serveur démarré sur le port ${PORT}`);
});
import app from './app';

const PORT = 3000;
app.listen(PORT, () => {
  console.log(`Serveur démarré sur le port ${PORT}`);
});

Dossiers api

utilisateurRoutes.js
javascript
import express from 'express';
import utilisateurController from '../controllers/utilisateurController';

const router = express.Router();

router.get('/', utilisateurController.getListeUtilisateurs);

export default router;
import express from 'express';
import utilisateurController from '../controllers/utilisateurController';

const router = express.Router();

router.get('/', utilisateurController.getListeUtilisateurs);

export default router;
utilisateurController.js
javascript
import utilisateurService from '../services/utilisateurService';

const utilisateurController = {
  getListeUtilisateurs: (req, res) => {
    const utilisateurs = utilisateurService.getListeUtilisateurs();
    res.send(utilisateurs);
  },
};

export default utilisateurController;
import utilisateurService from '../services/utilisateurService';

const utilisateurController = {
  getListeUtilisateurs: (req, res) => {
    const utilisateurs = utilisateurService.getListeUtilisateurs();
    res.send(utilisateurs);
  },
};

export default utilisateurController;
utilisateurService.js
javascript
const utilisateurService = {
  getListeUtilisateurs: () => {
    // Ici, normalement, vous interagiriez avec la base de données pour récupérer les utilisateurs
    return ['Utilisateur1', 'Utilisateur2'];
  },
};

export default utilisateurService;
const utilisateurService = {
  getListeUtilisateurs: () => {
    // Ici, normalement, vous interagiriez avec la base de données pour récupérer les utilisateurs
    return ['Utilisateur1', 'Utilisateur2'];
  },
};

export default utilisateurService;

4. Lancement de l'Application

Une fois que tout est en place, vous pouvez lancer votre application avec la commande suivante:

sh
node src/server.js
node src/server.js

Ou si vous utilisez nodemon, utilisez:

sh
nodemon src/server.js
nodemon src/server.js