সব ব্লগ দেখুন
ফ্রিল্যান্সিং ও ক্যারিয়ার•7 মিনিট পড়ার সময়•0 বার দেখা হয়েছে

GitHub Pages দিয়ে ফ্রি প্রফেশনাল পোর্টফোলিও ওয়েবসাইট: বাংলাদেশি স্টুডেন্ট ও ফ্রিল্যান্সারদের জন্য স্টেপ-বাই-স্টেপ গাইড

এক টাকাও হোস্টিং খরচ ছাড়াই GitHub Pages আর ফ্রি ডোমেইন দিয়ে নিজের প্রফেশনাল পোর্টফোলিও ওয়েবসাইট বানানোর সম্পূর্ণ গাইড — কোড, ডোমেইন সেটআপ আর রিয়েল উদাহরণসহ।

NonAcademy Team

NonAcademy Team

২৬ সেপ্টেম্বর, ২০২৬

GitHub Pages দিয়ে ফ্রি প্রফেশনাল পোর্টফোলিও ওয়েবসাইট: বাংলাদেশি স্টুডেন্ট ও ফ্রিল্যান্সারদের জন্য স্টেপ-বাই-স্টেপ গাইড

ভাবুন তো, ক্লায়েন্ট আপনাকে জিজ্ঞেস করলো — "আপনার কাজের স্যাম্পল কোথায় দেখতে পারি?" আপনি হয়তো ফেসবুক পেজে ছড়িয়ে-ছিটিয়ে থাকা কিছু ছবি পাঠালেন, নয়তো Drive লিংক শেয়ার করলেন। প্রথম কয়েকজন ক্লায়েন্ট এতে সন্তুষ্ট থাকলেও একসময় মনে হবে — এভাবে আর চলছে না। একটা নিজের ওয়েবসাইট থাকলে সব কাজ এক জায়গায়, প্রফেশনালভাবে দেখানো যায়। কিন্তু হোস্টিং, ডোমেইন, ডেভেলপারের পেছনে টাকা খরচ করবো কোথা থেকে?

ভালো খবর হলো — এক টাকাও খরচ না করে আপনি একটা সম্পূর্ণ প্রফেশনাল পোর্টফোলিও ওয়েবসাইট বানাতে পারেন। GitHub Pages পুরোপুরি ফ্রি হোস্টিং দেয়, আর আপনি চাইলে username.github.io টাইপের ফ্রি সাবডোমেইনেই কাজ চালাতে পারেন। এই আর্টিকেলে আমি ধাপে ধাপে দেখাবো কীভাবে free portfolio website GitHub Pages Bangladeshi students দের জন্য একদম বাস্তবসম্মত একটা সমাধান — যেটা দিয়ে আপনি নিজের কাজ, CV, প্রজেক্ট সব এক জায়গায় সাজাতে পারবেন। শেষ পর্যন্ত পড়লে আপনি নিজেই নিজের সাইট লাইভ করতে পারবেন, কোনো ডেভেলপার ছাড়াই।

GitHub Pages আসলে কী, আর কেন আপনার জন্য পারফেক্ট

GitHub Pages হলো GitHub-এর একটা ফ্রি হোস্টিং সার্ভিস। আপনি আপনার কোড রিপোজিটরিতে রাখবেন, আর GitHub সেটাকে একটা লাইভ ওয়েবসাইট হিসেবে সার্ভ করবে। স্ট্যাটিক সাইট (HTML, CSS, JavaScript) হওয়ার কারণে এটা সুপার ফাস্ট, আর সিকিউরিটির ঝামেলাও কম।

