এআই দিয়ে ওয়েবসাইট বানিয়ে হোস্টিংগারে পাবলিশ করার সম্পূর্ণ গাইড

প্রফেশনাল ইউটিউব চ্যানেল খোলার নিয়ম

কিভাবে কোনো কোডিং জ্ঞান ছাড়াই AI টুল ব্যবহার করে একটি সম্পূর্ণ প্রফেশনাল ওয়েবসাইট বানানো এবং হোস্টিংগারে পাবলিশ করা যায়।

পেজ সূচিপত্র ঃ এআই দিয়ে ওয়েবসাইট বানিয়ে হোস্টিংগারে পাবলিশ করার সম্পূর্ণ গাইড

হোস্টিংগার নিয়ে পরিচয়

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

আপনি যেকোনো এআই টুল দিয়েই ওয়েবসাইট বানান না কেন। হোস্টিংগারের সাথে সরাসরি কানেকট করে নিতে পারবেন। এআই কোডিং এজেন্ট দিয়ে বানালে এন্টিগ্রাভিটি, কোডেক্স, প্লট কোড, কারজার। গুগল এআই স্টুডিও এসব থেকেই সরাসরি কানেক্ট করা যায়, আবার ফ্রেমওয়ার্কের দিক থেকেও অনেক অপসন আছে। যেমন আমরা আজ যেটা ইউজ করব সেই Vibe Coding থেকেও সরাসরি হোস্টিংগারের সাথে কানেক্ট করা সম্ভব, Lovable AI, Bolt.nu, Base 44, V.0 এমন আরও অনেক টুল দিয়ে বানিয়ে সরাসরি হোস্টিংগাড় থেকেই ডিপলয় করে ফেলা যায়।

ChatGPT দিয়ে UI UX ডিজাইণ তৈরি নিয়ম

শুরুটা করতে হবে ChatGPT AI দিয়ে, এখানে বেশ কয়েকটা এআই টুল লাগবে যেমন ChatGPT AI, Claude AI আর আরও কিছু সামনে দেখবেন, ChatGPT AI দিয়ে শুরু করার কারন হলো এখানেই প্রথমে UIUX টা ডিজাইন করে নিতে হবে যেটা অনেকেই আসলে করে না। অথচ এটা করলে পরের কাজটা অনেক সহজ হয়ে যায়। তাই প্রথমে নিজের বিজনেস বা যেই ওয়েবসাইট বানাতে চান তার একটা থিম বাংলায় লিখে ফেলুন।

লিখলে বুঝতেও সহজ হয় এবং কাজেও গতি আসে, এরপর ওয়েবসাইটে কি কি থাকবে, ডিজাইনটা কেমন হবে। কি কি সার্ভিস দিবেন এসব লিখে ফেলুন। তারপর ChatGPT AI কে বলুন আপনার পুরো প্ল্যানটা বুঝে নিতে, কি রাখবেন কি রাখবেন না সব ডিটেইলে দিন। এরপর ডিজাইণ করে দিতে বললে ChatGPT AI পুরো একটা UIUX বানিয়ে দিবে।

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

Claude AI দিয়ে প্রমট তৈরি নিয়ম

এরপর হচ্ছে Claude এর ChatGPT AI থেকে বানানো UIUX ডিজাইণটা Claude AI এ দিয়ে। বলুন এটাই আপনার ওয়েবসাইটের ডিজাইন যেহেতু এটা এখন Lovable AI দিয়ে। আসল ওয়েবসাইটে রূপ দিবেন তাই Claude AI কে বলে দিন।Lovable AI এ এই ছবিটা এটাচ করার সাথে ঠিক কি প্রম্পট লিখতে হবে সেটা তৈরি করে দিতে, সাথে এটাও জানিয়ে রাখুন যে এটা Node js দিয়ে। হোস্টিংগারে ডিপ্লয় হবে via GitHub এই লাইনটা হুবহু রেখে দিতে পারেন, এরপর Claude AI আপনাকে পুরো প্রম্পটটা লিখে দিবে।

