পর্ব 6 — গিটহাব অ্যাকাউন্ট সেটআপ এবং কোড রিপোজিটরি তৈরি

গত পর্বে আমরা আমাদের পোর্টফোলিওতে দারুণ কিছু ম্যাজিক যোগ করেছিলাম! মনে আছে নিশ্চয়ই? পর্ব 5-এ আমরা শিখেছি কীভাবে একটি কন্টাক্ট ফর্ম এবং চোখ ধাঁধানো ডার্ক মোড ফিচার যুক্ত করতে হয়। আমাদের ওয়েবসাইটটি এখন দেখতে যেমন চমৎকার, ফিচারের দিক থেকেও তেমনই আধুনিক। কিন্তু এটি এখন কেবল আপনার নিজের কম্পিউটারেই আছে। এটিকে ইন্টারনেটে সবার সামনে নিয়ে আসতে হলে আমাদের প্রথম কাজ হলো কোডগুলোকে অনলাইনে নিরাপদে রাখা। আর এই কাজটিই আমরা করব গিটহাবের মাধ্যমে। আপনি যদি আমাদের এই স্পেশাল টিউটোরিয়াল সিরিজটি প্রথম থেকে দেখতে চান, তবে এআই দিয়ে কোডিং ছাড়া নিজের পোর্টফোলিও ওয়েবসাইট তৈরি পেজে গিয়ে আগের পর্বগুলো দেখে নিতে পারেন।

আজকের পর্বে আমরা কোনো কোডিং জ্ঞান ছাড়াই সম্পূর্ণ বিনামূল্যে একটি গিটহাব অ্যাকাউন্ট তৈরি করব এবং আমাদের পোর্টফোলিও ফাইলের জন্য একটি অনলাইন ফোল্ডার বা 'রিপোজিটরি' সেটআপ করব।

গিটহাব (GitHub) কী এবং এটি আমাদের কেন প্রয়োজন?

সহজ ভাষায় বলতে গেলে, GitHub হলো প্রোগ্রামার এবং ডিজাইনারদের জন্য একটি ‘গুগল ড্রাইভ’-এর মতো ক্লাউড স্টোরেজ, তবে এটি বিশেষভাবে কোড বা ফাইল সংরক্ষণের জন্য তৈরি। আপনার কম্পিউটারের হার্ডডিস্ক যেকোনো সময় নষ্ট হয়ে যেতে পারে, কিন্তু গিটহাবে আপনার কোড রাখলে তা আজীবন সুরক্ষিত থাকবে।

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

গিটহাবে নতুন অ্যাকাউন্ট তৈরি করার ধাপসমূহ

গিটহাবে অ্যাকাউন্ট খোলা একেবারেই সহজ এবং এটি সম্পূর্ণ ফ্রি। নিচে ধাপে ধাপে প্রক্রিয়াটি দেওয়া হলো:

1. প্রথমে আপনার ব্রাউজার থেকে GitHub ওয়েবসাইটে যান।

2. ওয়েবসাইটের ডানদিকের ওপরে থাকা Sign up বাটনে ক্লিক করুন।

3. এবার একটি চমৎকার অ্যানিমেশনের মাধ্যমে আপনাকে স্বাগত জানানো হবে এবং আপনার ইমেল আইডি চাওয়া হবে। আপনার সচল ইমেলটি দিয়ে [Continue](/oss/continue)-এ ক্লিক করুন।

4. এরপর একটি শক্তিশালী পাসওয়ার্ড তৈরি করুন এবং পরবর্তীতে ব্যবহারের জন্য সেটি মনে রাখুন বা কোথাও লিখে রাখুন।

5. এবার একটি ইউনিক Username দিতে হবে। যেহেতু এটি আপনার পেশাদার পোর্টফোলিও হিসেবে কাজ করবে, তাই আপনার নিজের নামের সাথে মিল রেখে একটি মার্জিত ইউজারনেম বেছে নিন (যেমন: `tamim-chowdhury` বা `neha_design`)।