বাংলাদেশি স্টুডেন্ট আর নতুন ফ্রিল্যান্সারদের জন্য এটা কেন আদর্শ, সেটা একটু ভেঙে বলি:

  • খরচ শূন্য: হোস্টিং, SSL সার্টিফিকেট, ব্যান্ডউইথ — সব ফ্রি। কার্ড লাগে না, ডলার লাগে না।
  • SSL বাই ডিফল্ট: সাইট অটোমেটিক https:// এ চলে, যেটা ক্লায়েন্টের কাছে বিশ্বাসযোগ্যতা বাড়ায়।
  • Git শেখা হয়ে যায়: যেহেতু Git দিয়ে কাজ করতে হয়, তাই ভার্সন কন্ট্রোলের বেসিকটা আপনার রপ্ত হয়ে যাবে — যেটা যেকোনো ফ্রিল্যান্স বা চাকরির জন্য দরকার।
  • লিমিট উদার: ব্যক্তিগত পোর্টফোলিওর জন্য মাসে ১০০ GB ব্যান্ডউইথ আর ১ GB স্টোরেজ যথেষ্টের চেয়ে বেশি।

একটা ছোট সতর্কতা — GitHub Pages শুধু স্ট্যাটিক সাইট হোস্ট করে। মানে PHP, ডাটাবেজ বা সার্ভার-সাইড কোড চলবে না। কিন্তু পোর্টফোলিওর জন্য এটুকুই যথেষ্ট। আপনার প্রজেক্টের ডেমো, ছবি, ব্লগ — সব এখানেই দেখাতে পারবেন।

শুরু করার আগে যা যা লাগবে

কোডে হাত দেওয়ার আগে কয়েকটা জিনিস গুছিয়ে নিন। এগুলো আগে ঠিক করে রাখলে পরে সময় বাঁচবে:

  • একটা GitHub অ্যাকাউন্ট: না থাকলে github.com এ ফ্রি সাইন আপ করুন। ইমেইল ভেরিফাই করতে ভুলবেন না।
  • Git ইনস্টল: কম্পিউটারে Git না থাকলে ডাউনলোড করে ইনস্টল করুন। মোবাইল থেকে কাজ করতে চাইলে GitHub-এর ওয়েব ইন্টারফেস দিয়েও ফাইল আপলোড করা যায়।
  • একটা কোড এডিটর: VS Code সবচেয়ে ভালো, ফ্রি আর হালকা।
  • কনটেন্ট রেডি: আপনার নিজের ছবি, প্রজেক্টের স্ক্রিনশট, কাজের বর্ণনা, CV-র PDF — এসব একটা ফোল্ডারে গুছিয়ে রাখুন।
টিপস: পোর্টফোলিও সাইটে যে ছবিগুলো দিবেন, সেগুলো ২০০-৩০০ KB-র মধ্যে কমপ্রেস করে নিন। বড় ছবি সাইট স্লো করে দেয়, আর ক্লায়েন্ট অপেক্ষা করতে ভালোবাসে না।

Git আর GitHub-এর বেসিক নিয়ে যদি এখনো দ্বিধা থাকে, আমাদের কোর্সগুলো একবার দেখে নিতে পারেন — বেসিক থেকে শুরু করে হাতে-কলমে প্রজেক্ট পর্যন্ত সব কভার করা হয়।

ধাপে ধাপে GitHub Pages সাইট লাইভ করা

ধাপ ১: রিপোজিটরি তৈরি করুন

GitHub-এ লগইন করে উপরে ডানদিকের + আইকনে ক্লিক করে New repository সিলেক্ট করুন। নাম দিতে হবে খুব নির্দিষ্ট একটা ফরম্যাটে — username.github.io। এখানে username হবে আপনার GitHub ইউজারনেম। ধরুন আপনার ইউজারনেম rakibdev, তাহলে রিপো নাম হবে rakibdev.github.io।

রিপো পাবলিক রাখুন, আর "Add a README file" টিক দিয়ে তৈরি করুন। এই নামটা ব্যবহার করলে আপনার সাইট অটোমেটিক https://rakibdev.github.io এ লাইভ হবে — কোনো এক্সট্রা সেটিংস লাগবে না।

