Jour 46 de mon apprentissage de la stack MERN

J'en suis à 46 jours dans mon apprentissage de la stack MERN.

Hier, j'ai configuré Tailwind CSS. Aujourd'hui, j'ai appris le moteur de templating EJS.

Avant aujourd'hui, mes pages HTML étaient statiques. Elles ne pouvaient pas afficher de changements provenant du serveur.

EJS permet le rendu côté serveur (server-side rendering). Il crée du HTML en utilisant des données en temps réel provenant de votre backend. Vous écrivez de la logique JavaScript directement à l'intérieur de votre HTML.

Voici comment je l'ai configuré aujourd'hui :

  • J'ai indiqué à Express d'utiliser EJS comme moteur de vue (view engine).
  • J'ai créé un répertoire views pour mes templates.
  • J'ai utilisé la méthode res.render pour envoyer des données au frontend.

Le code ressemble à ceci :

const express = require("express"); const app = express(); const users = require("./MOCK_DATA.json");

app.set("view engine", "ejs");

app.get("/users-list", (req, res) => { res.render("users", { allUsers: users }); });

app.listen(8000);

Cette méthode connecte mes données à mon interface utilisateur (UI) instantanément.

Source : https://dev.to/ali_hamza_589ec7b3eb6688d/day-46-of-learning-mern-stack-15dh