Lovable AI দিয়ে ওয়েবসাইট বানানো

এবার সেই প্রমট কপি করে। চলে যান Lovable AI এ, চাইলে Lovable AI এর বদলে অন্য যেকোনো Vibe Coding বা AI Agent সফটওয়্যার ইউজ করা। যায় যেমন AntiGravity, অন্য কোনো সাবস্ক্রিপসন থাকলে Plot over, এছাড়া Google AI Studio বা Bolt.new যেটা সুবিধা মনে হয়। সেটা নিতে পারেন, প্রথমে লগইন করে নিন, উপরের কর্নারে গেলে ক্রেডিট কতটা আছে দেখা যায়।

পেইড সাবস্ক্রিপশনে সাধারনত তিনশো পাঁচের মতো ক্রেডিট থাকে, তবে ফ্রিতেও কাজ চালানো যায় কারন। Lovable AI প্রথমে পাঁচ ক্রেডিট ফ্রি দেয় আর শেয়ার করলে আরও দশ থেকে একশো ক্রেডিট পর্যন্ত পাওয়া যায়। এবার কপি করা প্রম্পটটা এখানে পেস্ট করে দিন। সাথে ChatGPT Ai দিয়ে বানানো ইমেজটাও এড করুন।

একবার দেখে নিন সবকিছু ঠিকঠাক আছে কিনা তারপর Build এ ক্লিক করুন। এরপরই আসল কাজ শুরু হবে আর পাশেই দেখতে পাবেন আপনার ওয়েবসাইট আসলে কেমন রূপ নিচ্ছে। একটু সময় লাগবে তাই ধৈর্য ধরুন। জেনারেট হওয়া ওয়েবসাইটটা দেওয়া UIUX এর সাথে অনেকটাই মিলবে যদিও একদন হুবহু নাও হতে পারে। এটা পরে ঠিক করে নেওয়া যায় সহজেই, একটা সময় এই কাজ করতে অনেক সময় লাগতো, বিশেষত যারা কোডিং জানেন না তাদের জন্য এটা প্রায় অসম্ভবই ছিল। আর এখন AI দিয়ে মাত্র কয়েক লাইন লিখলেই এত কিছু হয়ে যায়।

ওয়েবসাইটের ভুলগুলো ঠিক করা

এবার যা যা ঠিক করা দরকার সেগুলোতে হাত দেওয়া যাক। আবার attachment এ গিয়ে আগের UIUX আর সাথে লোগোটা দিয়ে দিন। লোগোটা যদি প্রথমবার ভালো না আসে তাহলে বলুন সেকেন্ড অ্যাটাচমেন্ট আপনার লোগো এটা ঠিকভাবে বসাতে হবে আর প্রথমটা ওয়েবসাইটের ডিজাইন, যেভাবে দেওয়া আছে ঠিক সেভাবেই আবার সাজিয়ে দিতে বলুন।

দেখবেন রোবট আর লোগোগুলো ঠিকঠাক বসে গেছে, যদিও কখনো কখনো দেওয়া ছবি থেকে কেটেই বসিয়ে দেয়। আসল লোগো চাইলে বলুন Claude aI বা ChatGPT এর অরিজিনাল লোগো দিতে। নাহলে ChatGPT AI দিয়ে প্রতিটা লোগো আলাদাভাবে এক্সট্রাক্ট করিয়ে নিন। তারপর Lovable AI কে বলুন লোগোগুলো এখনো ঠিক হয়নি ব্যাকগ্রাউন্ড রিমুভ করে নতুন করে বসাতে। ফলাফল পছন্দ না হলে সরাসরি আগের ভার্সনে ফিরে যেতে বলুন।