ধাপ ২: লোকালি ফাইল তৈরি করুন

কম্পিউটারে একটা ফোল্ডার বানান, তার ভেতরে index.html ফাইল তৈরি করুন। এটাই আপনার হোমপেজ। নিচের মতো একটা বেসিক স্ট্রাকচার দিয়ে শুরু করতে পারেন:

<!DOCTYPE html>
<html lang='bn'>
<head>
  <meta charset='UTF-8'>
  <meta name='viewport' content='width=device-width, initial-scale=1.0'>
  <title>রাকিব হাসান | ওয়েব ডেভেলপার</title>
  <link rel='stylesheet' href='style.css'>
</head>
<body>
  <header>
    <h1>রাকিব হাসান</h1>
    <p>ফ্রন্টএন্ড ডেভেলপার ও ফ্রিল্যান্সার</p>
  </header>
</body>
</html>

খেয়াল করুন, lang='bn' দিয়েছি কারণ সাইটের কনটেন্ট বাংলায়। ইংরেজি কনটেন্ট হলে lang='en' দিতে পারেন।

ধাপ ৩: Git দিয়ে পুশ করুন

টার্মিনাল বা Git Bash খুলে আপনার ফোল্ডারে যান, তারপর নিচের কমান্ডগুলো একটার পর একটা চালান:

git init
git add .
git commit -m 'first portfolio commit'
git branch -M main
git remote add origin https://github.com/rakibdev/rakibdev.github.io.git
git push -u origin main

পুশ শেষ হলে ১-২ মিনিট অপেক্ষা করুন, তারপর ব্রাউজারে https://rakibdev.github.io খুলে দেখুন — আপনার সাইট লাইভ! প্রথমবার দেখতে একটু সময় লাগতে পারে, ঘাবড়াবেন না।

ধাপ ৪: নতুন আপডেট কীভাবে দিবেন

ভবিষ্যতে সাইটে কিছু বদলালে শুধু তিনটা কমান্ড চালালেই হবে:

git add .
git commit -m 'updated project section'
git push

এইটুকুই। কয়েক সেকেন্ডেই পরিবর্তন লাইভ হয়ে যাবে। এটাই Git-এর সৌন্দর্য — প্রতিটা পরিবর্তনের হিস্ট্রি থেকে যায়।

ফ্রি ডোমেইন যোগ করার আসল সত্যিটা

এখানে একটা বিষয় পরিষ্কার করা দরকার, কারণ অনেকেই এখানে বিভ্রান্ত হন। পুরোপুরি ফ্রিতে yourname.com টাইপের ডোমেইন পাওয়া সাধারণত যায় না। তবে আপনার হাতে দুটো বাস্তব অপশন আছে:

  • ফ্রি সাবডোমেইন: rakibdev.github.io — একদম ফ্রি, আজীবন। এটাই বেশিরভাগ স্টুডেন্টের জন্য যথেষ্ট।
  • কাস্টম ডোমেইন: rakibhasan.com — বছরে সাধারণত ৮০০-১৫০০ টাকার মধ্যে (.com ডোমেইন)। অনেক প্রোভাইডার প্রথম বছরে বড় ডিসকাউন্ট দেয়।

কাস্টম ডোমেইন কিনলে GitHub Pages-এর সাথে ফ্রি কানেক্ট করা যায়। রিপোতে CNAME নামে একটা ফাইল বানিয়ে শুধু আপনার ডোমেইন লিখে দিলেই হবে:

rakibhasan.com

এরপর ডোমেইন প্রোভাইডারের DNS সেটিংসে GitHub-এর দেওয়া IP অ্যাড্রেসগুলো (A record) পয়েন্ট করে দিতে হবে। GitHub-এর ডকুমেন্টেশনে স্টেপগুলো বিস্তারিত আছে। SSL সার্টিফিকেট GitHub নিজেই ফ্রিতে দিয়ে দেবে, আলাদা কিছু কিনতে হবে না।

