چگونه در گیت‌هاب، وب‌سایت‌ بسازیم (قسمت اول)

توجه هم داشته باشید که این روش بیشتر مناسب صفحات شخصی و صفحاتی برای موضوعات خاص و پروژه‌هاست و شما نمی‌توانید به این روش یک فروشگاه الکترونیک یا یک برنامه نیازمند به پایگاه‌داده و مشابه آن بسازید.
اگر تابحال برای خودتان یا اطرافیانتان وب‌سایت یا وبلاگی راه‌اندازی کرده باشید با عبارات و اصطلاحات مقابل آشنا هستید: «ثبت دامنه»، «اجاره فضا» (میزبانی وب)، «هک شدن وب‌سایت»، «پشتیبان‌گیری»، php و MySQL (پایگاه‌داده) و مانند این‌ها و اگر هم از سیستم‌های مدیریت محتوا مثل وردپرس، جوملا و دروپال استفاده کرده باشید، می‌دانید که برای داشتن یک وبلاگ یا وب‌سایت‌ نیاز است اول پایگاه‌‌داده لازم را ایجاد و سپس این برنامه‌ها را از سایت‌هایشان دریافت و در میزبانی خودتان بارگذاری و سپس نصب کنید.
اگر تا این جای مطلب را خوانده‌اید نترسید! من قصد ندارم که چیزهای خیلی بیشتری به اصلاحات بالا اضافه کنم بلکه قصد دارم آن‌ها را از میان بردارم. ولی اول ببینیم روش کار فعلی چگونه است و چرا یک روش بهتر نیاز است.
برای داشتن یک وبلاگ یا وب‌سایت‌ جهت معرفی خودتان یا پروژه‌تان یا باید صفحات آن را خودتان با تکنولوژی‌های وب، یعنی HTML وCSS و JavaScript بنویسید یا از سیستم‌های مدیریت محتوا استفاده کنید. ارائه‌دهندگان سیستم‌های مدیریت محتوا مثل وردپرس به رایگان اجازه ثبت وبلاگ می‌دهند ولی محدودیت دارند، یعنی شما نمی‌توانید برنامه وب‌سایت را به دل‌خواه خودتان تغییر بدهید و این‌که در ایران از دسترس خارج هستند. البته برای استفاده از دامنه شخصی با سرویس آن‌ها باید جداگانه پول بپردازید که خب پرداخت تقریبا ممکن نیست. راه‌حل رایج در این موارد داشتن میزبانی شخصی است. ولی این راه‌حل مزایا و معایب خودش را دارد که به اختصار شرح می‌دهم.
اول از همه شما باید یک میزبانی بخرید، خیلی از گیک‌ها خودشان سرور اختصاصی یا میزبانی اختصاصی دارند، خیلی‌های دیگر هم نه! میزبانی مورد نظر باید برنامه و پایگاه‌داده مورد استفاده شما را پشتیبانی کند (مثلا php و MySQL) بعد هم باید خاطرتان باشد هرسال آن را تمدید کنید. در ضمن باید مسئولیت نگهداری از آن را خودتان بر عهده بگیرید. هر مشکلی به وجود بیاید باید آن را رفع کنید و نسبت به به‌روزرسانی‌ برنامه وب‌سایت‌ خودتان اقدام کنید. شاید هم وب‌سایت‌ شما هک شود و یک روز صبح با خبر شوید که به جای وب‌سایت‌ شیک شما یک صفحه سیاه و چند نوشته و یک پرچم و اسم یک گروه عجیب که کلی شعار داده و خیلی خوشحال است که وب‌سایت شما را فتح کرده به نمایش درمی‌آید! خب حالا باید بروید دنبال برگرداندن آخرین نسخه پشتیبان و به‌روزرسانی‌ و از دست دادن بخشی از محتوا و نظرات مراجعان وب‌سایت و الی آخر.

ولی گیت همه چیز را عوض کرده است. باید به لینوس توروالدز به خاطر خلق آن دست مریزاد گفت. هر روز در اینترنت سرویس‌های جدیدی در حال ظهور هستند که داده‌هایشان را به کمک گیت نگهداری کرده و بین رایانه‌ها منتقل می‌کنند.

