میزبانی وب، سرویس‌های ابری و توسعه فرانت‌اند

آموزش میزبانی رایگان سایت استاتیک با GitHub Pages (گام‌به‌گام و عملی)

تاریخ انتشار: ۱۵ مرداد ۱۴۰۵
زمان مطالعه: ۱۱ دقیقه

یکی از دغدغه‌های همیشگی طراحان وب، توسعه‌دهندگان نوپا و حتی صاحبان پروژه‌های کوچک، هزینه‌های مداوم خرید هاست و دامنه برای بالا آوردن وب‌سایت است. اگر سایت شما از نوع استاتیک (Static) است—یعنی صرفاً با کدهای فرانت‌اند مثل HTML، CSS و جاوا اسکریپت نوشته شده و نیازی به پایگاه‌داده یا زبان‌های بک‌اند مانند PHP ندارد—پلتفرم مایکروسافت گیت‌هاب یک هدیه شگفت‌انگیز برای شما دارد: GitHub Pages.

سیستم گیت‌هاب پیجز به شما اجازه می‌دهد مخازن کدهای خود را به صورت کاملاً رایگان، بدون محدودیت‌های ترافیکی آزاردهنده و با آپتایم نزدیک به ۱۰۰ درصد روی سرورهای فوق‌سریع گیت‌هاب میزبانی کنید. در این آموزش، فرآیند راه‌اندازی این ابزار فوق‌العاده را از صفر تا صد بررسی می‌کنیم.

چرا باید از GitHub Pages استفاده کنیم؟

پیش از شروع فرآیند فنی، بیایید نگاهی به فرمول ساده صرفه‌جویی اقتصادی این سیستم بیندازیم. اگر هزینه متوسط خرید سالانه یک هاست اشتراکی معمولی را $H$ و هزینه تمدید دامنه را $D$ در نظر بگیریم، مجموع هزینه‌های سالانه میزبانی یک وب‌سایت ساده ($T$) به این صورت محاسبه می‌شود:

$$T = H + D \xrightarrow{GitHub\ Pages} T = 0 + D = D$$
(با استفاده از گیت‌هاب پیجز، هزینه هاست H برای همیشه صفر می‌شود)

در جدول زیر، مقایسه ساده‌ای میان این روش و میزبانی سنتی آورده شده است:

شاخص مقایسه گیت‌هاب پیجز (GitHub Pages) هاست اشتراکی معمولی
هزینه سالانه کاملا رایگان (۰ تومان) دارای هزینه ماهیانه و سالانه
پشتیبانی از بک‌اند خیر (فقط استاتیک) بله (PHP، پایتون، دیتابیس و...)
پهنای باند و آپتایم بسیار بالا (زیرساخت ابری مایکروسافت) محدود بر اساس پلن خرید
تمدید سالانه هاست ندارد (دائمی) دارد

گام اول: ثبت‌نام و ایجاد مخزن (Repository) جدید

  1. ابتدا وارد سایت رسمی گیت‌هاب به آدرس github.com شوید و یک حساب کاربری بسازید (اگر حساب دارید، وارد شوید).
  2. در پیشخوان کاربری خود، از گوشه سمت چپ بالا بر روی دکمه سبز رنگ New کلیک کنید تا وارد صفحه ساخت مخزن شوید.
  3. فیلدهای زیر را با دقت پر کنید:
    • Repository Name (نام مخزن): برای اینکه سایت به عنوان سایت اصلی اکانتتان شناسایی شود، نام مخزن را دقیقاً با الگوی username.github.io بنویسید (به جای username نام کاربری دقیق گیت‌هاب خود را بگذارید).
    • Public / Private: حتماً گزینه Public را انتخاب کنید. در پلن رایگان، سایت‌های استاتیک تنها از روی مخازن عمومی منتشر می‌شوند.
    • Add a README file: تیک این گزینه را بزنید تا مخزن با یک فایل متنی اولیه ایجاد شود.
  4. در نهایت روی دکمه Create repository کلیک کنید.

گام دوم: آماده‌سازی و آپلود فایل‌های سایت

