مطالب آموزشی

  • آموزش ساخت سایت با GitHub
  • CSS
  • WordPress

آموزش کامل ساخت و انتشار سایت با GitHub و GitHub Pages


آموزش کامل ساخت و انتشار سایت با GitHub و GitHub Pages
مقدمه

GitHub Pages یکی از بهترین و ساده‌ترین روش‌ها برای ساخت و انتشار سایت‌های شخصی است. با استفاده از آن می‌توانید بدون نیاز به هاست، سایت خود را فقط با HTML و CSS منتشر کنید و حتی دامنهٔ شخصی خود را نیز به آن متصل کنید. در این آموزش، تمام مراحل را از صفر تا صد توضیح می‌دهیم.
۱) ساخت پروژهٔ سایت روی کامپیوتر
ابتدا یک پوشه برای سایت خود بسازید و فایل‌های زیر را داخل آن قرار دهید:
• فایل اصلی: index.html
• فایل استایل: style.css
• پوشهٔ تصاویر: images/
• آیکون سایت (اختیاری): favicon.ico
________________________________________
۲) ساخت حساب GitHub
اگر حساب GitHub ندارید، یک حساب جدید بسازید. نام کاربری شما در آدرس سایت استفاده می‌شود.
________________________________________
۳) ساخت ریپازیتوری برای سایت
در GitHub روی New Repository کلیک کنید و یک ریپازیتوری جدید بسازید:
• نام ریپازیتوری: مثلاً mozouni
• حالت: Public
• سپس Create Repository را بزنید.
________________________________________
۴)آپلود فایل‌های سایت
پس از ساخت ریپازیتوری:
• وارد آن شوید
• روی Add file → Upload files کلیک کنید
• فایل‌های سایت خود را آپلود کنید
• Commit کنید
________________________________________
۵) فعال‌سازی GitHub Pages
برای انتشار سایت:
• وارد Settings → Pages شوید
• در بخش Build and deployment:
o Source: گزینهٔ Deploy from branch
o Branch: main
o Folder: /root
• ذخیره کنید
پس از چند دقیقه سایت شما روی آدرس زیر بالا می‌آید:
https://USERNAME.github.io/REPO-NAME/
________________________________________
اتصال دامنهٔ شخصی : مثل mozouni.ir))
۶) ساخت فایل CNAME
در ریپازیتوری یک فایل جدید بسازید:
نام فایل:
CNAME
محتوا:
mozouni.ir
Commit کنید.
________________________________________
۷)اتصال دامنه به Cloudflare
ابتدا وارد Cloudflare شو و از منوی بالا روی Add a domain بزن.
• دامنه‌ت رو وارد کن:
• mozouni.ir
• روی Continue بزن.
Cloudflare شروع می‌کنه DNSهای فعلی دامنه‌ت رو اسکن کردن.
• Cloudflare چند پلن نشون می‌ده.
تو فقط گزینهٔ Free رو انتخاب کن و ادامه بده.
پلن رایگان برای GitHub Pages کاملاً کافی و عالیه.
در این مرحله Cloudflare رکوردهای قبلی دامنه‌ت رو نمایش می‌ده.
تو فقط روی Continue بزن چون بعداً خودمون رکوردهای درست رو می‌سازیم.
• Cloudflare بهت دو Name Server می‌ده. مثلاً:
dax.ns.cloudflare.com
gemma.ns.cloudflare.com
این‌ها رو باید در پنل دامنه (ایرانیک) وارد کنی.
________________________________________
به پنل دامنه‌ت در NIC.ir برو:
• وارد بخش Nameservers شو
• دو Name Server Cloudflare رو وارد کن
• ذخیره کن
بعد از ذخیره، ایرانیک معمولاً ۳۰ دقیقه تا چند ساعت طول می‌کشه تا Name Serverها رو تغییر بده.
________________________________________
وقتی Name Serverها درست تنظیم بشن، Cloudflare به‌طور خودکار دامنه‌ت رو فعال می‌کنه و یک تیک سبز می‌گیری.
________________________________________
مرحلهٔ مهم بعدی: تنظیم رکوردهای DNS
وقتی دامنه در Cloudflare فعال شد:
رفتن به بخش DNS → Records
در داشبورد Cloudflare:
• روی دامنه‌ت کلیک کن
• از منوی بالا DNS رو انتخاب کن
• وارد بخش Records شو
________________________________________
ساخت رکوردهای A برای GitHub Pages
چهار رکورد A بساز:
Type: A
Name: mozouni.ir
Content: 185.199.108.153
Proxy: DNS only
همین رو با سه آی‌پی دیگر تکرار کن:
185.199.109.153
185.199.110.153
185.199.111.153
________________________________________
ساخت رکورد CNAME برای www
یک رکورد CNAME بساز:
Type: CNAME
Name: www
Content: mahood7m-hub.github.io
Proxy: DNS only
________________________________________
فعال‌سازی دامنه در GitHub Pages
در ریپازیتوری:
• Settings → Pages
• در بخش Custom domain بنویس:
• mozouni.ir
• Save
• بعد از صدور SSL گزینهٔ Enforce HTTPS رو فعال کن (معمولاً ۳۰ دقیقه تا چند ساعت طول می‌کشه)
________________________________________
نتیجه
بعد از انتشار DNS، سایتت با دامنهٔ شخصی بالا میاد:
https://mozouni.ir

مطالب آموزشی

  • hTML
  • CSS
  • WordPress