MERN Stack سیکھنے کا 46واں دن

میں MERN stack سیکھنے کے اپنے 46 روزہ سفر میں ہوں۔

کل میں نے Tailwind CSS سیٹ اپ کیا تھا۔ آج میں نے EJS templating engine سیکھا۔

آج سے پہلے میرے HTML صفحات static تھے۔ وہ سرور سے ہونے والی تبدیلیوں کو ظاہر نہیں کر سکتے تھے۔

EJS server-side rendering کی اجازت دیتا ہے۔ یہ آپ کے backend سے لائیو ڈیٹا کا استعمال کرتے ہوئے HTML تخلیق کرتا ہے۔ آپ براہ راست اپنے HTML کے اندر JavaScript logic لکھ سکتے ہیں۔

آج میں نے اسے اس طرح سیٹ اپ کیا:

  • میں نے Express کو EJS کو view engine کے طور پر استعمال کرنے کے لیے کہا۔
  • میں نے اپنے templates کے لیے ایک views ڈائریکٹری بنائی۔
  • میں نے frontend پر ڈیٹا بھیجنے کے لیے 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