KoaJS একটি লঘু এবং কাস্টমাইজযোগ্য ওয়েব ফ্রেমওয়ার্ক, যা Node.js প্ল্যাটফর্মে ব্যবহৃত হয়। আপনি যদি KoaJS ব্যবহার করে টেমপ্লেট ইঞ্জিনের মাধ্যমে HTML ফাইল রেন্ডার করতে চান, তবে koa-views প্যাকেজটি ব্যবহার করতে পারেন। এটি বিভিন্ন টেমপ্লেট ইঞ্জিন যেমন EJS, Pug, Handlebars ইত্যাদি সমর্থন করে এবং KoaJS অ্যাপ্লিকেশনের মধ্যে টেমপ্লেট রেন্ডারিং সহজে এক্সটেন্ড করতে সক্ষম।
এই টিউটোরিয়ালে আমরা koa-views এবং EJS টেমপ্লেট ইঞ্জিন ব্যবহার করে কিভাবে টেমপ্লেট ইন্টিগ্রেশন করতে হয়, তা আলোচনা করব।
koa-views ইনস্টল করা
প্রথমে, আপনাকে koa-views প্যাকেজটি ইনস্টল করতে হবে। এটি KoaJS-এ টেমপ্লেট রেন্ডারিংয়ের জন্য প্রয়োজনীয় মিডলওয়্যার সরবরাহ করে।
ইনস্টলেশন:
npm install koa-views
npm install ejs # EJS টেমপ্লেট ইঞ্জিন ইনস্টল করা
এখানে koa-views ইনস্টল করা হচ্ছে, এবং EJS টেমপ্লেট ইঞ্জিন ইনস্টল করা হয়েছে (যেহেতু আমরা EJS ব্যবহার করবো)।
koa-views ব্যবহার করে টেমপ্লেট রেন্ডারিং
একবার koa-views ইনস্টল হয়ে গেলে, আপনাকে এই মিডলওয়্যারটি Koa অ্যাপ্লিকেশনে যুক্ত করতে হবে এবং টেমপ্লেট রেন্ডারিংয়ের জন্য সঠিক কনফিগারেশন সেট করতে হবে।
১. KoaJS অ্যাপ্লিকেশন তৈরি করা
এখানে একটি সিম্পল KoaJS অ্যাপ্লিকেশন তৈরি করা হচ্ছে যা koa-views ব্যবহার করে EJS টেমপ্লেট রেন্ডার করবে।
const Koa = require('koa');
const path = require('path');
const views = require('koa-views');
const app = new Koa();
// koa-views মিডলওয়্যার ব্যবহার করা
app.use(views(path.join(__dirname, '/views'), {
extension: 'ejs' // EJS টেমপ্লেট ইঞ্জিন ব্যবহার করা
}));
// রাউট তৈরি করা
app.use(async (ctx) => {
await ctx.render('index', { title: 'KoaJS with EJS' });
});
// অ্যাপ চালু করা
app.listen(3000, () => {
console.log('Server is running on http://localhost:3000');
});
কোডের ব্যাখ্যা:
viewsমিডলওয়্যার:koa-viewsমিডলওয়্যার ব্যবহার করা হয়েছে, যাviewsডিরেক্টরি থেকে.ejsফাইল রেন্ডার করবে।ctx.render():ctx.render()ব্যবহার করে আমরা টেমপ্লেট রেন্ডার করেছি এবং সেটির সাথে ডেটা পাস করেছি। এখানেtitleএকটি ডাটা প্যারামিটার হিসেবে পাস করা হয়েছে যা EJS টেমপ্লেটের মধ্যে ব্যবহার করা হবে।
২. views ডিরেক্টরি তৈরি করা
এখন views নামক একটি ফোল্ডার তৈরি করুন এবং সেখানে একটি index.ejs ফাইল তৈরি করুন।
project-folder/
│
├── views/
│ └── index.ejs
│
└── app.js
৩. EJS টেমপ্লেট তৈরি করা
views/index.ejs ফাইলটি তৈরি করুন এবং তাতে কিছু HTML এবং EJS সিনট্যাক্স লিখুন:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><%= title %></title>
</head>
<body>
<h1>Welcome to <%= title %>!</h1>
</body>
</html>
এখানে, <%= title %> হচ্ছে EJS টেমপ্লেট ইঞ্জিনের সিনট্যাক্স, যা আমাদের পাস করা title ভেরিয়েবলকে রেন্ডার করবে।
সার্ভার চালানো
এখন, আপনি আপনার অ্যাপ্লিকেশন চালু করতে পারেন:
node app.js
এখন, আপনার ব্রাউজারে গিয়ে http://localhost:3000 এ প্রবেশ করলে আপনি EJS টেমপ্লেট দ্বারা রেন্ডার করা একটি HTML পেজ দেখতে পাবেন, যেখানে KoaJS with EJS লেখা থাকবে।
কাস্টম ডেটা পাস করা
EJS টেমপ্লেটে আরও ডেটা পাস করা খুব সহজ। আপনি টেমপ্লেটের মধ্যে যেকোনো ডেটা পাস করতে পারেন। উদাহরণস্বরূপ:
app.use(async (ctx) => {
const user = { name: 'John', age: 30 };
await ctx.render('index', { title: 'User Info', user: user });
});
এখন, views/index.ejs ফাইলে আপনি এই ডেটা ব্যবহার করতে পারেন:
<h2>User Name: <%= user.name %></h2>
<h3>Age: <%= user.age %></h3>
এটি ইউজারের নাম এবং বয়স পেজে রেন্ডার করবে।
koa-views কাস্টমাইজেশন
koa-views অনেক কাস্টমাইজেশন সমর্থন করে, যেমন:
- Template Engine পরিবর্তন: আপনি EJS এর পরিবর্তে অন্য টেমপ্লেট ইঞ্জিন যেমন
Pug,Handlebarsব্যবহার করতে পারেন। - Dynamic Views Path: যদি আপনি চান, তবে ডাইনামিকভাবে বিভিন্ন টেমপ্লেট পাথ ব্যবহার করতে পারেন।
- Cache Control: টেমপ্লেট ক্যাশ কন্ট্রোল সিস্টেম যুক্ত করতে পারেন।
উদাহরণ:
app.use(views(path.join(__dirname, '/views'), {
extension: 'ejs',
map: { html: 'ejs' }, // টেমপ্লেট এক্সটেনশন ম্যাপ করা
cache: false // ক্যাশিং বন্ধ করা
}));
সারাংশ
KoaJS-এ koa-views ব্যবহার করে টেমপ্লেট ইঞ্জিন ইন্টিগ্রেশন করা খুবই সহজ। এটি আপনাকে KoaJS অ্যাপ্লিকেশনে HTML টেমপ্লেট রেন্ডারিংয়ের জন্য অত্যন্ত সহজ এবং শক্তিশালী উপায় প্রদান করে। আপনি EJS, Pug, Handlebars সহ বিভিন্ন টেমপ্লেট ইঞ্জিন ব্যবহার করতে পারেন। KoaJS-এর মাধ্যমে টেমপ্লেট রেন্ডারিং এর ফলে অ্যাপ্লিকেশন ডেভেলপমেন্ট আরও সহজ এবং মডিউলার হয়ে ওঠে।
Read more