6. এরপর আপনার ইমেলে একটি ভেরিফিকেশন কোড পাঠানো হবে। সেই কোডটি গিটহাবের বক্সে বসিয়ে ভেরিফাই করে নিন।

7. অ্যাকাউন্ট খোলার পর স্ক্রিনে কিছু সাধারণ প্রশ্ন আসবে (যেমন আপনার পেশা কী বা আপনি কেন গিটহাব ব্যবহার করছেন), সেগুলো স্কিপ (Skip) করে সরাসরি ড্যাশবোর্ডে চলে যেতে পারেন।

ব্যস! তৈরি হয়ে গেল আপনার নিজের একটি গিটহাব প্রোফাইল।

পোর্টফোলিও কোডের ফাইলগুলো প্রস্তুত করা

গিটহাবে আপলোড করার আগে আমাদের পোর্টফোলিও সাইটের ফাইলগুলো একটু গুছিয়ে নেওয়া দরকার। আগের পর্বগুলোতে আমরা Claude এবং v0.dev ব্যবহার করে যে কোডগুলো পেয়েছিলাম, আশা করি সেগুলো আপনার কম্পিউটারের একটি নির্দিষ্ট ফোল্ডারে আছে।

আপনার ফোল্ডারটি দেখতে সাধারণত এইরকম হওয়া উচিত:

টিপ: ফাইল আপলোড করার সময় নিশ্চিত করুন যে আপনার মূল HTML ফাইলটির নাম যেন ছোট হাতের অক্ষরে ‘index.html’ হয়, কোনোভাবেই ‘Index.html’ বা ‘home.html’ নয়। এআই টুলগুলো অনেক সময় ফাইল জেনারেট করার সময় ভিন্ন নাম দিতে পারে, তাই আপলোডের আগেই এটি সংশোধন করে নেওয়া অত্যন্ত জরুরি। কারণ হোস্টিং সার্ভারগুলো ব্রাউজারে সাইট দেখানোর জন্য প্রথমেই এই ‘index.html’ ফাইলটি খোঁজে।

আপনার ফোল্ডারে যদি সিএসএস ফাইল (`style.css`), জাভাস্ক্রিপ্ট ফাইল (`script.js`) এবং লোগো বা ছবির জন্য একটি `images` ফোল্ডার থাকে, তবে নিশ্চিত হয়ে নিন যে সব ফাইল একসাথেই রয়েছে।

গিটহাবে নতুন রিপোজিটরি (Repository) তৈরি করা

গিটহাবে ফাইল বা প্রজেক্ট রাখার ফোল্ডারকে বলা হয় Repository বা সংক্ষেপে Repo। আমাদের পোর্টফোলিওর জন্য এখন একটি নতুন রিপোজিটরি তৈরি করতে হবে।

1. আপনার গিটহাব অ্যাকাউন্টে লগইন থাকা অবস্থায় ওপরের ডানদিকের কোণায় একটি + (প্লাস) আইকন দেখতে পাবেন। সেখানে ক্লিক করে New repository সিলেক্ট করুন।

2. Repository name বক্সে আপনার প্রজেক্টের একটি সুন্দর নাম দিন। যেমন: `my-portfolio` বা `portfolio-website`।

3. Description বক্সে চাইলে লিখতে পারেন: "My professional portfolio website made with AI tools"।

4. এরপর আপনি রিপোজিটরি পাবলিক (Public) নাকি প্রাইভেট (Private) রাখবেন তা সিলেক্ট করতে হবে।

পাবলিক ও প্রাইভেট রিপোজিটরির পার্থক্যটি একনজরে দেখে নিন:

যেহেতু আমরা এই কোডটি ব্যবহার করে আমাদের ওয়েবসাইট সবার জন্য লাইভ করব, তাই অবশ্যই Public অপশনটি সিলেক্ট করবেন।

5. নিচে "Initialize this repository with" সেকশনে কোনো কিছু টিক মার্ক দেওয়ার প্রয়োজন নেই (README বা .gitignore ফাইল আমরা পরে চাইলে যুক্ত করতে পারব)।

