MERN Stack শেখার ৪৪তম দিন
আমার Express.js সার্ভার আগে শুধু JSON ডেটা পাঠাত। আজ আমি সেটি পরিবর্তন করেছি।
আমি শিখেছি কীভাবে সরাসরি আমার ব্যাকএন্ড থেকে HTML, CSS এবং ছবি সার্ভ করতে হয়। এটি আমার প্রজেক্টকে একটি সাধারণ API থেকে একটি ফুল-স্ট্যাক অ্যাপ্লিকেশনে রূপান্তরিত করেছে।
ফাইল রাউটিংয়ে দক্ষ হওয়ার জন্য আমি Complete Coding ব্যাকএন্ড ট্র্যাক অনুসরণ করেছি।
একটি রিয়েল প্রোডাকশন এনভায়রনমেন্টে, ফ্রন্টএন্ড ফাইলগুলো পৌঁছে দেওয়ার জন্য আপনার একটি দক্ষ পদ্ধতি প্রয়োজন। ফাইল পড়ার জন্য আপনার কাস্টম লুপ লেখা উচিত নয়।
আজ আমি যে সেটআপটি ব্যবহার করেছি তা নিচে দেওয়া হলো:
express.static() Middleware Express-এ express.static() নামে একটি বিল্ট-ইন টুল রয়েছে। এটি আপনাকে ব্রাউজারে সার্ভ করার জন্য public বা assets-এর মতো একটি ফোল্ডার বেছে নিতে সাহায্য করে।
path.join() আমি Node.js-এর path module এবং __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