---
# System prepended metadata

title: Github page + Hexo

---

Github page + Hexo
==================

# 安裝Node
[下載頁面](https://nodejs.org/en/download/)

> Windows
![Windows](https://i.imgur.com/pX3eyyW.png)

> Mac
![](https://i.imgur.com/cjmwb3o.png)

測試
開啟cmd 或 terminal
輸入
```bash
node -v
npm -v
```
版本隨意, 但要有出現, 表示安裝成功
![](https://i.imgur.com/Vzgts11.png)

# 申請Github
[Github](https://github.com/)
來申請帳號

# 安裝Git
[下載網址](https://git-scm.com/download/win)
[安裝教學](https://gitbook.tw/chapters/environment/install-git-in-windows.html)

# 安裝[Hexo](https://hexo.io/zh-cn/)
```bash
npm install hexo-cli -g
```
檢查是否安裝成功
```bash
hexo version
```
切換到blog想存放的資料夾路徑, 這裡先放在C:\底下
`hexo init <folder>`, folder填寫自己想要的資料夾名稱(英文)
```bash
cd C:\
hexo init blog
# 切換到blog資料夾內
cd blog
# 安裝依賴包
npm install 
```

# 建立Github blog倉庫
1. 建立倉庫
![](https://i.imgur.com/3CVEr3v.png)
2. 填寫倉庫名稱, 輸入`github帳號.github.io`
![](https://i.imgur.com/GYmNP8G.png)
3. 看到這頁就是建立成功
![](https://i.imgur.com/E5guUlm.png)

# 修改_config.yml
用編輯軟體打開部落格資料夾下的`_config.yml`
找到deploy這裡
```yaml=
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: https://github.com/github帳號/github帳號.github.io
```

# 生成靜態檔案
```bash
hexo g
```
# 啟動本機server
```bash
hexo s
```

# 佈署到github page
```bash
hexo d
```

# 新增文章
```bash
hexo new 標題
```
就會在`source/_ports/` 下出現該標題文章的.md檔.
就能進入以markdown語法撰寫.

## 標題跟分類
`:`後面都要空一格
```
---
title: Go-Interface & OOP
date: 2019-08-25 23:48:57
categories: "目錄名稱"
tags:
    - 標籤1
    - 標籤2
---
```

寫完後一樣, g 生成檔案, s 本地預覽
```bash
hexo g
hexo s
```

沒問題就佈署到git
```bash
hexo d
```

過大概10分鐘後, 打開瀏覽器輸入`https://github帳號.github.io`
應該就會看到網誌了.

# 網誌圖片
放在`source/images/`底下
markdown就這樣使用 `![](/images/圖片檔名.副檔名)`

也能在底下再開資料夾`source/images/資料夾`
markdown就這樣使用 `![](/images/資料夾/圖片檔名.副檔名)`


# 參考資源
> [前端工具百寶箱 - 六角學院](https://ithelp.ithome.com.tw/users/20111449/ironman/1767?page=3)
> [如何搭建個人 Blog 使用 Hexo + Gitpage](https://medium.com/@bebebobohaha/使用-hexo-gitpage-搭建個人-blog-5c6ed52f23db)
> [使用 Hexo 在 Github 建立部落格
](https://junyou.tw/hexo/)
> [markdown](https://markdown.tw/)