1. 程式人生 > >Hexo+Coding部落格的安裝和使用

Hexo+Coding部落格的安裝和使用

之前一直在CSDN上面寫部落格,思慮了很久,終於還是忍不住想自己搭建一個部落格。想過使用 wordpress,需要找一個免費的主機確實又是個麻煩事。所以靜態部落格會是個好的選擇。

自己瞭解到的靜態部落格有 jekyll 和 octopress、hexo,jekyll 和 octopress 是基於 ruby 開發的,說實話又要來學一門新語言,我是不太願意的。hexo 是基於 nodejs 的,而 nodejs 又號稱是前端工程師的歸宿。加之傳聞 hexo 的部落格生成速度比 jekyll 快了一個數量級。So,毫無疑問就是 hexo 了。

一、安裝 nodejs
既然是基於 nodejs 的,那第一步毫無疑問就是先安裝 nodejs 了。來到 nodejs 的官網

https://nodejs.org/ 下載安裝,搞定。

二、安裝 git
為什麼要安裝 git 呢?客觀的原因也沒有深究。且來說說主觀原因吧。
1. git-bash 提供大部分的 linux 命令,差不多就是你在 windows 下通過 git-bash 就能享受 linux 命令的快感了。
2. git 本身是一個檔案版本管理器,有聽過 github 可能會比較清楚。總之,作為一個程式設計師, Just learn it。
3. Github 提供一個 Pages 服務,可以讓使用者免費掛載靜態程式碼在上面執行,這對於前端工程師來說是個莫大的幸運了。不用管理麻煩的伺服器,又可以享受伺服器部署的待遇。但是很不巧的,國內的

Coding 服務商也有 Pages 服務。所以平時傳輸的速度那是槓槓的。

三、安裝 hexo
終於要進入正題了。
首先開啟 git-bash,進入到一個合適的存放 hexo 部落格的目錄,直接執行

npm install -g hexo-cli

至此 hexo 就安裝好了,就是這麼簡單了。但是彆著急,這只是個 hexo 的程式,部落格還沒開始搭建呢。

四、搭建部落格
安裝完 hexo 之後,還要執行下面三條命令

hexo init <folder>
cd <folder>
npm install

這樣就把預設主題的 hexo 部落格安裝好了,這時候再執行

hexo server // 或者 hexo s

就能夠建立起一個本地的伺服器,埠是4000,開啟瀏覽器 http://localhost:4000 就能訪問屬於你自己的部落格了。

五、切換主題
hexo 官方提供了大量的優秀主題可以更換,當然也可以選擇自己去寫一個主題出來。
我在官網看到一個 Next 主題,甚是喜歡,毫不猶豫就把主題給換了。
1. 主題程式碼拷貝
主題的拷貝也是直接使用 git 即可,首先進入到你部落格的根目錄,再開啟 git-bash 執行

git clone https://github.com/iissnan/hexo-theme-next themes/next
  1. 啟用主題
    在部落格根目錄下找到 _config.yml 檔案,找到裡面的 theme,改為
theme: next

這時再執行一次 hexo s ,看看主題有沒有生效吧。

六、釋出部落格到 coding
1. 配置hexo deploy
hexo 提供了一個部署命令 hexo deploy,首先需要安裝一下 hexo-deployer-git外掛

npm install hexo-deployer-git --save

然後配置一下_config.yml 檔案:

deploy:
  type: git
  repo: <repository url>
  branch: [branch]
  message: [message]
引數 描述
repo 庫(Repository)地址
branch 分支名稱。如果您使用的是 GitHub 或 GitCafe 的話,程式會嘗試自動檢測。 coding 建立我們填的是 coding-pages
message 自定義提交資訊 (預設為 Site updated: {{ now('YYYY-MM-DD HH:mm:ss') }})

2. 預覽效果
在 coding 上建立一個私人倉庫,找到程式碼的 coding 地址,填好上面的配置,然後直接執行
hexo deploy
不出意外的話會讓你填寫 coding 的使用者名稱和密碼完成上傳操作。如果你有配置 ssh 方式的話就更加方便了。
這個時候再到 coding 對應的專案裡面開啟 pages 服務,根據 coding 建議,因為不是 jekyll 專案,所以需要再新建一個.nojekyll 檔案(空檔案就行,其實不建立也行),等上一會就能夠訪問自己的部落格了。