বাজেট টাইট হলে প্রথমে github.io সাবডোমেইনেই শুরু করুন। কাজ ভালো হলে, ক্লায়েন্ট আসতে শুরু করলে তখন কাস্টম ডোমেইনে আপগ্রেড করবেন।

পোর্টফোলিও সাইটে কী কী রাখবেন

একটা পোর্টফোলিও সাইট শুধু সুন্দর দেখালেই হবে না, সেটা ক্লায়েন্টকে কনভিন্সও করতে হবে। নিচের সেকশনগুলো রাখলে আপনার সাইট প্রতিযোগীদের চেয়ে এগিয়ে থাকবে:

  • হিরো সেকশন: আপনার নাম, ছবি, আর এক লাইনে আপনি কী করেন। উদাহরণ: "ওয়ার্ডপ্রেস স্পিড অপটিমাইজেশন স্পেশালিস্ট"।
  • সার্ভিস: আপনি কী কী সার্ভিস দেন, কীভাবে দেন, আর রেট কেমন — সংক্ষেপে।
  • পোর্টফোলিও/প্রজেক্ট: প্রতিটা প্রজেক্টের স্ক্রিনশট, ছোট বর্ণনা, আর লাইভ লিংক।
  • টেস্টিমোনিয়াল: আগের ক্লায়েন্টের রিভিউ থাকলে সোনায় সোহাগা।
  • যোগাযোগ: ইমেইল, WhatsApp, LinkedIn — যাতে ক্লায়েন্ট সহজেই নক করতে পারে।

একটা রিয়েল উদাহরণ দিই। ধরুন আপনি লোগো ডিজাইনার। আপনার প্রজেক্ট কার্ড দেখতে হতে পারে এমন:

<div class='project'>
  <img src='images/logo-1.png' alt='কফি শপ লোগো ডিজাইন'>
  <h3>কফি শপ লোগো</h3>
  <p>ছোট বিজনেসের জন্য মিনিমাল ব্র্যান্ড আইডেন্টিটি।</p>
  <a href='https://behance.net/yourprofile'>কেস স্টাডি দেখুন</a>
</div>

লক্ষ্য করুন, প্রতিটা প্রজেক্টে alt টেক্সট দেওয়া আছে। এটা শুধু SEO-র জন্যই ভালো না, স্ক্রিন রিডার ব্যবহারকারীদের জন্যও জরুরি।

সাইটকে প্রফেশনাল দেখানোর কিছু টিপস

GitHub Pages-এ ডিফল্টভাবে কোনো ডিজাইন থাকে না, তাই CSS দিয়ে সাজাতে হবে। পুরো ডিজাইন নিজে না লিখতে চাইলে Jekyll বা Hugo টাইপ স্ট্যাটিক সাইট জেনারেটর ব্যবহার করতে পারেন — এগুলো GitHub Pages-এ সাপোর্টেড, আর রেডিমেড থিম পাওয়া যায়।

তবে হাতে লেখা CSS-ও খুব একটা কঠিন না। একটা সিম্পল রেসপন্সিভ লেআউট এরকম হতে পারে:

body {
  font-family: 'Hind Siliguri', sans-serif;
  max-width: 900px;
  margin: 0 auto;
  padding: 20px;
  line-height: 1.7;
}
.project {
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 16px;
  margin-bottom: 20px;
}

বাংলা ফন্টের জন্য Hind Siliguri বা Noto Sans Bengali ভালো কাজ করে, আর Google Fonts থেকে ফ্রিতে ব্যবহার করা যায়। মোবাইলে যেন ঠিকভাবে দেখায়, সেজন্য max-width আর padding ব্যবহার করা জরুরি — বাংলাদেশে অনেক ক্লায়েন্ট মোবাইল থেকেই আপনার সাইট দেখবে।

