Hexo+github pages搭建個人獨立網站，綁定域名全教程

寫日誌可以記錄我們的學習、有趣的經歷等等，作爲一個程序員，寫博客更是顯得尤爲重要，這不僅可以記錄我們的技術學習過程，還能讓我們在寫作的過程中梳理自己的知識，如果能夠與網友交流，那更是有利於雙方的技術成長。

1 爲什麼要選擇Hexo？

以前我們經常在一些知名的博客平臺上面寫博客，如CSDN，博客園，51CTO等等。但是這些平臺功能都大同小異，但是有些專業化了，大部分都是寫技術博客，如果你想在上面分享個生活上有趣的事或者寫寫文學文章之類的，就顯得有點不太合適了。簡書其實也是個不錯的平臺，但是太偏向文學了。

因此我想搭建一個屬於自己的獨立網站，可以在上面集中發佈和管理自己的日誌和其他一些東西，另一方面也可以在後期進行個性化定製。

個人搭建網站基本上有三個選擇：

自己動手前端後端一步一步開發。
使用成熟的wordpress平臺。
託管在其他平臺，比如GitHub。

如果你是一個大學在讀的學生，我覺得你有時間的話可以選擇第一個，就是前端後臺一起開發，在這個過程中可以學習到很多東西。博主之前就使用 springboot+thymeleaf+bootstrap+mysql 開發過一個個人網站，這個過程還是非常不錯的，可以對整個涉及到的技術進行了解學習，增加企業級開發的經驗。

但是1、2都需要花一筆錢去租用服務器，也是有點小貴的。因此可以考慮現在比較成熟的Hexo，它是一個快速、簡單和強大的博客框架。你可以用Markdown編寫文章，Hexo可以在幾秒鐘內生成具有漂亮主題的靜態文件。然後託管在GitHub上面即可完成免費博客啦。

Hexo官網

2 準備工作（Windows 10系統）

2.1 安裝nodejs

因爲Hexo需要nodejs環境，因此需要先下載安裝Nodejs。點擊NodeJs官網，下載最新版本。

下載好一直next，選擇一個文件夾位置在一直next即可完成，這個步驟很簡單，就不放圖了。

2.2 安裝git

點擊git官網，下載安裝包。

點擊next，選擇文件夾位置，然後一直next到底就行了，選擇默認配置就好，默認配置會將環境變量配置好的，不需要搞得花裏胡哨的。安裝好後鼠標右擊應該有下圖這兩個選項了，出現就代表安裝成功了。

3 使用Hexo

3.1 安裝Hexo

上面環境搭建好之後，在桌面點擊鼠標右鍵，點擊 “Git Bash Here” ，輸入以下兩條命令。

$ npm install -g hexo-cli

提示：輸入的時候不要輸入 $ 了，因爲命令行本來就已經有了。下載需要幾分鐘，請耐心等待一下。

可以在複製之後在git窗選擇 Shift+Insert 粘貼。有一些警告WARN是不影響使用的，放心。

3.2 初始化Hexo

安裝好Hexo之後，新建一個文件夾，如 E:\HEXO ，然後在該文件夾內鼠標右擊，選擇 “Git Bash Here” ，輸入以下命令。

$ hexo init

稍等片刻即可完成，如圖：

文件結構如圖所示：

scaffolds是模版文件夾，當你新建文章時，Hexo 會根據 scaffold 來建立文件。

source文件夾是存放用戶資源的地方。

themes是主題文件夾，Hexo 會根據主題來生成靜態頁面，待會我們會更換成比較流行的nexT主題。

然後再輸入命令行進行本地調試，即可看到初始效果啦~

$ hexo s --debug

訪問http://localhost:4000/即可看到效果：

4 更換主題爲NexT

上面雖然本地可以調試成功了，但是默認的主題實在不是特別好看。你可以選擇去官網選擇自己喜歡的主題，官網主題鏈接https://hexo.io/themes/

本篇教程選擇的是當前流行的NexT主題，這個主題是我感覺用過的最好的一個了。

4.1 下載NexT主題

進入剛剛你創建的文件夾的themes裏，比如我的 E:\HEXO\themes ，鼠標右擊選擇“Git Bash Here”輸入以下兩條命令中的一個：（這兩個是一樣的，只是有同學反應第一條命令不行，第二條就可以。）

$ git clone [email protected]:iissnan/hexo-theme-next.git

$ git clone https://github.com/iissnan/hexo-theme-next

此時 themes 文件夾便多了一個next主題的文件夾。

4.2 修改配置