علاوه بر این‌ها مشکلات دیگری هم هست. شما نمی‌توانید تاریخچه تغییرات کارهایتان را حفظ کنید. یعنی اگر بخواهد بدانید که قبلا چه چیزی روی وب‌سایت قرار داده بودید و چه تغییراتی اخیرا ایجاد کرده‌اید نیاز دارید خودتان این‌ها را جایی یادداشت کنید یا فایل‌ها را روی رایانه‌تان نگهداری کنید. کاری که خود من در گذشته انجام می‌دادم و نسخه پشتیبان تهیه می‌کردم و در جاهای مختلف ذخیره و نگهداری می‌کردم تا در صورت بروز مشکلات مختلف از جمله هک شدن وب‌سایت بتوانم آن‌ها را بازگردانی کنم. اما این کارها علاوه بر وقت‌گیر بودن خسته‌کننده هم بودند. چرا که من از ابزارهای مدرنی بهره نمی‌بردم، مجبور بودم با ابزارهای ftp و برنامه‌هایی مانند filezilla و یا رابط گرافیکی cpanel فایل‌ها را جابه‌جا کنم که عملیاتی ملال‌آور بود، آن هم فقط برای یک وب‌سایت‌ ساده که محتوایش نیاز چندانی هم به به‌روزرسانی‌ نداشت.
ولی گیت همه چیز را عوض کرده است. باید به لینوس توروالدز به خاطر خلق آن دست مریزاد گفت. هر روز در اینترنت سرویس‌های جدیدی در حال ظهور هستند که داده‌هایشان را به کمک گیت نگهداری کرده و بین رایانه‌ها منتقل می‌کنند. پس ما هم از همین روش خوش‌دست و قدرتمند برای ایجاد و نگهداری وب‌سایت‌مان بهره می‌گیریم.

راه‌حل
به خاطر این‌که من یک مهندس راحت‌طلب هستم و گیت‌هاب را هم خیلی دوست دارم و علاقه‌ای هم ندارم که پول اضافی خرج کنم (دیگر اصلا پولی برایم نمانده!) پس راه‌حل دیگری را انتخاب کردم. چه خوب است که همه صفحات وب‌سایت‌ من ایستا باشد، یعنی با همان تکنولوژی‌های وب نوشته بشود بدون هیچ برنامه و پایگاه‌داده سمت سرور! مثل روزهای اول وب. دیگر نه نگرانی دارد، نه نصب می‌خواهد نه به‌روزرسانی می‌خواهد نه اصلا هک شدنش مهم است. خب شاید بگویید کجای این شد راه‌حل؟ الان شرح می‌دهم.
خیلی وقت‌ها ما فقط نیاز داریم تا در یک صفحه، خودمان یا پروژه‌مان یا یک ایده یا گروه را معرفی کنیم. تصور کنید من می‌خواهم اطلاعات تماس خودم را در اینترنت بگذارم یا یک صفحه برای معرفی گروه کوچک خودم و دوستانم بسازم. یا پروژه‌ای دارم که نیاز است شرحی از آن به همراه پیوند دریافتش را در اینترنت قرار بدهم. در این موارد تنها چیزی که برای ما مهم است قرار دادن مطالبمان در اینترنت است. تهیه یک میزبانی و به جان خریدن دردسرهایش برای چنین مواردی نمی‌ارزد. پس چه بهتر که از آن چه در اینترنت هست استفاده کنیم و خیالمان را از بابت رسیدگی به وب‌سایت‌ راحت کنیم. در ضمن سرعت انجام کار در روش ما خیلی بالاست. ما نیازی به تماس گرفتن با ارائه‌دهندگان میزبانی نداریم و دیگر هم نیازی نیست برای فعال کردن فلان قابلیت خاص که فلان سیستم مدیریت محتوا نیاز دارد با آن‌ها تماس بگیریم یا مدت زمان مدیدی منتظر پاسخ‌ گروه پشتیبان آن‌ها بمانیم. دیگر هم هر چند وقت یک‌بار ایمیل‌ دریافت نمی‌کنیم که میزبانی شما تا فلان روز منقضی می‌شود و باید فلان‌قدر پرداخت کنید و مانند این‌ها. از همه این‌ها گذشته وقتی وب‌سایت ما روی صفحات گیت‌هاب قرار بگیرد یک شرکت شناخته شده مسئولیت نگهداری از وب‌سایت‌ ما و انتشار محتوای آن را بر عهده خواهد داشت.

مواد لازم:

  • یک حساب کاربری در گیت‌هاب
  • یک رایانه‌ مجهز به Git و Jekyll2
  • یک حساب کاربری در Disqus (اختیاری)
  • یک دامنه ثبت شده (اختیاری)
  • و البته آشنایی اولیه با گیت و گیت‌هاب