আরেকটা জিনিস মাথায় রাখুন — সাইটের লোডিং স্পিড। ছবি কমপ্রেস করুন, অপ্রয়োজনে বড় JavaScript লাইব্রেরি যোগ করবেন না। একটা হালকা সাইট ক্লায়েন্টের কাছে অনেক বেশি প্রফেশনাল লাগে।

কমন ভুল যেগুলো এড়িয়ে চলবেন

নতুনরা প্রায়ই কিছু ভুল করে বসেন, যেগুলো পরে বড় সমস্যা তৈরি করে:

  • রিপোর নাম ভুল: username.github.io না লিখে অন্য নাম দিলে সাইট username.github.io/reponame এ যাবে, যেটা কম প্রফেশনাল।
  • index.html না রাখা: হোমপেজের ফাইলের নাম অবশ্যই index.html হতে হবে, নাহলে সাইট খালি দেখাবে।
  • বড় ছবি আপলোড: ৫ MB-র ছবি দিলে সাইট স্লো হবে, ক্লায়েন্ট চলে যাবে।
  • কনটাক্ট ইনফো না রাখা: সুন্দর সাইট বানিয়ে যদি যোগাযোগের উপায় না দেন, তাহলে লাভ কী?
  • টাইপো আর ভাঙা লিংক: পাবলিশ করার আগে সব লিংক আর বানান একবার চেক করুন।

এই ভুলগুলো এড়াতে পারলে আপনার সাইট যেকোনো এজেন্সি-বানানো সাইটের সাথে পাল্লা দিতে পারবে। আরও টেকনিক্যাল টিপস আর টিউটোরিয়াল পেতে আমাদের ব্লগ নিয়মিত ফলো করতে পারেন।

পরের ধাপ: সাইট লাইভ করার পর কী করবেন

সাইট লাইভ হয়ে গেলে কাজ শেষ নয়, এটা তো শুরু। এখন আপনার দরকার সাইটে ট্রাফিক আনা আর ক্লায়েন্ট কনভার্ট করা। কয়েকটা বাস্তব পদক্ষেপ:

  • আপনার GitHub Pages লিংক LinkedIn, Facebook, আর ফ্রিল্যান্সিং প্রোফাইলে (Fiverr, Upwork) যোগ করুন।
  • প্রতিটা প্রজেক্টের কেস স্টাডি লিখুন — শুধু ছবি নয়, সমস্যা কী ছিল, কীভাবে সমাধান করলেন সেটাও বলুন।
  • Google Search Console-এ সাইট সাবমিট করুন, যাতে সার্চে পাওয়া যায়।
  • নিয়মিত নতুন প্রজেক্ট যোগ করুন — ক্লায়েন্ট দেখতে চায় আপনি সক্রিয়।

আর যদি মনে হয় নিজে থেকে শিখতে গিয়ে আটকে যাচ্ছেন, তাহলে আমাদের কমিউনিটি-তে জয়েন করতে পারেন। সেখানে অন্য লার্নার আর মেন্টররা একসাথে প্রবলেম সলভ করে — যেটা একা শেখার চেয়ে অনেক দ্রুত এগোতে সাহায্য করে।

তাহলে আর দেরি কেন? আজই GitHub অ্যাকাউন্ট খুলুন, একটা index.html বানান, আর পুশ করে দিন। প্রথম ভার্সন পারফেক্ট না হলেও চলবে — আপনি পরে যত খুশি আপডেট করতে পারবেন। সবচেয়ে বড় পদক্ষেপ হলো প্রথম পুশটা করা।

সাধারণ প্রশ্নোত্তর

GitHub Pages সত্যিই সম্পূর্ণ ফ্রি, নাকি পরে টাকা লাগবে?

