如何在Koding雲端開發平臺建置Hexo環境

緣起

日前幫朋友安裝設定 Hexo 環境時發覺，Node.js 對通常使用者來講實在太遙遠， 爲了執行 Hexo，需另安裝 Xcode(Mac) 與許多相關的開發環境，那不是通常使用者會用上的東西。 在那以後就不斷注意能簡化 Hexo 入門門檻的設定流程。

看到 珠聯璧合：利用 Koding 爲靜態博客搭建在線編輯環境，以爲是個不錯的解決方案。

利用 Koding 雲端開發環境，使用者無須在本機端安裝 Node.js 執行環境。 雖仍需花時間設定 Koding 上的環境，但可跨電腦、平臺編寫與發佈部落格， 外出旅行時，一臺平板電腦就能夠編寫與發佈部落格文章了！

Koding 簡介

我知道你和 PCMan 同樣只想看範例，如下簡介能夠略過

Koding 是個雲端開發與社羣平臺，提供 Linux 虛擬主機環境與完整的 WebUI， 能夠透過瀏覽器在 Koding 上進行主機配置、架設網站與系統開發測試等。

• koding 提供完整 Linux 做業系統 (Ubuntu 13.04, Raring Ringtail)
• 提供 sudo 以安裝系統軟體與操做
• 預設安裝好 npm
• 預設安裝好 git
• 預設架好 apache

koding.com這是一個免費的雲端開發平臺，也至關於透過瀏覽器去操做一個VM > (virtual > machine)，能夠徹底依照本身的須要去部屬開發環境、架設網站等等，這主機也能夠執行JavaScript、PHP、Perl、Python、Ruby等語言，寫完能夠在線上預覽、執行。不過要注意的是有基本容量限制1G。

他也有社交的功能，就像通常社交網站通常，能夠發文分享、討論交流，也有爲數很多不一樣類型的Group，他把社交化功能與Web > IDE結合得還不錯。遇到一些開發相關問題，也還能夠透過線上的社羣直接發問。

[筆記] 13/12/02 Node.js分享講座 之 Koding « > 菜鳥的升級日記goo.gl/zPL7nV/

本篇介紹如何設定 Koding 上的環境。

預備工做

• Github 賬號（點此申請 Github 賬號）
• Koding 賬號（點此申請 Koding 賬號）

申請方式和通常網站大同小異，~~我很懶~~這兒就跳過不介紹如何申請了。賬號申請後請記得收信驗證信箱位址。

安裝 Hexo 執行環境

註冊後連上 Koding 網站，點選左上方功能列的 "Terminal"，可看到畫面以下：

因 Koding 預設已安裝好 Node.js / npm 環境，直接輸入下列命令便可安裝 Hexo 系統。

sudo npm install -g hexo

輸入後會看到 npm 開始安裝 hexo 以下：

npm http GET https://registry.npmjs.org/hexo
npm http 304 https://registry.npmjs.org/hexo
npm http GET https://registry.npmjs.org/async/0.2.9
npm http GET https://registry.npmjs.org/express/3.4.7
...
...
...
hexo@2.4.5 /usr/lib/node_modules/hexo
├── graceful-fs@2.0.1
├── sprintf-js@0.0.7
├── colors@0.6.2
├── marked@0.3.0
├── async@0.2.9
├── chokidar@0.8.1
├── ejs@0.8.5
├── highlight.js@8.0.0
├── optimist@0.6.0 (wordwrap@0.0.2, minimist@0.0.5)
├── lodash@2.4.1
├── moment@2.5.0
├── stylus@0.42.0 (css-parse@1.7.0, debug@0.7.4, mkdirp@0.3.5, glob@3.2.8, sax@0.5.8)
├── warehouse@0.1.12 (lodash@2.2.1)
├── yamljs@0.1.4 (glob@3.1.21, argparse@0.1.15)
├── nib@1.0.2 (stylus@0.37.0)
├── swig@1.2.2 (uglify-js@2.4.10)
└── express@3.4.7 (methods@0.1.0, merge-descriptors@0.0.1, range-parser@0.0.4, cookie-signature@1.0.1, fresh@0.2.0, debug@0.7.4, buffer-crc32@0.2.1, cookie@0.1.0, mkdirp@0.3.5, commander@1.3.2, send@0.1.4, connect@2.12.0)

