روز ۴۶ یادگیری MERN Stack

۴۶ روز از مسیر یادگیری MERN stack من می‌گذرد.

دیروز Tailwind CSS را راه‌اندازی کردم. امروز موتور قالب‌سازی EJS را یاد گرفتم.

قبل از امروز، صفحات HTML من استاتیک بودند. آن‌ها نمی‌توانستند تغییرات سمت سرور را نمایش دهند.

EJS امکان رندرینگ سمت سرور (server-side rendering) را فراهم می‌کند. این موتور با استفاده از داده‌های زنده از بک‌اند شما، HTML تولید می‌کند. شما می‌توانید منطق JavaScript را مستقیماً داخل HTML خود بنویسید.

روش راه‌اندازی من در امروز به این صورت بود:

  • به Express گفتم که از EJS به عنوان view engine استفاده کند.
  • یک دایرکتوری views برای قالب‌هایم ایجاد کردم.
  • از متد res.render برای ارسال داده‌ها به فرانت‌اند استفاده کردم.

کد به این شکل است:

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