Maison > interface Web > js tutoriel > « Dans le design pattern MVC, pourquoi le routeur est-il indispensable ? Quel rôle joue-t-il ? »

« Dans le design pattern MVC, pourquoi le routeur est-il indispensable ? Quel rôle joue-t-il ? »

Susan Sarandon
Libérer: 2024-12-19 13:06:10
original
161 Les gens l'ont consulté

Une compétence souvent négligée mais vitale pour maîtriser le modèle MVC ou des architectures similaires est la compréhension de leurs principes fondamentaux. Ici, nous démystifions le concept et le décomposons de manière claire et facile à suivre :

Aperçu du modèle MVC

“In the MVC design pattern, why is the router indispensable? What role does it play?

Modèle : **Gère les données et la logique métier (Exemple : récupérer ou stocker des données dans la base de données).
**Affichage :
Affiche les données à l'utilisateur (Exemple : HTML, modèles ou interface utilisateur).
Contrôleur : Agit comme « intermédiaire », assurant la coordination entre le modèle et la vue.

Mais… comment l'application sait-elle quel contrôleur appeler lorsque l'utilisateur interagit avec elle ? C'est là qu'interviennent les routes (ou le routeur).

Curieux de savoir ? Démystifions,…

Quel est le rôle du routeur ?

Le routeur est comme un agent de la circulation. Il dirige les requêtes des utilisateurs vers la fonction de contrôleur appropriée en fonction de l'URL à laquelle ils tentent d'accéder. Par exemple :

Si un utilisateur visite yourapp.com/login, le routeur garantit que le contrôleur de connexion est déclenché.

S'ils accèdent à yourapp.com/profile, le routeur active le contrôleur de profil.

Sans routes, votre application ne saurait pas quelle logique exécuter pour une action ou une demande utilisateur donnée.

Pourquoi le routeur est-il d'une importance cruciale ?

D’après nos connaissances jusqu’à présent, pouvons-nous au moins imaginer son importance ?

1. Traitement organisé des demandes :

o Les itinéraires créent une carte claire du comportement de votre application.

o Au lieu de fourrer de la logique partout, vous attribuez des responsabilités telles que :

/users → Gérer les actions des utilisateurs.

/products → Gérer les actions produit.

2. Séparation des préoccupations :

o Le routage sépare la logique URL-contrôleur du reste de votre code.

o Cela permet à votre application de rester modulaire et plus facile à maintenir.

3. Comportement dynamique :

o Les routes vous permettent de gérer des paramètres dynamiques. Par exemple :

/users/:id → Peut récupérer dynamiquement les données utilisateur en fonction de leur identifiant unique.

4. Intégration middleware :

o Les routeurs vous permettent de brancher facilement un middleware pour des itinéraires spécifiques. Exemple :

Ajoutez des contrôles d'authentification uniquement aux routes protégées telles que /dashboard.

5. Évolutivité :

o Dans les applications plus volumineuses, le routeur vous permet de diviser les routes en modules (Exemple : routes liées à l'utilisateur, routes d'administration, etc…).

o Cela facilite la mise à l'échelle de la logique de votre application.

Comment cela s'intègre-t-il dans MVC

Considérez le routeur comme le point de connexion :

Un utilisateur fait une requête (Exemple : GET /products/123).
Le routeur vérifie sa liste de règles et détermine :
Quel contrôleur appeler.
Quelle fonctionnalité exécuter dans ce contrôleur (Exemple : récupérer le produit avec l'ID 123).

  1. Le contrôleur utilise ensuite le modèle pour obtenir les données et les transmet à la vue pour affichage.

Exemple d'exemple pour avoir une bonne compréhension

Utilisons Node's Express.js

Routeur (routes/products.js) :

const express = require('express');
const router = express.Router(); // Invoking express's router library
const productController = require('../controllers/productController'); // Importing the controller routes

// Define a route for fetching a product by ID
router.get('/:id', productController.getProductById);

// Exporting routes to be eccessible in app.js
module.exports = router;
Copier après la connexion

Contrôleur (controllers/productController.js) :

exports.getProductById = (req, res) => {
  const productId = req.params.id;
  // Call the Model to get product data. Notice here I'm using NoSQL(MongoDb) querying language.
  const product = Product.findById(productId);
  res.json(product); // Send product data to the user
};
Copier après la connexion

Application (app.js) : la première entrée d'application

const express = require('express');
const app = express();
const productRoutes = require('./routes/products');

// The route to be triggered when user requests a product
app.use('/products', productRoutes);

app.listen(3000, () => console.log('Server running on port 3000'));
Copier après la connexion

Quand un utilisateur demande un produit spécifique par exemple, la première entrée de l'application qui est app.js appelle les routes définies (ici productRoutes). La fonction productRoutes hundler appelle la fonction appropriée dans le fichier routes/products.js (ici getProductById) qui est importé du dossier des contrôleurs (ici contrôleurs/productController.js) mais affecté à la constante productController. La fonction du contrôleur appelle le modèle pour obtenir les données du produit et finalement mettre à jour la vue avec les données. Notez que c'est le contrôleur (l'intermédiaire) qui met à jour la vue avec les données récupérées.

En résumé

Le routeur est indispensable car il :

Décide quel contrôleur activer en fonction de l'URL.
Maintient votre code modulaire, propre et évolutif.
Ajoute de la flexibilité avec des chemins dynamiques, un middleware et un comportement personnalisé.

Sans routeur, votre application serait chaotique et presque impossible à faire évoluer à mesure que vous ajoutez plus de fonctionnalités !

Merci et…Bon codage…

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:dev.to
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal