Free Hosting for MERN Project: A Complete Step-by-Step Guide (Bangla)

By Parvej Ahmed · 2026-07-08

Learn how to host your MERN stack project for free using Render, Vercel, and MongoDB Atlas. Full step-by-step guide in English and Bengali.

Hello developers! আপনি কি একটি MERN stack (MongoDB, Express.js, React.js, Node.js) প্রজেক্ট তৈরি করেছেন এবং এখন সেটি ফ্রিতে দুনিয়াকে দেখাতে চান? Learning stage-এ বা পোর্টফোলিও তৈরির জন্য পেইড হোস্টিং কেনা অনেকের জন্যই সম্ভব হয় না। চিন্তার কিছু নেই! আজকের এই ডিটেইলড গাইডে আমরা শিখব কিভাবে একদম ফ্রি-তে আপনার MERN প্রজেক্ট হোস্ট করবেন।

MERN Stack হোস্টিং কেন চ্যালেঞ্জিং?

অন্যান্য সাধারণ স্ট্যাটিক সাইটের তুলনায় MERN stack হোস্টিং একটু আলাদা। এখানে আপনার দুটি মেইন পার্ট থাকে:

Frontend: সাধারণত React দিয়ে তৈরি হয়, যা স্ট্যাটিক ফাইল হিসেবে সার্ভ করা যায়।
Backend: Node.js এবং Express দিয়ে তৈরি, যা একটি রানটাইম এনভায়রনমেন্ট এবং সবসময় একটি পোর্ট লিসেন করে থাকে।
Database: MongoDB ক্লাউড স্টোরেজ (Atlas)।

যেহেতু ব্যাকএন্ড সবসময় চলতে থাকে (Server-side process), তাই সাধারণ শেয়ারড হোস্টিংয়ে এগুলো চলে না। আমাদের প্রয়োজন Cloud Platforms বা PaaS (Platform as a Service)।

১. ডেটাবেস হোস্টিং: MongoDB Atlas

আপনার লোকাল মেশিনে (localhost) থাকা MongoDB ডেটাবেস তো আর অনলাইনে কাজ করবে না। তাই সবার আগে ডেটাবেসটি ক্লাউডে নিতে হবে।

কিভাবে সেটআপ করবেন:

MongoDB Atlas-এ সাইন আপ করুন।
একটি Shared Cluster ক্রিয়েট করুন (এটি একদম ফ্রি)।
Database Access ট্যাব থেকে একজন ইউজার তৈরি করুন এবং নেটওয়ার্ক এক্সেসে 'Allow Access from Anywhere' (0.0.0.0/0) সেট করুন।
'Connect' বাটনে ক্লিক করে Connection String-টি কপি করে নিন। এটি আপনার backend-এর .env ফাইলে ব্যবহার করতে হবে।

২. ব্যাকএন্ড হোস্টিং (Backend Hosting)

Heroku আগে ফ্রি ছিল, কিন্তু এখন সেটি পেইড। তবে হতাশ হওয়ার কিছু নেই, বর্তমানে বেশ কিছু দারুণ অল্টারনেটিভ আছে।

Render (সেরা বিকল্প)

Render বর্তমানে MERN stack হোস্টিংয়ের জন্য ওয়ান অফ দ্য বেস্ট ফ্রি প্ল্যাটফর্ম।

সুবিধা: অটোমেটিক গিটহাব ডিপ্লয়মেন্ট এবং সহজ ইন্টারফেস।
সীমাবদ্ধতা: ফ্রি টায়ারে সার্ভার ১৫ মিনিট ইন-অ্যাক্টিভ থাকলে 'Sleep' মোডে চলে যায়। আবার রিকোয়েস্ট পাঠালে ঘুম থেকে উঠতে ১০-২০ সেকেন্ড সময় নিতে পারে।

Railway.app

Railway-তে ট্রায়াল হিসেবে কিছু ক্রেডিট দেওয়া হয়। এটি কনফিগার করা খুবই সহজ। আপনি সরাসরি গিটহাব রিপোজিটরি কানেক্ট করে ডিপ্লয় করতে পারেন।

Cyclic.sh

Cyclic ও বেশ জনপ্রিয় হচ্ছে কারণ এটি সার্ভারলেস টেকনোলজি ব্যবহার করে। এখানে সাইট স্লিপ মোডে যায় না, যা একটি বড় প্লাস পয়েন্ট।

প্রো টিপ: আপনার ব্যাকএন্ড কোডে পোর্ট হিসেবে process.env.PORT || 5000 ব্যবহার করতে ভুলবেন না। হোস্টিং প্ল্যাটফর্মগুলো অটোমেটিক পোর্ট অ্যাসাইন করে দেয়।

৩. ফ্রন্টএন্ড হোস্টিং (Frontend Hosting)

React ফ্রন্টএন্ড হোস্ট করা তুলনামূলক সহজ। আপনি নিচের প্ল্যাটফর্মগুলো ব্যবহার করতে পারেন:

Vercel: React ডেভেলপারদের প্রথম পছন্দ। গিটহাবের সাথে কানেক্ট করলে সাথে সাথে লাইভ হয়ে যায়।
Netlify: ড্র্যাগ এন্ড ড্রপ বা গিটহাবের মাধ্যমে সহজে ব্যবহার করা যায়।
Firebase Hosting: গুগলের এই সার্ভিসটি খুবই ফাস্ট এবং সিকিউর।

কিভাবে একসাথে ডিপ্লয় করবেন? (The Strategy)

MERN প্রজেক্ট সাধারণত দুটি উপায়ে ডিপ্লয় করা যায়:

পদ্ধতি ১: Separate Deployment (Recommended)

আপনি ফ্রন্টএন্ড হোস্ট করবেন Vercel-এ এবং ব্যাকএন্ড হোস্ট করবেন Render-এ।

প্রথমে আপনার Backend পুশ করুন গিটহাবে এবং Render-এ কানেক্ট করুন।
Render থেকে পাওয়া URL-টি কপি করুন।
আপনার React অ্যাপের API ডোমেইন বা Base URL হিসেবে ওই লিঙ্কি বসিয়ে দিন।
সবশেষে React অ্যাপটি Vercel-এ ডিপ্লয় করুন।

পদ্ধতি ২: Monolith Deployment

একই সার্ভারে (যেমন Render-এ) ফ্রন্টএন্ড এবং ব্যাকএন্ড দুটোই হোস্ট করা। এক্ষেত্রে আপনার Node.js সার্ভার থেকে path.join ব্যবহার করে React-এর build ফোল্ডারটি স্ট্যাটিক্যালি সার্ভ করতে হবে।

app.use(express.static(path.join(__dirname, "./client/dist")));
app.get("*", (req, res) => {
  res.sendFile(path.join(__dirname, "./client/dist/index.html"));
});

কিছু কমন সমস্যা এবং সমাধান (Troubleshooting)

ডিপ্লয় করার সময় কিছু এরর আসা স্বাভাবিক। সবচেয়ে কমন সমস্যাগুলো হলো:

CORS Error: ব্যাকএন্ডে cors প্যাকেজটি ইনস্টল করে ফ্রন্টএন্ডের URL-কে হোয়াইটলিস্ট করে দিন।
Environment Variables: ডাটাবেস ইউআরএল বা সিক্রেট কি-গুলো লোকাল মেশিনের .env ফাইলে থাকলেও ক্লাউডে সেগুলো মেনুয়ালি অ্যাড করতে হয়। Render বা Vercel-এর 'Environment Variables' ট্যাবে এগুলো যোগ করুন।
Case Sensitivity: মনে রাখবেন লিনাক্স সার্ভারে (যেখানে এগুলো হোস্ট হয়) ফাইল নাম যেমন Header.js আর header.js এক নয়। ফোল্ডার এবং ফাইল নামের দিকে খেয়াল রাখুন।

উপসংহার

আপনার MERN প্রজেক্টটি ফ্রিতে হোস্ট করা এখন আর আগের মতো কঠিন নয়। পোর্টফোলিওর জন্য Render এবং Vercel-এর কম্বিনেশন ব্যবহার করা সবচেয়ে স্মার্ট আইডিয়া। এতে সাইট যেমন ফাস্ট থাকে, তেমনি মেইনটেন্যান্স করাও সহজ হয়।

শেখার শুরুতে ছোট ছোট প্রজেক্ট এভাবে হোস্ট করে লাইভ লিঙ্ক আপনার সিভিতে যোগ করুন। শুভকামনা রইল আপনার কোডিং যাত্রার জন্য!

আপনার যদি ডিপ্লয়মেন্ট নিয়ে কোনো প্রশ্ন থাকে, কমেন্টে জানাতে পারেন। হ্যাপি কোডিং!