نکته اول. در این روش ما میزبانی نمی‌خریم پس کل مشکلات میزبانی که به آن‌ها اشاره کردم را فراموش کنید، خداحافظ میزبانی!
نکته دوم. ما وب‌سایت‌مان را روی گیت‌هاب قرار می‌دهیم و عملیات ذخیره و نگهداری تاریخچه تغییراتمان را به گیت‌هاب محول می‌کنیم.
نکته سوم (اختیاری). برای فعال کردن نظرات از یک سرویس‌دهنده سوم مثل Disqus استفاده می‌کنیم و وظیفه نگهداری از نظرات و نظرات کاربران را به او محول می‌کنیم.
نکته چهارم (اختیاری). بکارگیری دامنه یا زیردامنه شخصی برای نمایش وب‌سایت‌ ساخته شده.

نحوه راه‌اندازی
در این روش ما از امکانات بستره گیت‌هاب برای نگهداری و از صفحات گیت‌هاب برای انتشار وب‌سایت‌ خودمان استفاده می‌کنیم. فرض من بر این است که خواننده با گیت و گیت‌هاب آشنایی ابتدایی دارد. اگر با گیت‌ آشنا نیستید توصیه می‌کنم با مراجعه به صفحه آموزش گیت‌هاب و صرف ۱۵ دقیقه وقت با امکانات گیت آشنا شوید چرا که یادگرفتن گیت (و گیت‌هاب) به مجالی جداگانه نیاز دارد و از حوزه این مقاله خارج است. فعلا همین بس که بدانید در حال حاضر گیت‌هاب بزرگترین مخزن نرم‌افزارهای متن‌باز دنیاست و امکانات گیت را به صورت گرافیکی به کاربر ارایه می‌کند. در گیت‌هاب هر کاربر می‌تواند هر تعداد دل‌خواه مخزن نرم‌افزاری (Repository) ایجاد کند. ما هم برای وب‌سایت‌مان یک مخزن ایجاد می‌کنیم. نکته این‌جاست که گیت‌هاب اجازه می‌دهد به ازای هر مخزن یک وب‌سایت‌ تحت دامنه username.github.io/projectname ایجاد کرد که در حقیقت برای مستندات پروژه در نظر گرفته شده است ولی برای ما مستندات پروژه همان خود پروژه است! یعنی وب‌سایت‌. روش گام به گام این کار را در ادامه شرح می‌دهم.
اول به یک حساب کاربری روی گیت‌هاب احتیاج داریم. اگر ندارید همین الان با مراجعه به www.github.com یکی بسازید! در مرحله دوم یک مخزن جدید می‌سازیم. برای این کار کافی است روی علامت + در صفحه اصلی کلیک کنیم و یک نام برای مخزن جدید انتخاب کنیم. در صفحه ایجاد مخزن جدید گزینه‌ای هست برای افزودن فایل README به پروژه، آن را هم انتخاب کنید. بعدا می‌توانید شرح کوتاهی در مورد وب‌سایت یا پروژه‌تان آن‌جا بنویسید. من یک مخزن به نام «myweblog» ایجاد کردم. البته برای ساخت مخزن جدید چند راه وجود دارد که من ساده‌ترین را گفتم. بعد از اتمام کار، گیت‌هاب صفحه این مخزن را نمایش می‌دهد، آدرس این مخزن هم در ستون سمت راست قابل مشاهده است. برای من آدرس این گونه است:
https://github.com/mehdisadeghi/myweblog.git

توجه کنید که ما فایل‌های وب‌سایت‌مان را مستقیما در شاخه اصلی قرار نمی‌دهیم. گیت‌هاب فقط فایل‌هایی را در وب‌سایت‌ هر پروژه منتشر می‌کند که در یک شاخه بنام gh-pages منتشر شوند. بنابراین ما شاخه‌ای به این نام ایجاد می‌کنیم. این کار به راحتی از رابط گرافیکی وب‌سایت و با کلیک روی نام شاخه جاری امکان‌پذیر است. من این‌جا در ترمینال این کار را انجام می‌دهم. ابتدا یک نسخه از این پروژه را دریافت می‌کنیم:

$ git clone https://github.com/mehdisadeghi/myweblog.git

و شاخه gp-pages را می‌سازیم و همزمان به آن سویچ می‌کنیم (با بکارگیری فلگ -b):

$ cd myweblog
$ git checkout -b gh-pages

حالا اولین فایل وب‌سایتمان را می‌سازیم:

$ echo “Hello World!” > index.html

