Mac搭建Hexo部落格及NexT主題配置優化
前言
最近看到陽春麵的部落格，感覺非常漂亮，正好最近也想自己搭個部落格，記錄一下自己的學習經歷和生活感悟，給自己留下點回憶，同時整理一下自己的思路，於是就想仿照著弄一個類似的靜態部落格網站，正好最近有時間，而且內心搭部落格的念頭越來越洶湧，所以，說幹就幹！
主要內容
拉到陽春麵部落格的最下方，發現他的靜態部落格是Hexo驅動，使用的NexT.Mist主題，而且我非常喜歡這個主題，所以我完全就是衝著陽春麵的部落格效果去的，所以這片文章主要介紹：
1. 基於Hexo和github pages搭建靜態部落格
2. Next主題配置及優化
最終目標是實現陽春麵部落格那樣的效果！另外，因為我用的電腦是Mac Pro，所以這篇文章所說的方法都是在mac下才有用的，windows下基本步驟類似，可能只是依賴工具安裝方法不同。最後，我還沒有申請和繫結自己的域名，所以域名註冊和繫結都沒有介紹，我認為，在自己真正開始經營部落格之前，沒有必要花錢註冊域名，所以這部分工作留在部落格小有名氣，有一定流量之後再做！
基礎準備
好，下面正式開始搭建部落格！首先要想使用Hexo和github pages搭建部落格，需要以下環境：
1. Github賬號一枚，並建立一個指定名字的repo
2. Homebrew套件管理器，主要用來安裝git和node.js
3. Git版本管理工具
4. node.js
5. 配置SSH key（可忽略）
6. 安裝Hexo
7. 同步Hexo部落格到github
8. NexT主題配置及優化（如果你喜歡別的主題，請忽略）
這些東西都不熟悉沒關係，下面都會詳細介紹。
註冊Github賬號並建立repo
因為我們的部落格是基於github pages的，也就是部落格內容都託管在github pages，所以需要有一個github賬號，並且建立一個公開庫（repo），用來存放你的部落格。Github賬號大家應該都有了，俗話說，沒有Github 賬號的程式設計師，不是好段子手，身為程式設計師，不加入這個全球最大的技術（搞基）社群怎麼說的過去呢。如果還沒有github賬號，去
申請完賬號，登陸之後，就可以建立repo了，點選New repository，會跳轉到這個介面:
需要注意的地方，我都在圖上做了標註，這些標註裡最需要注意的就是新建立的庫的名字，必須是username.github.io，等你建立庫的時候，把username換成你的使用者名稱就可以，例如我的使用者名稱是madongqiang2201，那庫名就是madongqiang2201.github.io
create repository就可以把庫創建出來。
要想進一步深入瞭解github，可以閱讀這些資料：
安裝Homebrew套件管理器
Homebrew並不是必須的，你也可以通過其他途徑安裝git和node.js，但是，個人認為Homebrew相當nice，而且在mac下管理安裝包特別方便，所以在這裡強行安利一波，Homebrew需要你的mac安裝了Xcode，很多其他mac應用也需要，所以建議先安裝一下，appstore裡就有。裝完Xcode之後，剩下的步驟就特別簡單了，開啟mac terminal終端，輸入以下命令
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
就可以自動完成該工具的安裝，如果這條命令失效了，可能是Homebrew更新了安裝方式，可以去這裡檢視最新安裝命令以及Homebrew的簡要介紹。Homebrew安裝完成之後，安裝git和node.js簡直簡單的不要不要的。
Homebrew一些常用命令可以閱讀以下資料，深度應用請自行檢索：
安裝Git版本管理工具
Git是一個強大的版本管理工具，Github的版本管理就是基於Git的，現在svn基本過時了，使用Git進行版本管理才是王道。安裝完Homebrew之後，安裝Git幾乎零成本，還是在terminal終端，輸入以下命令：
brew install git
然後等一段時間就ok了，Homebrew會自動去幫你完成下載安裝。
Git使用教程，可以參考以下資料：
安裝node.js
Hexo是基於node.js的，所以要讓Hexo執行，node.js環境是必不可少的。使用Homebrew安裝node.js也特別簡單，在terminal終端輸入如下命令：
brew install node
然後等著Homebrew幫你完成下載安裝就可以了，舒爽到爆炸！安裝完node.js就可以使用常見的npm命令了。
配置SSH key
這一步可以忽略，配置SSH key與否，並不影響部落格的搭建和使用，只是配置了之後，更新部落格方便一點，不用每次都輸使用者名稱和密碼。
檢查本機上是否存在SSH key
打卡終端，輸入如下命令：
cd .ssh
ls -la檢查終端輸出的檔案列表中是否已經存在id_rsa.pub 或 id_dsa.pub 檔案，如果檔案已經存在，那麼你可以跳過步驟2，直接進入步驟3.
建立一個SSH key
在終端輸入以下命令：
$ ssh-keygen -t rsa -C "[email protected]"回車，接著會提示你，讓你輸入檔名，直接回車會建立使用預設檔名的檔案（推薦使用預設檔名）；然後會提示你輸入兩次密碼（輸入密碼之後沒有反饋，顯示還是空白，但是你確實已經輸入了），當然密碼也可以不輸，直接回車，如果這裡沒有輸入密碼，以後提交部落格更新的時候就不需要輸入密碼了。
新增SSH key到github
經過第二步，如果你沒有指定檔名（也就是使用的預設檔名），那麼你的.ssh資料夾下，應該有一個id_rsa.pub檔案了，開啟該檔案，複製裡面的文字。然後登陸github，點選右上角頭像右邊的三角圖示，點選Settings，然後在左邊選單欄點選SSH and GPG keys，點選new ssh key，title 隨便填一個，在key 欄填入你複製的內容，點選add ssh key，就可以新增一個ssh key了，如下圖：
驗證SSH key是否配置成功
在終端輸入以下命令：
ssh -T git@github.com如果你建立的key沒有設密碼的話，直接一頓回車，到最後提示你
Hi yourusername! You've successfully authenticated, but GitHub does not provide shell access.說明你的ssh key新增成功了。如果過程中提示你perimission deny相關錯誤，就在命令前加上sudo 然後執行命令的時候輸入你的appleid密碼應該就可以了。sudo用來說明用管理員許可權執行。
以上簡略介紹了怎麼配置SHH key，如果想知道命令裡面引數的含義，或者配置過程不順利的話，可以看這裡的詳細教程。
安裝Hexo
經過以上步驟的鋪墊，終於到了Hexo安裝了，前面我們安裝了node.js,裝完node之後，我們就可以使用npm命令了，而Hexo安裝就是使用npm，在終端輸入以下命令：
npm install -g hexo然後等待一會兒，hexo會自動完成下載安裝。Hexo安裝完成之後，在你喜歡的位置隨意建立一個資料夾，這個資料夾以後就是你存放本地部落格的地方了，通過cd filepath(filepath替換成你建立的資料夾目錄)命令，進入到你建立的資料夾目錄，然後執行以下命令：
hexo init
npm install這樣Hexo會在該資料夾建立本地部落格所需的一切資源。這樣本地部落格就搭建好了，輸入以下命令：
hexo g // 全拼是：hexo generate，可以簡寫成 hexo g
hexo s // 全拼是：hexo server，可以簡寫成 hexo s這樣就開啟了一個本地部落格伺服器，開啟瀏覽器，在位址列輸入localhost:4000，就可以檢視本地部落格了，hexo預設生成了一片hello world部落格。注意，以上hexo開頭的命令，執行目錄必須是你建立的部落格資料夾目錄。
同步Hexo部落格到Github
現在你已經可以在本機檢視你的部落格了，但是要想讓別人通過網路可以檢視你的部落格，還需要一步，那就是將你的部落格釋出到github倉庫。在terminal終端，將當前目錄切換到你的本地部落格目錄，執行以下命令：
npm install hexo-deployer-git --save安裝完成之後，開啟本地部落格目錄的_config.yml檔案，編輯其中的deploy節點：
deploy:
type: git
repo: [email protected]:yourusername/youusername.github.io.git
branch: master將上面yourusername替換成你的github使用者名稱即可，你也可以去你開始的時候建立的名為yourusername.github.io的倉庫去直接複製完整的地址，如下圖：
當前複製出來的值，就是通過SSH方式clone的地址，配置完成後，以後提交部落格更新不用輸使用者名稱和密碼（如果你ssh key沒有設定密碼的話）；點選上圖右上角Use HTTPS，複製出來的clone地址也可以配置到repo，但是這樣，提交更新的時候，就需要輸入使用者名稱和密碼了。
儲存配置之後，在本地部落格目錄執行以下命令：
hexo clean // clean本地專案，防止快取
hexo g // 根據你編輯的md格式的部落格，生成靜態網頁
hexo d // 將本地部落格釋出到github然後，在瀏覽器位址列輸入yourusername.github.io就可以訪問你的部落格了，別人也可以通過這個地址訪問你的部落格。
如果想了解Hexo常用命令可以點選這裡，Hexo常用命令沒幾個，常用的有建立新部落格、clean、生成靜態檔案、釋出等，上述官方文件有詳細介紹
NexT主題配置及優化
NexT主題是一套簡約的主題，設定完成之後，就像我的部落格現在的樣子，NexT主題的詳細配置請看這裡，這個是NexT主題作者維護的配置文件，作者是國人，所以文件是中文的，而且寫的非常詳細，對照文件，所有功能都能輕鬆實現。等你配置完成後，你的部落格將擁有評論系統，訪問次數統計，站內搜尋，程式碼高亮，百度統計，社交分享（分享到微博，微信，qq等）等等強大的功能。官方文件很詳細，我就不再贅述了。
其他遺漏的點
1.如何刪除一篇博文
當然，我們辛辛苦苦寫了博文，一般是不會刪除的，最多修改一下，但是我們搭建的過程中或者剛搭建好個人部落格站點，可能一激動就發了好多測試博文，如果想刪除這類文章，在Finder中，找到本地部落格所在目錄，找到/source/_posts資料夾，裡面放了所有我們寫的部落格，想刪除哪篇，直接在這裡刪除，然後再重新發布到github，這篇博文就不見了
2.fork me on github
如果你訪問我的個人部落格，你會發現右上角有一個傾斜的fork me on github 圖示，想要整合這個圖示，只需要去這裡挑選你喜歡的樣式，把樣式程式碼複製過來，然後開啟你本地部落格目錄下的themes/next/layout/layout.swig檔案，然後把你複製過來的樣式程式碼貼上到如下位置：
<body itemscope itemtype="http://schema.org/WebPage"
// ...
<a href="https://github.com/madongqiang2201"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://camo.githubusercontent.com/a6677b08c955af8400f44c6298f40e7d19cc5b2d/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f677261795f3664366436642e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png"></a>
<header id="header" class="header" itemscope itemtype="http://schema.org/WPHeader">
<div class="header-inner"> {%- include '_partials/header.swig' %} </div>
</header>
// ...其中哪個超連結就是複製的樣式程式碼，貼上位置在body內header標籤之上。
3.給博文新增tag和分類
使用如下命令：
hexo new "blog title"建立的新博文檔案，開啟之後頂部會有一段自動生成的文字，在其中加入tag和category標籤即可指定tag和分類。
---
title: blog title
date: 2016-07-20 10:59:31
tag: hexo
category: hexo
---4.手動實現某條博文置頂
Next主題沒有博文置頂相關設定（或許這個功能Hexo應該提供，但我分不清），但是我發現釋出的博文是根據釋出日期倒序排序的，即：越早釋出的，排的越靠後！而釋出日期，我們可以通過博文的頭部date欄位指定：
---
title: blog title
date: 2016-07-20 10:59:31 // 指定釋出日期
tag: hexo
category: hexo
---所以我們可以給想要置頂的博文，指定一個將來的日期，這樣就可以讓這篇博文一直排在別的博文前面，達到手工置頂的目的！但是要注意：對於已經發布的博文，釋出日期和檔名稱（不是title欄位的值，而是md檔名）是該文章訪問url的組成部分，也就意味著，已經發布的文章如果改了釋出日期，針對這篇文章的連結就都不能用了，而且瀏覽統計等資訊都會受到影響，所以手工置頂應該慎重使用！
總結
Hexo部落格至此搭建完畢，並且應用了簡約美麗的NexT.Mist主題，但是仍有一些不足之處，例如沒有通過正常方式博文置頂功能；該主題的主頁過於簡單，沒有邊欄，導致主頁展示的有效資訊減少，不利於訪客瀏覽，也不利於推廣自己的其它渠道，這可能就是簡約付出的代價，主題作者以後可能也會改進吧！如果不喜歡這個主題，可以參看一下開源實驗室或者stormzhang的個人部落格主題，我感覺這兩個都不錯。但是最重要的還是部落格要有內容，沒有內容，再好的個人站點也沒有意義！所以樣式先這樣吧，這段時間先寫技術文章，如果以後自己開始認真經營部落格了，再繫結域名和優化樣式。最後，如果大家有什麼問題，歡迎留言討論！