سرورهای گیت‌هاب پیجز به طور پیش‌فرض به دنبال فایلی به نام index.html در پوشه اصلی (Root) کدهای شما می‌گردند تا آن را به عنوان صفحه خانگی لود کنند. بنابراین فایل اصلی پروژه‌تان باید دقیقاً با همین نام ذخیره شده باشد.

روش اول: آپلود مستقیم از طریق مرورگر (ساده‌ترین راه)

اگر کدهای شما آماده است و نمی‌خواهید درگیر دستورات ترمینال شوید:

۱. در صفحه مخزن خود، روی دکمه Add file کلیک کرده و گزینه Upload files را انتخاب کنید.
۲. تمام فایل‌های طراحی وب (HTML، CSS، JS و پوشه تصاویر) را بکشید و در کادر مربوطه رها کنید.
۳. در پایین صفحه، یک توضیح کوتاه بنویسید و روی دکمه سبز رنگ Commit changes کلیک کنید.

روش دوم: استفاده از دستورات Git (ویژه توسعه‌دهندگان)

اگر نرم‌افزار Git را روی سیستم خود نصب دارید، ترمینال را در پوشه پروژه باز کرده و کدهای زیر را به ترتیب اجرا نمایید:

# آماده‌سازی و ارسال کدها به گیت‌هاب
git init
git add .
git commit -m "First deploy"
git branch -M main
git remote add origin https://github.com/username/username.github.io.git
git push -u origin main

گام سوم: فعال‌سازی و انتشار نهایی وب‌سایت

پس از اینکه فایل‌های شما با موفقیت آپلود شدند:

  1. به تب Settings در بالای صفحه مخزن گیت‌هاب خود بروید.
  2. از منوی سمت چپ، به بخش Pages مراجعه کنید.
  3. در بخش Build and deployment، مطمئن شوید گزینه Source روی Deploy from a branch باشد.
  4. در کادر پایین آن، شاخه اصلی خود یعنی main را انتخاب کرده و پوشه را روی / (root) بگذارید و دکمه Save را بزنید.
لینک زنده وب‌سایت شما: حدود ۱ الی ۵ دقیقه منتظر بمانید. آدرس وب‌سایت شما با پروتکل امن HTTPS آماده استفاده خواهد بود:
https://username.github.io

کاربرد GitHub Pages برای توسعه‌دهندگان بومی و همکار با SPONSORACB

بسیاری از توسعه‌دهندگان خلاق ایرانی که با استفاده از وب‌سرویس‌ها و APIهای پایدار پلتفرم SPONSORACB اقدام به توسعه ربات‌های تلگرامی یا ابزارهای مبتنی بر هوش مصنوعی می‌کنند، از بستر رایگان GitHub Pages برای پروژه‌های خود بهره می‌برند.

الگوی توسعه فرانت‌اند با SPONSORACB

برنامه‌نویسانی که ربات‌های چندمنظوره تحت وب یا سیستم‌های اختصاصی متصل به مدل‌های زبانی (مانند ChatGPT و Claude) را با الگوبرداری از ربات محبوب SPONSORACB_BOT توسعه می‌دهند، برای قرار دادن فایل‌های راهنما، مستندات کدهای فرانت‌اند (Documentation) و صفحات فرود (Landing Pages) خود از گیت‌هاب پیجز استفاده می‌کنند. این صفحات استاتیک حتی می‌توانند به عنوان بستری برای معرفی خدمات هوش مصنوعی و هدایت کاربران به درگاه‌های دونیت ریالی و سیستم پرداخت درون‌برنامه‌ای monsmain (مربوط به سطوح کاربری فروشگاه SPONSORACB به آدرس sponsoracb.mydigify.app) مورد استفاده قرار گیرند.

پشتیبانی و توسعه زیرساخت وب با SPONSORACB

جهت مشاوره اتصال دامنه‌های اختصاصی (.ir / .com) به GitHub Pages، اتصال APIهای هوش مصنوعی و ساخت لندینگ‌پیج‌های پرسرعت، با تیم فنی **SPONSORACB** در ارتباط باشید.

ارتباط با ربات رسمی (sponsoracb_bot@)