打開 E:\HEXO （你的hexo根目錄）下的 _config.yml 配置文件

找到下面這段代碼

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: landscape

將langscape替換成hexo-theme-next

theme: hexo-theme-next

重新在項目根目錄下進行本地部署調試

$ hexo s --debug

即可看到效果

5 部署到github

5.1 註冊GitHub

如果你還沒有GitHub賬戶的話，去GitHub官網免費註冊一個就好了。
點擊sign up

儘量取個好聽的名字

5.2 新建倉庫

新建的倉庫名必須要是 yourusername.github.io ，比如我的就是huangjianxian.github.io ，否則等下不能綁定GitHub pages 訪問。

5.3 配置SSH密鑰

爲了使本地可以跟遠程的github建立聯繫，需要在本地配置SSH密鑰，這樣我們就可以在本地直接提交代碼到GitHub上。
如果你是第一次配置SSH，則配置一下git的username 和 email

 $ git config --global user.name "你要設置的名字"
 $ git config --global user.email "你要設置的郵箱"

之後生成SSH密鑰：

$ ssh-keygen -t rsa -C "你剛剛設置的郵箱"

如果不需要設置密碼的話，連續三個回車就好了。在這之後會得到兩個文件： id_rsa 和 id_rsa.pub
找到id_rsa.pub文件，用記事本打開，複製其內容。路徑： C:\Users\J（你的用戶名）\.ssh

5.4 在GitHub上添加SSH密鑰

登錄GitHub，在Settings裏面選擇 SSH and GPG keys ，然後點擊 New SSH Key

完成之後測試一下，在git bash輸入：

$ ssh -T [email protected]

如果看到了你的用戶名，則表示配置成功了。

5.5 初始化GitHub pages

打開GitHub上面的倉庫，點擊settings

拉到下面，在GitHub Pages那裏選擇一個主題，確定之後即可通過域名來訪問啦~比如我的https://huangjianxian.github.io

5.6 將本地Hexo文件部署到GitHub上

登錄GitHub，打開之前新建好的倉庫 username.github.io ，clone，選擇SSH類型

打開本地站點配置文件，如E:\HEXO （你的hexo根目錄）下的 _config.yml 配置文件。

這裏整個項目有兩個_config.yml，文件。

一個是位於你的hexo根目錄下面的，叫做站點配置文件。

另一個是位於你的主題文件夾目錄下面的，叫做主題配置文件。

這裏打開站點配置文件，找到deploy，比如我的是：

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: [email protected]:huangjianxian/huangjianxian.github.io.git
  branch: master

將repo替換成你的GitHub倉庫的SSH鏈接即可。

在你的項目根目錄下使用git bash，輸入命令部署：

$ hexo d -g

如果有同學是出現這個報錯：

ERROR Deployer not found:git

則在git bash輸入以下命令：

$ npm install hexo-deployer-git --save

再重新hexo d -g部署一下應該就可以了，如果還不行，可能是node.js版本太低之類的（之前就有人踩過這個坑）

稍等片刻之後，輸入你的倉庫主頁地址訪問看看~比如我的是 https://huangjianxian.github.io

6 綁定自己的域名

有朋友可能覺得上面這種域名太難記了，而且不好看。這時候你可以通過自己購買一個域名，然後綁定到GitHub pages上。

去阿里雲購買一個域名

查詢，選好之後加入清單付款即可。

買好之後去域名控制檯，選擇解析

如下圖所示，記錄值改爲你的 username.github.io ，然後確定。

然後在項目文件夾下面的source下面，比如我的 E:\HEXO\source ，新建一個文件 CNAME（注意是文件，不是文件夾）然後用記事本打開，填寫你的域名。比如我的，hjxlog.com

再使用git bash部署一次

$ hexo d -g

這時候應該就可以使用自己的域名訪問項目了（如果還不行可能是DNS解析比較慢，稍等幾分鐘）。

7 總結

Hexo+github pages 是我認爲個人搭博客比較好的平臺了，不需要花費很多錢去維護服務器。只需要搭建好之後安心寫博客就行了。

這還是我第一次寫這麼長的博客，寫完長舒了一口氣，寫了好幾個鐘頭，比我想象中的要久。不過還是堅持了下來，希望以後也經常這樣！努力！奮鬥！寫作不易，大家轉載的話請註明出處，謝謝~
如果大家在這個搭建過程中有什麼問題，歡迎評論~

原文發佈於我本人另一個CSDN賬號，現在那個已經不用了，只用這個，並非抄襲。