יום 46 של למידת MERN Stack

יום 46 של למידת MERN Stack

אני ביום ה-46 במסע שלי עם ה-MERN stack.

אתמול הגדרתי את Tailwind CSS. היום למדתי את מנוע התבניות EJS.

לפני היום, דפי ה-HTML שלי היו סטטיים. הם לא יכלו להציג שינויים מהשרת.

EJS מאפשר Server-side rendering. הוא יוצר HTML באמצעות נתונים חיים מה-backend שלך. אתה כותב לוגיקת JavaScript ישירות בתוך ה-HTML שלך.

כך הגדרתי זאת היום:

• אמרתי ל-Express להשתמש ב-EJS כ-view engine.
• יצרתי תיקיית views עבור התבניות שלי.
• השתמשתי במתודה res.render כדי לשלוח נתונים ל-frontend.

הקוד נראה כך:

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

השיטה הזו מחברת את הנתונים שלי ל-UI באופן מיידי.

מקור: https://dev.to/ali_hamza_589ec7b3eb6688d/day-46-of-learning-mern-stack-15dh