6. সবশেষে একদম নিচে থাকা সবুজ রঙের Create repository বাটনে ক্লিক করুন।

অভিনন্দন! আপনার প্রথম গিটহাব রিপোজিটরি সফলভাবে তৈরি হয়ে গেছে।

ড্র্যাগ অ্যান্ড ড্রপ পদ্ধতিতে গিটহাবে ফাইল আপলোড

সাধারণত ডেভেলপাররা গিটহাবে কোড আপলোড করার জন্য বিভিন্ন কমান্ড বা টার্মিনাল ব্যবহার করেন। তবে যেহেতু আমরা কোডিং ছাড়া এই প্রজেক্টটি করছি, তাই আমরা গিটহাবের সবচেয়ে সহজ ও গ্রাফিক্যাল পদ্ধতি ব্যবহার করব।

1. রিপোজিটরি তৈরি করার পর আপনি একটি পেজ দেখতে পাবেন যেখানে কিছু কোড লেখা থাকবে। ঘাবড়ানোর কিছু নেই, একটু নিচে খেয়াল করলে একটি লাইন দেখতে পাবেন: "uploading an existing file"। এই লেখাটির ওপর ক্লিক করুন।

2. এবার একটি ফাইল আপলোডের উইন্ডো বা বক্স স্ক্রিনে চলে আসবে।

3. আপনার কম্পিউটার থেকে পোর্টফোলিও ফোল্ডারটি ওপেন করুন। এবার আপনার কোডের ফাইলগুলো (যেমন: `index.html`, `style.css`, `script.js` এবং ছবির ফোল্ডারটি) একসাথে সিলেক্ট করুন।

4. সিলেক্ট করা ফাইলগুলোকে মাউস দিয়ে ড্র্যাগ করে এনে ব্রাউজারের ওই বক্সে ছেড়ে (Drop) দিন।

5. স্ক্রিনে দেখতে পাবেন ফাইলগুলো একে একে আপলোড হচ্ছে। সমস্ত ফাইল পুরোপুরি আপলোড হতে কয়েক সেকেন্ড সময় লাগতে পারে।

6. ফাইল আপলোড শেষ হলে নিচে Commit changes নামে একটি অপশন পাবেন। এখানে মূলত আপনি কী পরিবর্তন করলেন তা লিখে রাখতে হয়। প্রথম বক্সটিতে লিখুন: `Initial Portfolio Upload` এবং নিচের সবুজ রঙের Commit changes বাটনে ক্লিক করুন।

ব্যাস, কাজ শেষ! কয়েক সেকেন্ড প্রসেসিং হওয়ার পর আপনার স্ক্রিনে আপনার আপলোড করা ফাইলগুলোর তালিকা দেখতে পাবেন। আপনার পোর্টফোলিওর কোড এখন নিরাপদে ইন্টারনেটে বা ক্লাউডে আপলোড হয়ে গেছে।

পরের পর্বে যা আসছে

আমরা আমাদের পোর্টফোলিও ওয়েবসাইটের সমস্ত কোড এবং ইমেজ সফলভাবে গিটহাবে নিয়ে এসেছি। এটি ছিল আমাদের প্রজেক্টের সবচেয়ে গুরুত্বপূর্ণ ব্যাক-এন্ড কাজ। এবার আমাদের সিরিজের চূড়ান্ত এবং সবচেয়ে আকর্ষণীয় পর্বের পালা!

পরের পর্বে (পর্ব ৭) আমরা শিখব কীভাবে এই গিটহাব রিপোজিটরি ব্যবহার করে মাত্র ১ মিনিটে এবং একদম ফ্রিতে আপনার পোর্টফোলিও ওয়েবসাইটটিকে ইন্টারনেটে লাইভ হোস্ট করা যায়। এরপর একটি সুন্দর ও সম্পূর্ণ ফ্রি লিংকের মাধ্যমে আপনি আপনার পোর্টফোলিওটি বিশ্বের যেকোনো প্রান্ত থেকে যেকোনো ডিভাইসে দেখাতে পারবেন। আমাদের সাথেই থাকুন!