𝗗𝗮𝘆 𝟰𝟰 𝗼𝗳 𝗟𝗲𝗮𝗿𝗻𝗶𝗻𝗴 𝗠𝗘𝗥𝗡 𝗦𝘁𝗮𝗰𝗸 کا اردو ترجمہ:

𝗠𝗘𝗥𝗡 𝗦𝘁𝗮𝗰𝗸 سیکھنے کا 𝟰٤ واں دن

میرا Express.js سرور پہلے صرف JSON ڈیٹا بھیجا کرتا تھا۔ آج میں نے اسے تبدیل کر دیا۔

میں نے سیکھا کہ اپنے بیک اینڈ سے براہ راست HTML، CSS، اور تصاویر کیسے فراہم کی جاتی ہیں۔ یہ میرے پروجیکٹ کو ایک سادہ API سے ایک فل اسٹیک (full-stack) ایپلی کیشن میں تبدیل کر دیتا ہے۔

میں نے فائل روٹنگ (file routing) میں مہارت حاصل کرنے کے لیے Complete Coding بیک اینڈ ٹریک پر عمل کیا۔

ایک حقیقی پروڈکشن ماحول میں، آپ کو فرنٹ اینڈ فائلیں فراہم کرنے کے لیے ایک موثر طریقے کی ضرورت ہوتی ہے۔ آپ کو فائلیں پڑھنے کے لیے خود سے لوپس (custom loops) نہیں لکھنے چاہئیں۔

یہ وہ سیٹ اپ ہے جو میں نے آج استعمال کیا:

  • express.static() مڈل ویئر (Middleware) Express میں express.static() نامی ایک بلٹ ان ٹول شامل ہے۔ یہ آپ کو براؤزر کو فراہم کرنے کے لیے public یا assets جیسا کوئی فولڈر منتخب کرنے کی اجازت دیتا ہے۔

  • path.join() میں نے Node.js کے path ماڈیول اور __dirname ویری ایبل کا استعمال کیا۔ اس سے یہ یقینی بنتا ہے کہ میرا سرور ونڈوز، لینکس، یا میک پر بغیر کسی غلطی کے فائلیں تلاش کر لے۔

یہ رہا کوڈ:

const express = require("express");
const path = require("path");
const app = express();
const PORT = 8000;

app.use(express.static(path.join(__dirname, "public")));

app.get("/", (req, res) => {
    res.sendFile(path.join(__dirname, "public", "index.html"));
});

app.listen(PORT, () => {
    console.log(`Server running on http://localhost:${PORT}`);
});

ان بنیادی اصولوں کو سیکھنا مجھے یہ سمجھنے میں مدد دیتا ہے کہ ویب کیسے کام کرتی ہے۔

ماخذ: https://dev.to/ali_hamza_589ec7b3eb6688d/day-44-of-learning-mern-stack-3c0m