GithubBlog 架設/發佈/撰寫 心路歷程

Veröffentlicht am

說明

  1. 以下操作指令以$開頭，皆為bash指令。
  2. 文章採用Markdown格式撰寫。

環境準備

OS：Windows 10
Code editing：Visual Studio Code(以下簡稱VS Code)

依序安裝下列軟體:

  1. Node.js
  2. Git

  3. Hexo

    • 連結
    • 版本：v1.1.0
    • 安裝Hexo前，先開啟VS Code編輯器內的終端機(Ctrl+`)。

    • 接著檢查Node.js與Git是否已安裝完成：

      1
      2
      $ node -v       # 檢查Node.js版本
      $ git version   # 檢查Git版本

    • 準備安裝Hexo

      1
      2
      $ npm install -g hexo-cli   # 安裝Hexo
      $ hexo version              # 檢查Hexo版本

網站架設

  1. 建立網站

    1
    2
    3
    $ hexo init <folder>    # 建立網站資料
    $ cd <folder>           # 移動到資料夾目錄下
    $ npm install           # 安裝相關套件

  2. 建立Repository

    • 命名規則：<yourGithubAccount.github.io>

  3. 設定SSH Key

    1. 設定資訊

      1
      2
      $ git config --global user.name "yourGithubAccount"
      $ git config --global user.email "yourGithubEmail"

    2. 產生SSH Key

      1
      $ ssh-keygen -t rsa -C "yourGithubEmail"

    3. 開啟id_rsa.pub檔案，複製全部內容(可用Word開啟)。

    4. 打開Repository > Setting > Deploy keys > Add deploy key，並設定：
      • Title：隨意
      • Key：貼上id_rsa.pub內的全部內容。
      • Allow write access：若需要寫入權限記得勾選(預設為Read-only)。參考連結
      • 若出現以下錯誤訊息，請檢察複製內容格式是否有誤。
        Key is invalid. It must begin with 'ssh-ed25519', 'ssh-rsa', 'ssh-dss', 'ecdsa-sha2-nistp256','ecdsa-sha2-nistp384', or 'ecdsa-sha2-nistp521'. Check that you're copying the public half of the key
    5. 測試連線 
      1
      $ ssh git@github.com

  4. 設定部署資訊

    1. 開啟_config.yml，設定Deploy：
      deploy:
    type: git
    repo: <repository url>
    branch: master

  5. 部署網站 參考連結

    1
    2
    $ npm install hexo-deployer-git --save      # 安裝Hexo Git
    $ hexo d -g                                 # 部署網站前先產生靜態檔案

  6. 測試連線
    https://<yourGithubAccount>.github.io/

撰寫文章

  1. 基本操作

    1
    2
    3
    4
    5
    6
    $ hexo new [layout] <title>         # 建立文章
    $ hexo publish [layout] <filename>  # 發表草稿
    $ hexo generate                     # 產生靜態檔案。(縮寫：$ hexo g)
    $ hexo server                       # 啟動伺服器。(縮寫：$ hexo s)
    $ hexo deploy                       # 部署網站。(縮寫：$ hexo d)
    $ hexo clean                        # 清除快取檔案 (db.json) 和已產生的靜態檔案 (public)。

  2. 更換主題

    • 只要在 themes 資料夾內，新增一個資料夾，並修改 _config.yml 內的 theme 設定，即可切換主題。

    • Example：

      1
      2
      $ cd <folder>
      $ git clone https://github.com/theme-next/hexo-theme-next themes/next

    • 修改 _config.yml

      theme: next
  3. 寫作
    • 文章寫作規則請參考Markdown格式撰寫。(以後再說@A@!!)

參考資源

  1. cmd 与 bash 基础命令入门
  2. Markdown文件
  3. GitHub+Hexo 搭建个人网站详细教程
  4. Hexo + Github Blog 建立過程