এরপর যদি দেখেন কোনো বাটনই কাজ করছে না তাহলে সেটাও জানিয়ে দিন। Services, free prompts, resources, about এর জন্য আলাদা আলাদা পেজ বানাতে বলুন যাতে ক্লিক করলেই। আলাদা পেজে চলে যায়, যেমনটা একটা সাধারন ওয়েবসাইটে হওয়ার কথা। কোনো সেকশনের নাম বদলাতে চাইলে যেমন workshops এর বদলে portfolio রাখতে বলে দিন। get started আর book a demo বাটনগুলো ঠিকমতো কাজ করছে কিনা সেটাও বলুন, একটু পরেই দেখবেন Lovable সব সমস্যা ঠিক করে দিয়েছে।

services, portfolio, free prompt এ ক্লিক করে দেখুন প্রতিটা আলাদা পেজে যাচ্ছে কিনা। প্রম্পটগুলো এমনকি marketing, content, business অনুযায়ী আলাদা সেকশনেও ভাগ হয়ে যেতে পারে। resource আর about পেজও একবার চেক করে নিন। get started ক্লিক করলে প্রমট পেজে যাচ্ছে কিনা দেখুন book a demo তে নাম, ফোন নাম্বার, মেসেজ দেওয়ার আলাদা ফর্ম আছে কিনা দেখুন। আর login এ গুগল দিয়ে সাইন ইন করার অপশন যোগ করে নিন।

মোবাইলের জন্য অপটিমাইজেশন

ওয়েবসাইটটা কেমন দেখাচ্ছে পুরোপুরি বুঝতে চাইলে PC ট্যাবলেট আর ফোন তিন জায়গাতেই একবার চেক করে নিন। যদি দেখেন ফোনে ঠিকঠাক দেখাচ্ছে না তাহলে Lovable AI কে সহজভাবে বলুন এটা ফোনের জন্য অপটিমাইজ করে দাও। এরপর একটু সময় দিলেই দেখবেন ফোনেও একদম পারফেকটভাবে সব বসে গেছে।

লোগো বাঁদিকে চলে যাওয়া বা কোথাও এলোমেলো থাকা এই ধরনের যেকোনো ছোটখাটো সমস্যাও এভাবেই ঠিক করে নেওয়া যায়। আলাদা লিংক ওপেন করে পুরো ওয়েবসাইটটা একবার প্রিভিউ দেখে নিন আর সব ঠিকমতো কাজ করছে কিনা যাচাই করুন। আরও কিছু যোগ করতে ইচ্ছা হলে সেটাও Lovable AI দিয়েই করে ফেলা যাবে।

GitHub এর সাথে কানেকট করা

এবার আসল কাজ, ওয়েবসাইট পাবলিশ করা, এটা করার বেশ কয়েকটা রাস্তা আছে, চাইলে কোনো খরচ ছাড়াই Lovable AI এর নিজস্ব ডোমেইন দিয়ে সরাসরি পাবলিস করে দেওয়া যায়, তবে ভালো হয় ওয়েবসাইটটা GitHub এর সাথে কানেক্ট করে নেওয়া। কারন এতে নিজের ডোমেইন আর হোস্টিং দিয়ে পরে পাবলিশ করার সুবিধা থাকে। প্রথমে GitHub লিখে সার্চ করে সেখানে একটা অ্যাকাউন্ট খুলে নিন, Lovable এর সেই প্লাস বাটনে যেখান থেকে ইমেজ এড করেছিলেন সেখানেই GitHub এর অপসন পাবেন।

GitHub এ ক্লিক করে সিংক ইওর GitHub এড কানেকশনে ক্লিক করুন তারপর এড অ্যাকাউন্টে ক্লিক করুন, এরপর অটোমেটিক অ্যাকাউন্ট খুঁজে নিবে। অথরাইজে ক্লিক করলেই কানেকশন হয়ে যাবে, GitHub এ গিয়ে দেখুন ওয়েবসাইটের সব ডেটা রেডি হয়ে গেছে কিনা, এই কানেকশনের সবথেকে ভালো দিক হলো ওয়েবসাইট পাবলিশ হয়ে যাওয়ার পরও Lovable AI দিয়ে যেকোনো আপডেট করলে সেটা অটোমেটিক GitHub এ সিংক হয়ে যাবে, ফলে ডেটা সবসময় রিয়াল টাইমে আপডেটেড থাকবে।

