प्रस्तावना
ChatGPT, Canva, Gemini Canvas, Claude Artifacts या Sider Web Creator जैसे AI टूल्स के साथ साइट बनाने के बाद, अगला बड़ा सवाल है GitHub Pages पर वेब होस्टिंग को कैसे हैंडल करें ताकि आप अपनी खुद की डोमेन के माध्यम से साइट पर जा सकें। यह गाइड आपको स्टेप-बाय-स्टेप यात्रा के माध्यम से ले जाता है— में एक प्रोजेक्ट को एक्सपोर्ट करने से लेकर आपके व्यक्तिगत डोमेन के तहत पूरी तरह से विकसित वेबसाइट के साथ समाप्त होने तक—वेब होस्टिंग और GitHub Pages कॉन्फ़िगरेशन दोनों को रास्ते में सरल बनाते हुए।
🎯 आप क्या सीखेंगे
GitHub Pages वेब-होस्टिंग वर्कफ़्लो चुनने से पहले AI-जनरेटेड प्रोजेक्ट फ़ाइलों को सही ढंग से डाउनलोड और समझना।
GitHub Pages पर साइट को मुफ्त में डिप्लॉय करने के लिए स्टेप-बाय-स्टेप निर्देश।
GitHub Pages सेटिंग्स के अंदर अपना खुद का कस्टम डोमेन कैसे खरीदें और बाइंड करें और इसे सर्वोत्तम-अभ्यास DNS रिकॉर्ड से कनेक्ट करें।
साइट को पूरी तरह से पेशेवर और भरोसेमंद दिखाने के लिए प्रो टिप्स, एक बार GitHub Pages सेटअप लाइव हो जाने के बाद।
📥 स्टेप 1: Sider Web Creator से अपनी साइट डाउनलोड करें
अधिकांश स्टैटिक-होस्टिंग प्लेटफ़ॉर्म—GitHub Pages सहित—एक साफ बिल्ड फ़ोल्डर की उम्मीद करते हैं, इसलिए पहले आपको अपनी फ़ाइलों को इकट्ठा करने की आवश्यकता है।
1.1 प्रोजेक्ट फ़ाइलें डाउनलोड करें
Web Creator द्वारा साइट जनरेट करने के बाद, ऊपरी-दाएँ कोने में डाउनलोड बटन पर क्लिक करें।
सिस्टम द्वारा आपके प्रोजेक्ट को पैकेज करने की प्रतीक्षा करें।
आपको GitHub Pages अपलोड के लिए तैयार एक .zip फ़ाइल प्राप्त होगी।
अपने कंप्यूटर पर कहीं भी ज़िप निकालें।
1.2 फ़ाइल संरचना को समझें (महत्वपूर्ण!)
my-website/
├── dist/ ⭐ **GitHub Pages** के लिए प्रोडक्शन बिल्ड
│ ├── index.html → होम पेज
│ ├── assets/ → स्टाइल और स्क्रिप्ट
│ └── …
├── src/ 📝 सोर्स कोड फ़ोल्डर
├── package.json 📦 प्रोजेक्ट कॉन्फ़िगरेशन
└── …अन्य फ़ाइलें
मुख्य अनुस्मारक: केवल dist/ के अंदर की सामग्री GitHub Pages पर प्रकाशित होती है।
1.3 लोकल प्रीव्यू टेस्ट
dist/ फ़ोल्डर में प्रवेश करें।
index.html पर डबल-क्लिक करें।
साइट आपके ब्राउज़र में खुलती है।
GitHub Pages पर पुश करने से पहले सब कुछ सत्यापित करें।
🚀 स्टेप 2: एक डिप्लॉयमेंट प्लेटफ़ॉर्म चुनें
जबकि GitHub Pages इस गाइड का हीरो है, यहाँ एक त्वरित तुलना दी गई है:
| |
|---|
🌟 GitHub Pages (इस गाइड का फोकस) | पूरी तरह से मुफ़्त • ड्रैग-एंड-ड्रॉप या git push डिप्लॉयमेंट • मुफ़्त HTTPS • ग्लोबल CDN • कस्टम डोमेन • GitHub Actions के साथ नेटिव CI |
| ग्लोबल एज नेटवर्क • 100% मुफ़्त • बहुत तेज़ |
| |
📤 स्टेप 3: GitHub Pages पर डिप्लॉय करें (विस्तृत गाइड)
हालांकि GitHub Pages एक डेवलपर प्लेटफ़ॉर्म के अंदर रहता है, लेकिन इसे पुश-बटन सुविधा के साथ अल्ट्रा-मॉडर्न वेब होस्टिंग के रूप में सोचें।
3.1 साइन अप करें और एक रिपॉजिटरी बनाएं
github.com पर जाएं और साइन इन करें।
+ नई रिपॉजिटरी पर क्लिक करें।
इसे my-website नाम दें और पब्लिक चुनें (या प्राइवेट यदि आपके पास एक पेड प्लान है; GitHub Pages अब प्राइवेट रिपॉजिटरी का समर्थन करता है)।
यदि आप बाद में पुश करने की योजना बनाते हैं तो README के साथ इनिशियलाइज़ करें को अनचेक छोड़ दें।
3.2 अपनी साइट फ़ाइलें जोड़ें
विधि A: ड्रैग-एंड-ड्रॉप अपलोड (शुरुआती लोगों के लिए सर्वश्रेष्ठ)
रिपो के कोड टैब में फ़ाइल जोड़ें → फ़ाइलें अपलोड करें पर क्लिक करें।
dist/ के अंदर सब कुछ छोड़ दें।
नीचे स्क्रॉल करें और बदलावों को कमिट करें पर क्लिक करें।
विधि B: Git CLI (डेवलपर्स के लिए सर्वश्रेष्ठ)
# खाली रिपो क्लोन करें
git clone https://github.com/<user>/my-website.git
cd my-website
# बिल्ड आउटपुट कॉपी करें
cp -r /path/to/dist/* .
# कमिट और पुश करें
git add .
git commit -m "इनिशियल **GitHub Pages** डिप्लॉय"
git push origin main
कोई भी पथ आपको रिपो रूट पर स्टैटिक फ़ाइलों के साथ छोड़ देता है—GitHub Pages के लिए बिल्कुल सही।
3.3 GitHub Pages सक्षम करें
सेटिंग्स → पेज पर जाएं।
स्रोत के तहत एक शाखा से डिप्लॉय करें → मुख्य (/रूट) चुनें।
सेव पर क्लिक करें। GitHub Pages ~30 सेकंड में बनता है और https://<user>.github.io/my-website/ जैसा URL लौटाता है।
3.4 अपना डिफ़ॉल्ट URL प्राप्त करें
यह पुष्टि करने के लिए लिंक पर जाएं कि सब कुछ लोड होता है। GitHub Pages स्वचालित रूप से ग्लोबल CDN के माध्यम से सेवा प्रदान करता है।
🌐 स्टेप 4: अपना खुद का डोमेन खरीदें और बाइंड करें
4.1 एक डोमेन खरीदें
सुझाए गए रजिस्ट्रार (सभी GitHub Pages के साथ अच्छी तरह से खेलते हैं): Namecheap, GoDaddy, Alibaba Cloud, Tencent Cloud। जहां संभव हो, एक छोटा .com चुनें।
4.2 GitHub Pages में डोमेन जोड़ें
अभी भी सेटिंग्स → पेज में, कस्टम डोमेन खोजें।
mywebsite.com या www.mywebsite.com दर्ज करें।
सेव पर क्लिक करें। GitHub Pages स्वचालित रूप से एक CNAME फ़ाइल लिखता है।
4.3 DNS रिकॉर्ड कॉन्फ़िगर करें
| | |
|---|
| | 185.199.108.153, 185.199.109.153, 185.199.110.153, 185.199.111.153
|
| | |
प्रसार के लिए 10 मिनट–24 घंटे प्रतीक्षा करें। ये IP GitHub Pages के लिए स्थिर हैं। |
4.4 HTTPS लागू करें
DNS के प्रसारित होने के बाद, पेज सेटिंग्स को रीफ्रेश करें और HTTPS लागू करें को टॉगल करें। Let’s Encrypt प्रमाण पत्र स्वचालित रूप से जारी होते हैं।
✨ स्टेप 5: साइट को पेशेवर दिखाएं
5.1 एक कस्टम फ़ेविकॉन जोड़ें
favicon.ico नामक एक 32×32 px आइकन तैयार करें।
इसे रिपो रूट में रखें।
कमिट करें और पुश करें; GitHub Pages इसे तुरंत परोसता है।
5.2 कस्टम मेटा जानकारी डालें
रिपो रूट में index.html संपादित करें:
<meta name="description" content="Your website description on **GitHub Pages**">
<meta name="author" content="Your Name">
5.3 एनालिटिक्स (वैकल्पिक)
<head> के अंदर GA / Plausible स्निपेट्स पेस्ट करें; GitHub Pages कैशिंग हेडर का सम्मान करता है।
🔧 समस्या निवारण
खाली पेज? पुष्टि करें कि index.html रिपो रूट में है और एसेट पथ सापेक्ष हैं।
डोमेन लूप .github.io पर? A/CNAME रिकॉर्ड को दोबारा जांचें और पूरे TTL की प्रतीक्षा करें।
HTTPS टॉगल अक्षम? DNS अभी तक सही नहीं है; dig से सत्यापित करें।
🎉 सारांश
बधाई हो! अब आपके पास है:
✅ GitHub Pages होस्टिंग के लिए तैयार अपनी AI-जनरेटेड वेबसाइट को सफलतापूर्वक डाउनलोड किया।
✅ इसे GitHub Pages पर मुफ्त में डिप्लॉय किया।
✅ अपना खुद का कस्टम डोमेन सुरक्षित किया।
✅ GitHub Pages वातावरण को पूरी तरह से पेशेवर दिखने के लिए पॉलिश किया।
आपकी साइट अब है:
🌐 ऑनलाइन 24/7, GitHub Pages CDN द्वारा संचालित।
🏷️ एक पेशेवर डोमेन के तहत परोसा गया।
🔒 HTTPS एन्क्रिप्शन द्वारा संरक्षित।
⚡ GitHub Pages एज नोड्स के लिए विश्व स्तर पर तेज़।
🗝️ पूरी तरह से आपके स्वामित्व और नियंत्रण में।
💡 अगले चरण
SEO ऑप्टिमाइजेशन: अपने GitHub Pages सेटअप के लिए खोज रैंकिंग को बढ़ावा देने के लिए लक्षित कीवर्ड और मेटा विवरण जोड़ें।
सोशल शेयरिंग: प्रमुख प्लेटफ़ॉर्म के लिए शेयर बटन को एकीकृत करें।
निरंतर अपडेट: नियमित रूप से बदलावों को कमिट करें; GitHub Pages ऑटो-रीडिप्लॉय करता है।
बैकअप: GitHub रिपॉजिटरी सुरक्षा सक्षम करें या रिपो को मिरर करें।
अब आप एक सच्चे वेबसाइट मालिक हैं—अपना GitHub Pages लिंक साझा करें और अपनी रचना को दुनिया को दिखाएं!
