IT工程師數位筆記本

 github提供的page，hexo提供的靜態博客文檔，這樣可以搭建一個自己的一個博客網站。

使用github pages服務搭建博客的好處有：

1. 全是靜態文件，訪問速度快；
2. 免費方便，不用花一分錢就可以搭建一個自由的個人博客，不需要服務器不需要后臺；
3. 可以隨意綁定自己的域名，不仔細看的話根本看不出來你的網站是基于github的；
4. 數據絕對安全，基于github的版本管理，想恢復到哪個歷史版本都行；
5. 博客內容可以輕松打包、轉移、發布到其它平臺；

一、github相關設置

1、在github上創建一個項目

注意：項目名稱必須為自己   github的用戶名.github.io

 2、代碼庫的設置

開啟gh-pages功能，點擊界面右側的Settings，你將會打開這個庫的setting頁面，向下拖動，直到看見GitHub Pages。

之前是需要：點擊Automatic page generator，Github將會自動替你創建出一個gh-pages的頁面。 如果你的配置沒有問題，那么大約15分鐘之后，yourname.github.io這個網址就可以正常訪問了~ 如果yourname.github.io已經可以正常訪問了，那么Github一側的配置已經全部結束了。

現在不需要設置page generator。就可以訪問https://saucxs.github.io/

二、安裝hexo

1、全局安裝hexo-cli指令

npm install hexo-cli -g

查看hexo版本

hexo -v

2、初始化hexo

hexo init

hexo會自動下載一些文件到這個目錄，包括node_modules，目錄結構如下圖：

3、開始體驗hexo

hexo g

生成靜態文件到public文件夾，沒有public文件夾就會自動創建，如果有了就會覆蓋public內容。

public文件夾的內容是要提交到github上的。

4、開啟本地服務

hexo s

hexo s是開啟本地預覽服務，打開瀏覽器訪問 http://localhost:4000 即可看到內容，很多人會碰到瀏覽器一直在轉圈但是就是加載不出來的問題，一般情況下是因為端口占用的緣故，因為4000這個端口太常見了，解決端口沖突問題。

 三、如何將hexo與github page聯系起來

 分為3步：

1、配置SSH key

2、設置Git的user name和email

3、配置deployment

1、配置SSH key

如果你之前已經配置好git個人信息，請跳過這一個 步驟，直接來到

為什么要配置這個呢？因為你提交代碼肯定要擁有你的github權限才可以，但是直接使用用戶名和密碼太不安全了，所以我們使用ssh key來解決本地和服務器的連接問題。

$ cd ~/. ssh #檢查本機已存在的ssh密鑰

如果提示：No such file or directory 說明你是第一次使用git。

ssh-keygen -t rsa -C "郵箱"

然后連續3次回車，最終會生成一個文件在用戶目錄下，

 打開用戶目錄，找到.ssh\id_rsa.pub文件，記事本打開并復制里面的內容，打開你的github主頁，進入個人設置 -> SSH and GPG keys -> New SSH key：

剛復制的內容粘貼到key那里，title隨便填，保存。 

測試一下是否成功

$ ssh -T git@github.com # 注意郵箱地址不用改

看到這個信息說明SSH已配置成功！

2、設置Git的user name和email

$ git config --global user.name "liuxianan"// 你的github用戶名，非昵稱
$ git config --global user.email  "xxx@163.com"// 填寫你的github注冊郵箱

設置這個是為了便與之后上傳到github的page上。

3、設置deployment

配置_config.yml中有關deploy的部分：

正確寫法：

deploy:
  type: git
  repository: git@github.com:saucxs/saucxs.github.io.git
  branch: master

錯誤寫法：

deploy:
  type: github
  repository: https://github.com/saucxs/saucxs.github.io.git
  branch: master

后面一種寫法是hexo2.x的寫法，現在已經不行了，無論是哪種寫法，此時直接執行hexo d的話一般會報如下錯誤：

Deployer not found: github 或者 Deployer not found: git

需要安裝一個插件

npm install hexo-deployer-git --save

再次輸入hexo d，就ok了。

自己的github的page，顯示如下

同時，你的github上的項目，代碼已經更新。

四、保留CNAME、README.md等文件

提交之后網頁上一看，發現以前其它代碼都沒了，此時不要慌，一些非md文件可以把他們放到source文件夾下，這里的所有文件都會原樣復制（除了md文件）到public目錄。

由于hexo默認會把所有md文件都轉換成html，包括README.md，所有需要每次生成之后、上傳之前，手動將README.md復制到public目錄，并刪除README.html。

五、修改hexo的主題

在 Hexo 中有兩份主要的配置文件，其名稱都是 _config.yml。 其中，一份位于站點根目錄下，主要包含 Hexo 本身的配置；另一份位于主題目錄下，這份配置由主題作者提供，主要用于配置主題相關的選項。

為了描述方便，在以下說明中，將前者稱為 站點配置文件， 后者稱為 主題配置文件。

PS：需要特別注意的地方是，冒號后面必須有一個空格，否則可能會出問題。

舉個栗子：

1. 安裝 NexT

載主題

如果你熟悉 Git， 建議你使用 克隆最新版本 的方式，之后的更新可以通過 git pull 來快速更新， 而不用再次下載壓縮包替換。

在終端窗口下，定位到 Hexo 站點目錄下。使用 Git checkout 代碼：

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

2. 啟用主題

與所有 Hexo 主題啟用的模式一樣。 當 克隆/下載 完成后，打開 站點配置文件， 找到 theme 字段，并將其值更改為 next。

啟用 NexT 主題

theme: next

到此，NexT 主題安裝完成。下一步我們將驗證主題是否正確啟用。在切換主題之后、驗證之前， 我們最好使用 hexo clean 來清除 Hexo 的緩存。

hexo clean

hexo s -g      //生成靜態文件，啟動本地服務

六、 寫博客

定位到我們的hexo根目錄，執行命令：

hexo new ‘HelloEveryone’

我們只需要打開這個文件就可以開始寫博客了，默認生成如下內容

 當然你也可以直接自己新建md文件，用這個命令的好處是幫我們自動生成了時間。

默認情況下，生成的博文目錄會顯示全部的文章內容，如何設置文章摘要的長度呢？

答案是在合適的位置加上<!--more-->即可，例如：

七、訪問我的hexo+github博客

可以訪問我的git博客來查看效果： https://saucxs.github.io/