Hexo 與 GitHub Pages 架站教學 打造專屬前端技術分享平台，輕鬆開啟部落格之旅

如何快速使用 Hexo 與 GitHub Pages 架設部落格？

Hexo 部落格架設教學 的核心在於利用「靜態網站生成器」實現技術分享。架站路徑包含：1. 環境建置：安裝 Node.js 與 Hexo CLI；2. 空間代管：利用 GitHub Pages 部落格 功能實現零成本全球發佈；3. 內容創作：掌握 Markdown 寫作實踐，利用其強大的程式碼嵌入功能記錄筆記。相比傳統 Jekyll，Hexo 以其渲染速度與豐富的「所見即所得」樣式資源脫穎而出。對於追求高效、簡潔且具備個人風格的開發者來說，這套 前端部落格平台 方案是開啟 部落格入門指南 的最佳選擇。

這弄弄那弄弄的，第一個 Blog 就打開了。

跳過碎碎念 XD

去年年底，覺得好像差不多可以準備換工作了，就加加減減看了一些職缺，也發現有些職缺甚至開在 Github 的 issues裡，於是就開了一個帳號。

加上也發現許多工作面試有這個需求，所以就做一個吧。也因為之前公司是 SVN 所以沒用過 Git，這次先練習上傳了一些平常的練習。

之前也常常逛 Github，發現有些人會利用這個空間來開部落格，於是乎稍微研究了一下，就決定開始動手做一個 XDDD

放個今年第一張被拍的帥照好像是必須的 XDDD

簡介

其實 Github 本來就有提供個人放置解說網頁的功能，利用 GitHub Pages + Jekyll 就可以快速產生。

但樣式就稍微單調一點，上網查詢了以後,發現已經有框架可用了!!!
這次主要是利用 hexo 這套框架。

Hexo: A fast, simple & powerful blog framework

而且還支援 Markdown，使用上其實真的蠻簡單的，也沒什麼大問題，搭配官網裡其他大大的樣式，簡單的就可以開始進入寫部落格的階段了 XDDD

而且也有提供把程式碼嵌在裡面的功能,根本專門給人寫筆記用的 XDDD

1
2
3

function autoDetect() {
  console.log("ye, it is written in JavaScript!");
}

FAQ：Hexo 部落格架設常見問題

Q1：為什麼選擇 Hexo 而不是 GitHub 官方推薦的 Jekyll？

A：雖然 Jekyll 是官方標配，但 Hexo 樣式自定義 的豐富程度與生成速度在大型專案中更具優勢。Hexo 基於 Node.js，對於前端工程師來說，其生態系更容易透過 npm 進行擴充。此外，Hexo 提供的眾多「開箱即用」主題（如 NexT 或 Hux），能讓您在不具備深厚設計背景的情況下，也能快速建立出專業部落格。

Q2：使用 Markdown 寫作對技術部落格有什麼實質好處？

A：Markdown 的核心在於「內容與格式分離」。 Markdown 寫作實踐 能讓您專注於程式碼邏輯與文字敘述，無須擔心排版跑掉。特別是 Markdown 支援豐富的語法高亮 (Syntax Highlighting)，這對於記錄技術筆記或分享 JavaScript 片段來說，是極佳的生產力工具。

Q3：GitHub Pages 的託管服務有什麼限制嗎？

A： GitHub Pages 部落格 提供免費的 SSL (HTTPS) 支援與自定義域名。其主要的「斷捨離」限制包含：網站容量建議在 1GB 以內，且每月流量建議不超過 100GB。對於個人技術部落格而言，這些額度綽綽有餘。若未來流量爆增，也可以輕鬆遷移至 Netlify 或 Vercel 等平台。

—— 2017.01

• ← 上一篇