5 分鐘快速搭建好你的我的站點

Hexo 是一個快速、簡潔且高效的博客框架,它使用 Markdown(或其餘渲染引擎)解析文章,在幾秒內,便可利用其衆多的靚麗主題生成靜態網頁。正是這種簡單、免費和可擴展的特性,Hexo 愈來愈受到程序員的喜好。這裏咱們經過一個詳細的教程,給你們演示一下如何在 5 分鐘內搭建並部署好一個我的站點(博客)。html

咱們使用 Hexo 框架來搭建博客站點,同時將站點託管到 LeanCloud 平臺的「雲引擎」之上,以完成最終的部署上線。閒言少敘,書歸正文,咱們看看具體的步驟是什麼樣子的。node

1. 安裝依賴

Hexo 依賴於 Node.js 和 Git,若是你的電腦中已經安裝了這兩個必備程序,那麼能夠直接前往下一步。若是你的電腦中還沒有安裝所須要的程序,請參考官方指南完成安裝。git

2. 安裝 Hexo

依賴安裝完成以後,可使用 npm 安裝 Hexo。程序員

$ npm install -g hexo-cli

3. 下載博客項目模版

Hexo 命令行工具能夠建立一個典型的博客項目,在該項目內 Hexo 經過使用特定的主題(theme)來對 Markdown 格式的文章內容進行渲染,從而生成靜態文件。通常狀況下,咱們只須要把這些靜態文件部署到遠程服務器上,便可得到一個可用站點。github

LeanCloud 的雲引擎提供了很是好用的網站託管功能,此外還提供完善的日誌收集、監控等運維服務,這就要求一個站點在基本的靜態內容以外還能支持少數動態的管理接口(在雲引擎的項目框架中已經實現)。web

爲此咱們在 Hexo 項目框架的基礎上加入了少許 LeanCloud 雲引擎須要的動態響應文件,作成了 hexo-engine 這樣一個開源的項目模版。開發者能夠直接將這個項目下載到本地,以此爲基礎開始搭建本身的博客站點。npm

$ git clone git@github.com:leancloud/hexo-engine.git

下載好模板以後,咱們須要先安裝好 Node.js 的項目依賴,以便於後續的操做:瀏覽器

$ cd hexo-engine
$ npm install

4. 添加內容

Hexo 框架將全部的博客文章統一放置在 source/_posts 目錄下。咱們進入 hexo-engine 目錄,執行 hexo new 命令便可增長一篇新的博客文章。服務器

例如咱們想增長一篇「5 分鐘快速搭建好你的我的站點」的博客,那麼能夠運行以下命令:hexo

$ cd hexo-engine
$ hexo new "build your own website in 5 minutes"

執行完以後咱們可看到以下的結果信息:

INFO  Validating config
INFO  Created: ./hexo-engine/source/_posts/build-your-own-website-in-5-minutes.md

直接去編輯這個新增的 Markdown 文件(build-your-own-website-in-5-minutes.md)就能夠了。

5. 本地運行

文章編輯好了以後,咱們能夠運行 hexo generate 命令來生成靜態文件,hexo server 來啓動本地服務器,查看實際效果。咱們在命令行下輸入以下命令:

$ hexo g
$ hexo s

注意這裏的 g 和 s 分別是 generate 和 server 的縮寫。執行完以後應該能夠看到以下結果信息:

INFO  Validating config
INFO  Start processing
INFO  Hexo is running at <http://localhost:4000> . Press Ctrl+C to stop.

這時候在瀏覽器內打開 (http://localhost:4000,就能夠看到咱們本身的博客站點已經跑起來了。)

6. 部署到 LeanCloud

到目前爲止,咱們的我的站點已經能夠跑起來了,惟一的遺憾是尚未實際部署到互聯網上,還不能讓其餘小夥伴自由訪問。

這裏咱們使用 LeanCloud 雲引擎服務來免費完成這最後的一步——部署上線。首先咱們申請一個 LeanCloud 帳號,並建立一個應用,這部分操做比較簡單,你們自行登陸 LeanCloud 官網 操做便可。

6.1 準備:安裝雲引擎命令行工具

咱們首先須要安裝雲引擎的命令行工具(能夠參考官網文檔):

  • macOS 用戶能夠執行 brew install lean-cli ;
  • Windows 用戶能夠在 GitHub releases 頁面 根據操做系統版本下載最新的 32 位 或 64 位 msi 安裝包進行安裝;
  • Linux 用戶能夠從 GitHub releases 頁面 下載 deb 包或者預編譯好的二進制文件進行安裝;

接下來咱們須要登陸 LeanCloud 帳戶(按照提示選擇區域並輸入 LeanCloud 用戶名和密碼便可):

$ cd hexo-engine
$ lean login --region US

而後是將當前的項目與 LeanCloud 應用創建關聯,輸入以下命令:

$ cd hexo-engine
$ lean switch

按照提示選擇區域和目標應用便可。

有關雲引擎命令行工具的更多使用內容,能夠參考文檔:命令行工具 CLI 使用指南

6.2 本地運行

在項目目錄下運行以下命令:

$ cd hexo-engine
$ lean up

在瀏覽器中打開 http://localhost:3000,咱們能夠看到博客站點的首頁內容。

6.3 部署到雲端

若是前面的步驟都沒有問題,咱們就能夠將當前項目部署到 LeanCloud 雲端了。在命令行下輸入以下命令:

$ cd hexo-engine
$ lean deploy

注意在 deploy 以前,咱們能夠刪除本地的 public 目錄,以免沒必要要的文件上傳。deploy 的執行結果應該以下所示:

[REMOTE] [Node.js] 使用 Node.js v12.19.0, Node SDK 3.7.0, JavaScript SDK 3.15.0
[REMOTE] 版本 20201118-064943 構建完成
[REMOTE] 開始部署 20201118-064943 到 web1
[REMOTE] 正在建立新實例 ...
[REMOTE] 正在啓動新實例 ...
[REMOTE] 實例啓動成功:{"runtime":"nodejs-v12.19.0","version":"3.7.0"}
[REMOTE] 正在更新雲函數信息 ...
[REMOTE] 部署完成:1 個實例部署成功
[INFO] Deleting temporary files

這時候咱們能夠進入 LeanCloud 雲引擎的控制檯,爲當前部署的雲引擎實例設置一個訪問域名,其操做路徑以下圖所示:

img

咱們在瀏覽器中打開 http://hexo-engine.avosapps.us 就能夠看到發佈以後的首頁內容了。

大功告成,咱們的我的博客已經順利上線了!測算一下,不計建立帳號和下載工具的時間,整個過程耗時應該不超過 5 分鐘。

7. 其餘

7.1 定製化修改

咱們能夠經過修改項目根目錄下的 _config.yml 文件,來對如今的博客站點進行一些定製,例如修改網站標題、描述、關鍵字,等等。具體細節能夠參考這裏的官方指南

7.2 給博客加上評論功能

咱們推薦你們使用 Valine 這一個評論插件,具體的接入能夠參考這篇博客

7.3 使用更多主題

有不少開發者爲 Hexo 貢獻了很是多精美的主題,要替換一個新的主題,操做上也是很是簡單的,有興趣的讀者能夠閱讀這裏的文檔。

相關文章
相關標籤/搜索