GithubPages教程 在GithubPages上搭建個人主頁
版權聲明：轉載請註明本文轉自嚴振杰的博客: http://blog.csdn.net/yanzhenjie1003
對我的博客感情趣的同學可以加我博客左側的羣來一起交流學習，共同進步。本篇博客公有三個目的，同樣也會舉三個實際操作的例子來和大家一起玩Github pages。
第一個目的，有的開發者平常會做自己的網站，大部分是還是買的空間吧，有人買的阿里雲、新浪SEA或者linode、aws加nginx，今天看完這篇博客，你就可以用Github Pages免費搭建自己的主頁了。
第二個目的，如何在Github爲自己的帳號（個人或者組織）搭建個人主頁，比如我的Github地址是：https://github.com/yanzhenjie，我爲自己的帳號搭建的主頁就是https://yanzhenjie.github.io。
第三個目的，如何爲自己在Github上的開源項目搭建項目主頁，比如我的開源項目NoHttp的Github地址是：https://github.com/yanzhenjie/NoHttp，我爲NoHttp搭建的項目主頁就是https://yanzhenjie.github.io/NoHttp。
（由於篇幅太長，如何爲自己在Github上的開源項目搭建項目主頁傳送門。）
我的個人主頁就放在Github Pages並且綁定了我的域名：yanzhenjie.com，非常好記：嚴振杰.com，是不是一下就記住了，如果沒有請再記一次，記不住就不要往下看了，哈哈哈開個玩笑啦。
Github Pages是什麼
Github Pages主頁：https://pages.github.com，其實官網這裏已經有教程了，怕好多同學看不懂，所以來一篇博客。
Github Pages是什麼，來自官網的解釋：https://help.github.com/articles/what-are-github-pages，不想打開官網的人看圖片：
不要誇我，我就是這麼貼心，提大家翻譯好了中文版：
按我的理解，Github Pages是Github免費提供給開發者的一款託管個人網站的產品，這絕對是個好東西啊。目前來看只能託管靜態內容，但是這已經足夠我們用了，如果咱發揮的好，猶如鯉魚躍龍門啊。
Github Pages怎麼玩
我剛開始做這事之前也不知道怎麼辦，我有個習慣就是對於不明白的事情習慣去官網看幫助，於是乎我看了Github Helper：https://help.github.com/，我看到這裏的時候心中大喜，其實這就是教程，不夠是英文版的，喜歡的同學也可以直接去看：
我是一步步看過來的，爲了不浪費大家時間，我們只要看這條就行：User, Organization, and Project Pages。這裏我把最重要的信息貼出來：
看到這裏我就基本猜到了要怎麼做了，後面的就不一一帶各位看了，我直接說原理。Github的個人主頁是可以綁定一個域名的，後面帶各位看官一步步實現。在沒有綁定自己的域名之前，這裏的地址都是有規律的，比如我的帳號是yanzhenjie，那麼我的主頁地址就是yanzhenjie.github.io，比如我的帳號是xxoo，那麼我的主頁地址就是xxoo.github.io；比如我的項目叫NoHttp，那麼項目對應的地址就是yanzhenjie.github.io/NoHttp。如果你是組織帳號也一樣。
用Github Pages爲自己的帳號搭建個人主頁
做這件事首先你得有一個Github的帳號，沒有的人去Github申請一個吧，作爲一個程序員我擦。如果你已經有一個Github的帳號了那麼恭喜你繼續往下看。
新建個人主頁的倉庫
打開Github首頁，登錄後新建一個倉庫，這裏再次提醒要注意倉庫的名稱，比如我的帳號是yanzhenjie，那麼倉庫名稱應該是：yanzhenjie.github.io。
按照如步驟創建倉庫：
添加個人主頁倉庫內容
倉庫創建完成後，就要添加網站內容到倉庫咯。提交文件到github倉庫，這裏簡單的介紹下用Git怎麼提交內容，首先你電腦必須安裝了Git並配置好了環境（看了還是不會的人去Google下）。
如果熟練使用Git命令、TortoiseGit或者SourceTree的人請不要見怪，因爲畢竟有人不會。
一、clone倉庫到本地
注意你clone的時候要把連接換成你的喔。
git clone https://github.com/yanzhenjie/NoHttp.git二、添加內容到本地倉庫
剛纔clone下來的倉庫就是一個本地倉庫啦，若是你熟悉html的話隨便弄個html就好，我們知道網站默認的首頁都是index.html，所以我們在本地倉庫建立一個index.html，目錄一定要在.git所在的目錄，也就是我們項目的root目錄：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
<title>嚴振杰</title>
</head>
<body>
我叫嚴振杰，軟件工程師，英文名Yolanda，尤蘭達，他們叫我達哥。
</body>
</html>文件都建好內容填好保存，一個簡單的首頁就完成了，假設我們的網站內容都建好了。
三、commit push內容到我們剛纔新建的倉庫
在命令模式下進入到剛纔的倉庫文件夾下，用下面的命令提交，先別急着複製哦，看下下面的解釋：
git add .
git commit -m "初始化個人主頁倉庫"
git push
Username for 'https://github.com': yanzhenjie
Password for 'https://[email protected]': 命令要一行一行執行喔，第一行命令是添加所有文件到git，第二行是commit提交的內容到本地倉庫，第三行是push本次倉庫的內容到服務器，第四行是執行了第三行自動出來的，輸入帳號確定，第四行是輸入第三行後出來的，出入密碼確定就完成了提交。
恭喜你，個人網站搭好了
如果你的提交都完成了沒有問題了，那麼這個時候恭喜，你的個人主頁已經搭建好了，不信你可以在瀏覽器訪問下，比如我的：https://yanzhenjie.github.io，根據剛纔說的規則輸入你的地址看看喔。
Github Pages個人主頁綁定個人域名
我們剛纔的域名可能不好記，比我的：yanzhenjie.github.io=嚴振杰.github.io，但是還是不如嚴振杰.com。so我們綁定一個好記的域名，所以我又去找Github Helper，又被我找到了哈哈哈：
打開看了看，果然找到了答案，我還是貼一個最重要的圖：
這裏再把上圖中的流程敘述下，我們需要一個域名，沒有的人去萬網申請一個，然後需在剛纔的倉庫root中添加一個CNAME的文件，文件內容是我們的域名，在Github上看到推薦我們使用www的二級域名。
申請域名
現在去阿里雲·萬網申請到域名，我的其中其中兩個域名如下：
解析域名到github pages的ip上
域名申請好之後就是解析域名到github pages的個人主頁的ip，我們ping一下自己的主頁的ip，在命令行：ping yanzhenjie.github.io，你的地址和我肯定不一樣也許就是ping xxoo.github.io哈哈哈：
爲我們的域名添加解析，記錄類型都是A記錄，記錄值全部對應剛纔ping出來的ip：
這裏的www是一個二級域名，@或者不填是一級域名，兩條記錄的記錄值都是剛纔ping出來的ip。這樣就能把我們的域名和github上的主頁關聯起來了。不要着急喔，現在在瀏覽器輸入域名你會發現訪問不到，繼續往下看。
添加CNAME文件到github倉庫
在我們剛纔創建index.html的地方創建一個名爲CNAME的文件，裏邊的內容填你的域名，例如我的是’www.yanzhenjie.com’，這樣就能做到訪問yanzhenjie.com和www.yanzhenjie.com都redirect到www.yanzhenjie.com這個二級域名了，上文中說過這種方式是Github推薦的。
CANME文件的內容填好按照剛纔提交index.html的方法把CNAME提交到Github，這個時候我們的域名綁定也就完成啦。可以在瀏覽器輸入你的個性域名看看是不是OK啦。比如我的嚴振杰.com：www.yanzhenjie.com：
版權聲明：轉載請註明本文轉自嚴振杰的博客: http://blog.csdn.net/yanzhenjie1003