跑完後能夠執行 hexo 確認是否已正確安裝

$ hexo

若 hexo 安裝正確，會出現簡單說明訊息以下：

Usage: hexo <command>

Commands:
  help      Get help on a command
  init      Create a new Hexo folder
  migrate   Migrate your site from other system to Hexo
  version   Display version information

Global Options:
  --config   Specify config file instead of using _config.yml
  --debug    Display all verbose messages in the terminal
  --safe     Disable all plugins and scripts
  --silent   Hide output on console

For more help, you can use `hexo help [command]` for the detailed information
or you can check the docs: http://zespia.tw/hexo/docs/

設定 Hexo 部落格專案資料夾

安裝完 hexo 後須要創建 hexo 部落格專案資料夾，裏面存放部落格文章、佈景主題、Plugins...等。

Init hexo blog folder

透過下列命令可在 Koding VM 的 {$HOME}/blog 創建 hexo 專案資料夾

$ cd
$ mkdir blog
$ cd blog
$ hexo init

輸入後可看到 Hexo 初始化專案資料夾以下：

[info] Creating file: source/_posts/hello-world.md
[info] Creating file: package.json
[info] Creating file: .gitignore
[info] Copying file: _config.yml
[info] Copying file: scaffolds/draft.md
[info] Copying file: scaffolds/page.md
[info] Copying file: scaffolds/photo.md
[info] Copying file: scaffolds/post.md
[info] Creating folder: source/_drafts
[info] Creating folder: scripts
[info] Copying theme data...
[info] Initialization has been done. Start blogging with Hexo!

更換部落格佈景主題

Themes 這兒有 Hexo 部落格佈景主題列表，可找個喜歡的部落格佈景。 大多數的部落格佈景安裝方式都雷同。如下以 AWE 爲範例說明：

$ cd ~/blog
$ git clone https://github.com/kywk/hexo-theme-awe.git themes/awe

利用 Koding 的編輯器修改 _config.yml，將 theme 設成 awe _config.yml 爲部落格主要設定資訊，部落格標題、做者資訊亦在這個檔案進行設定。

在 Koding 的編輯器看到資料夾結構以下圖：

配置 Github

Hexo 生成的部落格爲靜態檔案，可直接 hosting 在任何 Web Server 上，至關多人將其放置於 Github 上。 Github Page 分紅 Personal/Project 兩種，本文僅介紹 Personal Page 的設置。

Github Page 設定

先在 Github 上創建一個新的 repository，專案名稱需爲 你的賬號.github.io

而後修改 _config.yml 中 deploy 資訊以下，可直接利用 Koding ACE 編輯器進行修改

deploy:
  type: github
  repository: https://github.com/你的賬號/你的賬號.github.com.git
  branch: master

ssh-key

爲方便存取 Github，建議創建 ssh-key。如下僅簡述步驟，詳細介紹在 Generating SSH Keys · GitHub Help

在終端機輸入指令：

$ ssh-keygen -t rsa -C "your_email@example.com"

利用編輯器開啓 ~/.ssh/id_rsa.pub，參考 Generating SSH Keys Step3 的步驟， 將 ~/.ssh/id_rsa.pub 的內容貼上 Github.

Happy blogging

上述步驟完成後，便可利用瀏覽器在 Koding 上正常操做 Hexo 來創建部落格文章與發佈到 github 了。

創建新文章

$ hexo new "title"

發佈到 github

$ hexo d (deploy)

在 Koding 上創建 hexo 環境最大的好處是跨平臺、裝置，能夠隨時隨地編寫部落格文章， 無須安裝 Node.js / Git / ... 等開發工具。 然而文章都放在 Koding 上亦有網路速度不佳與存取不便的缺點。

---

via kywk