ExpressJS-এ স্ট্যাটিক ফাইলগুলি (যেমন HTML, CSS, JavaScript, ইমেজ) সরবরাহ করার জন্য express.static() মিডলওয়্যার ব্যবহার করা হয়। এটি সহজেই স্ট্যাটিক ফাইলগুলোকে অ্যাপ্লিকেশন থেকে সরবরাহ করতে সহায়তা করে।
১. express.static() মিডলওয়্যার ব্যবহার করা
ExpressJS-এ স্ট্যাটিক ফাইল সার্ভ করতে express.static() ফাংশনটি ব্যবহার করা হয়। সাধারণত, আপনি একটি public/ ফোল্ডার তৈরি করেন যেখানে সব স্ট্যাটিক ফাইল থাকে এবং সেটিকে মিডলওয়্যার হিসাবে ব্যবহার করেন।
উদাহরণ:
ধরা যাক, আপনি আপনার স্ট্যাটিক ফাইলগুলো public/ ফোল্ডারে রাখতে চান। তাহলে আপনাকে নিচের কোডটি ব্যবহার করতে হবে:
const express = require('express');
const app = express();
const path = require('path');
// স্ট্যাটিক ফাইল সরবরাহ করতে public ফোল্ডার ব্যবহার করা
app.use(express.static(path.join(__dirname, 'public')));
// অ্যাপ্লিকেশন চালু করা
const port = 3000;
app.listen(port, () => {
console.log(`Server running at http://localhost:${port}`);
});
এখানে:
express.static(): এই মিডলওয়্যারটিpublicফোল্ডারে থাকা স্ট্যাটিক ফাইলগুলোকে সরবরাহ করবে।path.join(__dirname, 'public'): এটিpublic/ফোল্ডারের সঠিক পাথ তৈরির জন্যpathমডিউল ব্যবহার করা হচ্ছে।
২. স্ট্যাটিক ফাইলের ধরন
express.static() যেকোনো ধরনের স্ট্যাটিক ফাইল সরবরাহ করতে সক্ষম, যেমন:
- CSS ফাইল
- JavaScript ফাইল
- ইমেজ ফাইল (JPG, PNG, GIF ইত্যাদি)
- ফন্ট ফাইল
উদাহরণ:
আপনার public/ ফোল্ডারটি দেখতে এমন হতে পারে:
public/
├── images/
│ └── logo.png
├── css/
│ └── style.css
└── js/
└── script.js
এখন, আপনি এই ফাইলগুলোকে সরবরাহ করতে পারবেন:
- CSS ফাইল:
http://localhost:3000/css/style.css - JavaScript ফাইল:
http://localhost:3000/js/script.js - ইমেজ ফাইল:
http://localhost:3000/images/logo.png
এই URL গুলি সরাসরি ব্রাউজারে অ্যাক্সেস করা যাবে, কারণ express.static() মিডলওয়্যার এই ফাইলগুলোকে পাবলিক রুটে সার্ভ করে।
৩. সাবডিরেক্টরি ব্যবহার
আপনি স্ট্যাটিক ফাইলগুলোর জন্য সাবডিরেক্টরি তৈরি করতে পারেন এবং ExpressJS সেই ফোল্ডারের মধ্যে ফাইল সার্ভ করবে। উপরের উদাহরণের মতো, আপনি images/, css/, এবং js/ ফোল্ডারগুলোতে ফাইল রাখতে পারেন।
যদি আপনার ফোল্ডারের কাঠামো হয় এমন:
public/
├── images/
│ └── logo.png
└── css/
└── style.css
তাহলে, আপনি এই ফাইলগুলিকে নিচের URL দিয়ে অ্যাক্সেস করতে পারবেন:
- Logo Image:
http://localhost:3000/images/logo.png - CSS File:
http://localhost:3000/css/style.css
৪. স্পেসিফিক রাউটের সাথে স্ট্যাটিক ফাইল সংযুক্ত করা
আপনি যদি চাইলে একটি নির্দিষ্ট রাউটের সাথে স্ট্যাটিক ফাইল সার্ভ করতে পারেন। নিচের উদাহরণে, আমরা /assets/ রাউট দিয়ে স্ট্যাটিক ফাইল সার্ভ করছি:
app.use('/assets', express.static(path.join(__dirname, 'public')));
এখন, আপনার CSS, ইমেজ বা JavaScript ফাইল অ্যাক্সেস করতে হবে /assets রাউট দিয়ে:
- CSS ফাইল:
http://localhost:3000/assets/css/style.css - Logo Image:
http://localhost:3000/assets/images/logo.png
৫. কাস্টম ফোল্ডার এবং URL রুটিং
আপনি চাইলে স্ট্যাটিক ফাইলের জন্য আলাদা ফোল্ডারও ব্যবহার করতে পারেন, যেমন:
app.use('/public', express.static(path.join(__dirname, 'public')));
এটি /public URL রুট দিয়ে স্ট্যাটিক ফাইল সরবরাহ করবে। উদাহরণস্বরূপ:
- CSS ফাইল:
http://localhost:3000/public/css/style.css - Logo Image:
http://localhost:3000/public/images/logo.png
সারাংশ
ExpressJS-এ স্ট্যাটিক ফাইল সার্ভ করা খুবই সহজ। express.static() মিডলওয়্যার ব্যবহার করে আপনি আপনার অ্যাপ্লিকেশন থেকে স্ট্যাটিক ফাইল সরবরাহ করতে পারেন। এটি CSS, JavaScript, ইমেজ এবং অন্যান্য ফাইল সার্ভ করতে সক্ষম। স্ট্যাটিক ফাইল সরবরাহের জন্য সাধারণত public/ ফোল্ডার ব্যবহার করা হয়, তবে আপনি চাইলে কাস্টম রাউট এবং ফোল্ডারও ব্যবহার করতে পারেন।
Read more
