Tag 46 beim Lernen des MERN-Stacks

Ich bin nun seit 46 Tagen auf meiner MERN-Stack-Reise.

Gestern habe ich Tailwind CSS eingerichtet. Heute habe ich die EJS-Templating-Engine gelernt.

Vor heute waren meine HTML-Seiten statisch. Sie konnten keine Änderungen vom Server anzeigen.

EJS ermöglicht Server-Side Rendering. Es erstellt HTML mithilfe von Live-Daten aus deinem Backend. Du schreibst JavaScript-Logik direkt in dein HTML.

So habe ich es heute eingerichtet:

  • Ich habe Express angewiesen, EJS als View Engine zu verwenden.
  • Ich habe ein views-Verzeichnis für meine Templates erstellt.
  • Ich habe die res.render-Methode verwendet, um Daten an das Frontend zu senden.

Der Code sieht so aus:

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);

Diese Methode verbindet meine Daten sofort mit meiner UI.

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