MERN স্ট্যাক শেখার ৪৬তম দিন

MERN Stack শেখার ৪৬তম দিন

আমার MERN stack শেখার যাত্রা আজ ৪৬তম দিনে পদার্পণ করল।

গতকাল আমি Tailwind CSS সেটআপ করেছি। আজ আমি EJS templating engine শিখেছি।

আজ পর্যন্ত আমার HTML পেজগুলো ছিল স্ট্যাটিক। সেগুলো সার্ভার থেকে আসা পরিবর্তনগুলো দেখাতে পারত না।

EJS সার্ভার-সাইড রেন্ডারিং (server-side rendering) করতে সাহায্য করে। এটি আপনার ব্যাকএন্ড থেকে আসা লাইভ ডেটা ব্যবহার করে HTML তৈরি করে। আপনি সরাসরি আপনার HTML-এর ভেতরে JavaScript লজিক লিখতে পারেন।

আজ আমি যেভাবে এটি সেটআপ করেছি তা নিচে দেওয়া হলো:

• আমি 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