فایل ساخته شده را به فهرست فایل‌های مخزن اضافه می‌کنیم و تغییرات را ثبت (commit)می‌کنیم:

$ git add index.html
$ git commit -m “First commit”

حالا هم تغییراتمان را در مخزن اصلی روی گیت‌هاب پوش (push) می‌کنیم. توجه داشته باشید که در این مرحله باید اول نام کاربری و بعد کلمه عبور گیت‌هاب خودتان را وقتی که سوال شد وارد کنید تا تغییرات شما توسط گیت‌هاب پذیرفته بشود:

$ git push origin gh-pages

تبریک! همین حالا شما اولین صفحه وب‌سایت‌ خودتان را روی سکوی گیت‌هاب منتشر کردید! باور نمی‌کنید؟ بعد از یکی دو دقیقه به آدرس وب‌سایتتان سر بزنید. در مثال من با مراجعه به آدرس زیر وب‌سایت‌ من (Hello World) قابل مشاهده است:
http://mehdisadeghi.github.io/myweblog

امیدوارم هیجان‌زده شده باشید! خوب است بدانید که هر کاربری در گیت‌هاب می‌تواند یک صفحه خاص نیز با آدرس username.github.io‌ داشته باشد. برای این کار کافی است تغییرات کوچکی در روش عنوان شده، ایجاد کنید. اول این‌که نام پروژه‌ای که در گیت‌هاب می‌سازید باید مطابق فرم username.github.io‌ باشد. مثلا برای من نام این پروژه باید mehdisadeghi.github.io باشد و البته دیگر هم نیازی هم نیست که شاخه gh-pages را بسازید. پس خط مربوط به ساخت این شاخه هم حذف می‌شود. محتویات این مخزن مستقیما در صفحه شما منتشر خواهد شد:

$ git clone https://github.com/mehdisadeghi/mehdisadeghi.github.io.git
$ cd mehdisadeghi.github.io/
$ echo “Hello World!” > index.html
$ git add index.html
$ git commit -m “First commit”
$ git push origin master

دقت کنید که این‌جا شاخه اصلی (master) را پوش می‌کنیم چون شاخه دیگری نساختیم.
نام کاربری و کلمه عبور را وارد کنید و تمام. حالا صفحه شما در آدرس http://username.github.io در دسترس خواهد بود (برای من می‌شود http://mehdisadeghi.github.io).

نحوه به‌روزرسانی‌
این قسمت لذت‌بخش‌ترین جای کار است! تغییرات را روی رایانه‌ خودتان انجام بدهید. ثبت کنید، پوش کنید و تمام. ظرف چند دقیقه وب‌سایت‌ به‌روز خواهد شد. شما می‌تواید فایل‌های رایج وب را به مخزن خودتان اضافه کنید. در این باره در قسمت دوم بیشتر خواهیم گفت.
روشی که طی این مقاله شرح دادم بیشتر کاربران فعلی گیت‌هاب و برنامه‌نویسان را هدف قرار می‌دهد که با گیت‌ احساس راحتی می‌کنند و دوست دارند از آن همه جا استفاده کنند حتی برای وب‌سایت‌شان! برای من این روش خاص‌تر از سیستم‌های مدیریت محتواست و مثل یک سرگرمی و بازی می‌ماند. دست هم در تغییر محتوا باز است و روش انجام کار هم خیلی سرراست است. در قسمت دوم مقاله به موارد زیر خواهیم پرداخت:

  • استفاده از دامنه دلخواه برای نمایش صفحات گیت‌هاب
  • نحوه کار با جِکیل
  • افزودن کامنت به وب‌سایت با کمک Disqus

جِکیل
صفحات‌گیت‌هاب علاوه بر پشتیبانی از فایل‌های HTML عادی، از Jekyll که یک مولّد صفحات ایستا است نیز پیشتبانی می‌کند.
جکیل تمام امکانات لازم برای ساخت وب‌سایت‌ را به صورت آفلاین در اختیار شما می‌گذارد، امکاناتی از قبیل تولید هدر و فوتر برای تمامی صفحات وب‌سایت بدون نیاز به تکرار آن‌ها در صفحات مختلف و نیز پیشتبیانی از چند زبان الگو جهت نوشتن قالب ساخت. جکیل یک پروژه‌ی مستقل از گیت‌هاب است اما وب‌سرور صفحات گیت‌هاب قادر است پروژه‌های جکیل را بفهمد و آن‌ها را به درستی نمایش بدهد.