Ngày 46 học MERN Stack

Ngày 46 học MERN Stack

Tôi đã bước sang ngày thứ 46 trong hành trình học MERN stack của mình.

Hôm qua tôi đã thiết lập Tailwind CSS. Hôm nay tôi đã học về EJS templating engine.

Trước hôm nay, các trang HTML của tôi chỉ là tĩnh. Chúng không thể hiển thị các thay đổi từ phía server.

EJS cho phép server-side rendering. Nó tạo ra HTML bằng cách sử dụng dữ liệu trực tiếp từ backend của bạn. Bạn có thể viết logic JavaScript ngay bên trong tệp HTML của mình.

Đây là cách tôi đã thiết lập nó hôm nay:

• Tôi đã yêu cầu Express sử dụng EJS làm view engine.
• Tôi đã tạo một thư mục views cho các template của mình.
• Tôi đã sử dụng phương thức res.render để gửi dữ liệu lên frontend.

Đoạn mã trông như thế này:

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

Phương pháp này giúp kết nối dữ liệu với UI của tôi một cách tức thì.

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