হোস্টিংগারে প্ল্যান এবং ডোমেইণ কেনা

এবার হোস্টিংগাড়ে ডিপ্লয় করার পালা। ভিউ প্ল্যানে ক্লিক করলে কিছু প্ল্যান চোখে পড়বে। এর মধ্যে দুইটা প্ল্যান সবথেকে বেশি জনপ্রিয়। একটা মাসে 3.79 ডলারের, এতে ৫০টা ওয়েবসাইট হোস্ট করা যায়, 3GB RAM আর ৫০GB NVMe স্টোরেজও পাওয়া যায়। নতুন কোনো ওয়েবসাইট শুরু করার জন্য এই প্ল্যানটাই যথেষ্ট, তবে বড় বা ভারি কোনো ওয়েবসাইট হলে অন্য প্ল্যান বেছে নেওয়াই ভালো। চুজ প্ল্যানে ক্লিক করার আগে অবশ্যই একটা হোস্টিংগার অ্যাকাউন্ট খুলে রাখবেন, ৪৮ মাসের প্যাকেজ নিলে দাম সবথেকে কম পড়ে, চার বছরের জন্য মাত্র 181 ডলারেই মিলে যায় আর সাথে এক বছরের জন্য একটা ডোমেইনও ফ্রি পাওয়া যায়।

বারো মাসের প্যাকেজ নিলে দাম দাঁড়ায় প্রায় ঊনষাট ডলারের মতো, ডোমেইন বেছে নেওয়ার সময় যদি .com পাওয়া না যায় তাহলে .net বা অন্য কোনো এক্সটেনশন নিলেও চলবে, সেটাও এক বছরের জন্য ফ্রি মেলে। তবে দুই বছরের প্যাকেজ ভুলে সিলেকট করে ফেললে দাম বেড়ে যায় তাই একটু খেয়াল রাখতে হবে। বিপ্রজিত কুপন কোডটা ব্যবহার করলে সাধারনত 10% পর্যন্ত ছাড় পাওয়া যায়, তারপর কন্টিনিউ তে ক্লিক করলেই পারচেজ সম্পন্ন হয়ে যাবে, হোস্টিংগার ডোমেইণ লিখে সার্চ দিলে কোন ডোমেইন এভেলেবল আছে আর কোনটা নেই সেটাও আলাদাভাবে চেক করা যায়, দাম, এআই সাপোর্ট আছে কিনা এই সবকিছুই সেখানে দেখা যায়।

ওয়েবসাইট ডিপলয় এবং পাবলিস করা

পারচেজ শেষ হলে create a website এ ক্লিক করে এগিয়ে যান for myself বা my business এই অপশনে yes দিয়ে একদম নতুন ওয়েবসাইট শুরু করুন। আগে থেকে কিছু থাকলেও সেটাতে মাইগ্রেট করার দরকার নেই, step personalization এ ক্লিক করার। পর পাবলিশ করার জন্য বেশ কিছু অপশন সামনে আসবে, হোস্টিংগাড়ের নিজস্ব একটা বিল্ডার টুল আছে নাম Horizon, এটাও অনেকটা Lovable AI এর মতোই কাজ করে চাইলে সেটাও ব্যবহার করা যায়।

drag and drop স্টাইল পছন্দ হলে সেই অপসনও আছে, WordPress এ বানাতে চাইলে সেটাও নেওয়া যায়, তবে যেহেতু এখানে সবটা Node.js এ বানানো হচ্ছে তাই GitHub, Cloud Code, Karzor বা VS Code এর সাথে কানেক্ট করার অপশনটাই বেছে নিন, তারপর Next এ ক্লিক করে আগে কেনা ডোমেইনটা সিলেক্ট করুন। এরপর সার্ভার বেছে নেওয়ার পালা, latency যত কম হবে সাইট ততই দ্রুত লোড হবে, তাই সবথেকে কাছের সার্ভারটাই বেছে নিন।

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

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