পাবলিক রিপোজিটরির জন্য GitHub Pages পুরোপুরি ফ্রি — হোস্টিং, SSL, ব্যান্ডউইথ সবই। ব্যক্তিগত পোর্টফোলিওর জন্য এটা আজীবন ফ্রি থাকবে। তবে কাস্টম ডোমেইন (yourname.com) কিনতে চাইলে সেটার জন্য ডোমেইন প্রোভাইডারকে টাকা দিতে হবে, যা বছরে সাধারণত ৮০০-১৫০০ টাকার মধ্যে। ডোমেইন ছাড়া username.github.io সাবডোমেইন একদম ফ্রি।

আমার কোনো কোডিং জানা নেই, তবুও কি এটা করতে পারবো?

একদম পারবেন। HTML আর CSS-এর বেসিক জানলেই যথেষ্ট, আর সেটা কয়েকদিনেই শেখা যায়। তার চেয়েও সহজ পথ হলো Jekyll বা Hugo-র মতো স্ট্যাটিক সাইট জেনারেটর ব্যবহার করা — এগুলোতে রেডিমেড থিম থাকে, শুধু কনটেন্ট বসিয়ে দিলেই হয়। শুরুতে একটা টেমপ্লেট দিয়ে সাইট বানান, পরে ধীরে ধীরে কোড শিখতে শিখতে কাস্টমাইজ করবেন।

GitHub Pages কি SEO-তে ভালো করে?

হ্যাঁ, ভালো করে। যেহেতু সাইট স্ট্যাটিক আর সুপার ফাস্ট, তাই Google এটাকে পছন্দ করে। SSL বাই ডিফল্ট থাকায় সিকিউরিটি স্কোরও ভালো। তবে SEO-র আসল কাজটা আপনাকে করতে হবে — সঠিক টাইটেল, মেটা ডেসক্রিপশন, ছবির alt টেক্সট, আর নিয়মিত কনটেন্ট আপডেট। কাস্টম ডোমেইন থাকলে SEO-তে আরেকটু সুবিধা পাওয়া যায়।

সাইটে কি ডাটাবেজ বা লগইন সিস্টেম বানানো যাবে?

সরাসরি যাবে না, কারণ GitHub Pages শুধু স্ট্যাটিক ফাইল হোস্ট করে — PHP বা সার্ভার-সাইড কোড চলে না। কিন্তু দরকার হলে বাইরের ফ্রি সার্ভিস ব্যবহার করতে পারেন। যেমন ফর্ম সাবমিশনের জন্য Formspree, কমেন্টের জন্য Disqus, আর ডাটার জন্য Firebase। এভাবে স্ট্যাটিক সাইটেও অনেক ডায়নামিক ফিচার যোগ করা যায়।

একই অ্যাকাউন্টে একাধিক পোর্টফোলিও সাইট বানানো যাবে?

যাবে। মূল সাইটটা থাকে username.github.io রিপোতে, আর প্রতিটা এক্সট্রা প্রজেক্ট বা সাইট আলাদা রিপোতে রাখলে সেটা username.github.io/reponame ফরম্যাটে লাইভ হয়। এভাবে আপনি একাধিক প্রজেক্ট ডেমো, ব্লগ, বা ক্লায়েন্ট প্রজেক্টের প্রিভিউ আলাদা আলাদা রিপোতে হোস্ট করতে পারবেন, সবই ফ্রিতে।

সাইট আপডেট করতে কত সময় লাগে?

সাধারণত পুশ করার পর ১-২ মিনিটের মধ্যে পরিবর্তন লাইভ হয়ে যায়। প্রথমবার বা বড় পরিবর্তনের সময় কখনো ৫-১০ মিনিটও লাগতে পারে। ব্রাউজারে পুরোনো ভার্সন দেখালে Ctrl+Shift+R দিয়ে হার্ড রিফ্রেশ করুন, তাহলে নতুন ভার্সন দেখতে পাবেন।

শেয়ার করুন:
NonAcademy Team

লেখক

NonAcademy Team