廢話前言

想要架設部落格作為記錄自己生活或相關筆記嗎?

會想架設部落格的主要原因是自己正在上Javascript課程，課程有提到要開個部落格來作為自己的技術筆記、心得、或一些自己想記錄的東西作為備忘，畢竟學海無涯，有很多東西學會後久久不使用真的會忘記。

後來使用了一些大眾市面上的blog，但終究覺得不合用，一方面更想要有自己的風格，一方面對於自己來說希望更加方便撰寫紀錄及發布。而我這個初心者才知道，原來可以在Github撰寫靜態網頁(蠢)，所以就開始研究到底該如何在Github上架設一個簡易的靜態blog之旅。

起初還真的不知道要怎麼做，只知道如何在Github上呈現index.html，然後再自己手動寫連結…甚至最後想說是不是全部手刻HTML(蠢x2)，後來想想這不對啊!! 這也太麻煩且浪費時間了，不如用市面上的blog就好，不然完全本末倒置(笑，所以就開始試著搜尋網路上有沒有更適合的作法。
後來發現網路上有很多已經完成的樣板，只要下在別人寫好的主體下來加以修改撰寫，在推上Github，就可以完成自己的個人BLOG了。一開始搜尋到的是jekyll但它是ruby撰寫的，所以我也沒有環境系統，所以搞了老半天，但經過一翻嘗試還是有很多問題，覺得搞得一個頭兩個大的時候，讓我搜尋到了Hexo!!

Hexo 是一個快速、簡單且強大的網誌框架。Hexo 使用 Markdown（或其他標記語言）解析您的文章，並在幾秒鐘內，透過漂亮的主題產生靜態檔案。

@Hexohexo.io/zh-cn/docs

他主要又是以Javascript, Node.js 來操作，完全符合我現在在上課的內容，所以環境架設也都已經完成了，做了點嘗試沒想到一下就成功架上Github，中間也沒有遇到太多問題，所以最後決定使用Hexo作為主要的撰寫框架工具啦!順便在這邊紀錄使用的情況，及寫下相關技術筆記。

第一步：安裝必備程式

程式清單：

Git 終端機 (Windows推薦)
Node.js 讓你可以在終端機上以Javascript指令來操作電腦
Visual Studio Code方便你在個人電腦上編程
詳細可以參閱 Hexo官方文件

如果完全沒有使用過Git Bash終端機及使用GitHub的同學
就是要先有自己的Github帳號啦! 之後要在Git Bash裡設定你的識別資料

範例

1 2	$ git config --global user.name "John Doe" $ git config --global user.email johndoe@example.com

user.name 為你的Github帳戶
user.email 為你的Github帳戶設定的email

第二步：在電腦上開設專屬Blog資料夾，初始化Hexo檔案

安裝完後請打開 Git Bash 終端機
在終端機上輸入 npm install -g hexo-cli ，來安裝hexo
一旦 Hexo 安裝完成後，執行下列指令，Hexo 就會在指定資料夾中建立所有需要的檔案。

$ hexo init <folder> // folder輸入你要建立的資料夾名稱
                     // 若想要在別的硬碟裡面建立，記得先使用終端機輸入cd 移動到你要建立blog資料夾的位置
$ cd <folder> // folder輸入你剛剛建立好的資料夾名稱
$ npm install // 安裝初始化npm
$ git init // 若想要在電腦上使用git版本控制，記得要順便安裝git，不理解或不想用可忽略

建立完成後，專案資料夾會有下列檔案：

.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

_config.yml

此檔案為網站配置檔案(站點配置)，可以在這個檔案配置大部分的設定。

source 資料夾

原始檔案資料夾是放置內容的地方。檔案或資料夾名稱開頭為 _ (底線) 的資料還有設定隱藏檔案會被忽略。
因為在你把網頁推到伺服器端的時候，Hexo或先把所有原始檔案渲染成Html檔案，在推上伺服器，所以不重要或想要忽略的檔案，可以設定隱藏或是在檔案名稱開頭加上_ (底線)。
但除了 _posts 資料夾，因為_posts資料夾內會存放所有你的文章Markdonw檔案。
而渲染完成的檔案會被放到 public 資料夾，而其他檔案會被拷貝過去。

themes 資料夾

主題資料夾，裡面可以放各式各樣的主題，可以放自己的或網路上別人製作好提供的，然後 Hexo 會根據你_config.yml裡面主題設定要使用哪一個主題來渲染最後完成的HTML檔案。

第三步：在GitHub上建立一個新的Repository

先到Github開一個新的Repository
輸入Repo名稱 > 選擇公開 >建立

第四步：安裝hexo-deployer-git，並部屬至Github

回到終端機輸入

1	$ npm hexo-deployer-git

設定_config.yml

使用 VS CODE 打開剛剛建立好的HEXO資料夾

開啟_config.yml

裡面有很多相關設定，不一一介紹，主要只以可以成功部屬到Github需要設定的參數為主，其他沒提到的，可以到 Hexo 官方文檔查詢。

以下設定以我自己為範例

url: doug0849.github.io
設定GitHub的repo設定網址

設定主題
theme: landscape

預設應該是landscape，若網路上下載了別人的主題，可以放到themes底下，設定好資料夾名稱，將這個參數改為資料夾名稱即可。

最後設定部屬參數
在最後加上以下參數
deploy:
type: git
repo: https://github.com/Doug0849/doug0849.github.io.git
branch: main

type輸入git
repo請輸入你完整的repo位置
branch: 改為main

回到終端機執行

1 2	$ hexo clean $ hexo deploy

第五步：別忘了要把repo設定成Github Page

第六步：訪問 https://你的帳戶名稱.github.io/

基本上這樣就能在github上看到你的個人blog啦!
如果剛上傳應該不會馬上看到，可能過個五分鐘內就會顯示，
剩下就是設定其他相關參數，及寫下你的第一篇文章。

第七步：發文

這邊只做簡易說明
使用終端機輸入

1	$ hexo new [title]

到_posts底下會看到一個你命名為 [title] 的 Markdown 檔案
就可以使用 Markdown 語法來撰寫你的文章
寫完後在終端機執行

1 2	$ hexo generate $ hexo deploy

等個5分鐘，再次訪問 https://你的帳戶名稱.github.io/
看看文章有沒有PO上去啦!

其他簡單的操作說明可以看
其他Hexo 操作

詳細的其他說明一樣看
Hexo 官方文檔查詢。

邊撸鐵健身邊學Code的Dhal

如何用Hexo在Github上架設blog