前言

一年多前,2017 年 4 月,我越獄了當時的新系統 iOS 10.1.1,並且用 theos 撰寫了數個小擴充套件(tweak)供自己使用,當然也有上架至 BigBoss 的 FolderAutoClose 10 至今已有四千餘人下載使用。

在撰寫越獄套件時,由於 iOS 逆向工程的網路中文資源過於稀少,是跌跌撞撞吃了不少虧,也有私訊了越獄開發圈的臺灣人,不過可能因小弟不才,他們似乎沒有想要搭理我的意願。

是不是有跟我一樣非本科系,又對越獄開發頗具興趣,但又苦於中文資源稀少的人呢?我想。

我決定,不如將開發過程的筆記寫下來並分享出去。

於是,我架設部落格,撰寫了數篇詳盡的越獄開發基礎教學,但是後來 iOS 11 的越獄掀起了不少爭議。

Saurik 甚至說越獄已死,再加上當時轉換學習環境,無暇經營部落格,開發的相關筆記就此喊停。

今年,辭去了會長職位,iOS 12 的越獄進程也逐漸明朗,是時候重拾部落格舊業。

我建立了 2019 目標:「週更部落格」,我想先讓部落格換然一新,舊貼文也會在整理後陸續推出。

以前我是用 Hexo+GitHub 靜態頁來架設部落格。

不過 Hexo 過於繁瑣,需要安裝一堆套件,程式肥大,效率不佳。

尋覓後發現了 Hugo 也能在 GitHub 上部署部落格,而且與 Hexo 相比簡單不少,效能也不錯,一樣是使用 Markdown 來撰寫貼文,很適合程式設計師使用。

下文將使用 Hugo 在本地建立靜態網站檔案,再將檔案丟上 GitHub 託管,並利用 GitHub Pages 服務供使用者瀏覽網頁。


關於 Hugo、GitHub

Hugo:開源的靜態網站生成工具。

GitHub:透過 Git 進行版本控制的軟體原始碼託管服務。


軟體需求

Homebrew:macOS 套件管理工具。

Hugo:開源的靜態網站生成工具。

Atom:由 GitHub 開發的開放原始碼的文字與程式碼編輯器。

ImageOptim:macOS 圖片壓縮、最佳化軟體。

GitHub Desktop:圖形化介面的程式碼版本控制工具。


實作過程

安裝 Homebrew

依照 官網 指示安裝 Homebrew。

如果沒有安裝過 Xcode Command Line Tools 的話,下載可能會有點久。


安裝 Hugo

  1. 於終端機下指令,利用 Homebrew 安裝 Hugo:

    brew install hugo
    
  2. 於終端機下指令,檢查 Hugo 是否安裝成功:

    hugo version
    
  3. 出現類似Hugo Static Site Generator v0.54.0的訊息就代表安裝成功。


建立新部落格與安裝主題

cd到要存放部落格檔案夾的目錄,於終端機下指令:

hugo new site 部落格檔案夾名稱

此檔案夾即為部落格的 根目錄,如下,詳細 Hugo 目錄結構請參考 這裡

.
├── archetypes(.md 初始模板)
├── config(設定檔)
├── content(貼文)
├── data
├── layouts
├── static(網站靜態內容檔案)
└── themes(主題)

Hugo 有很多 主題,將其下載目錄./themes底下,並依照主題說明的指示將相關設定檔輸入至./config.toml裡即可。


創建頁面

  • 建立一般頁,在根目錄下指令:

    hugo new about.md
    

    一般頁將建立在 ./content裡。

  • 建立貼文,在根目錄下指令:

    hugo new posts/welcome.md
    

    貼文將建立在./content/posts裡。


安裝 Atom

創建了頁面之後,使用 Atom 來編輯.md檔,官網 下載安裝。

推薦安裝的擴充套件:


安裝 ImageOptim

使用 ImageOptim 來壓縮圖片,使上傳圖檔體積縮小,官網 下載安裝。


預覽、製作

  • 本地預覽,在根目錄下指令:

    hugo server
    

    產生預覽內容,使用瀏覽器經由 http://localhost:1313/ 查看。

    且支援熱部署(livereload),修改貼文或是 CSS 時是不用重啟的,十分方便。

  • 製作靜態頁面,在根目錄下指令:

    hugo
    

    將產生部落格的靜態頁於./public底下。


安裝 GitHub Desktop、部署

產生部落格到./public後,使用 GitHub Desktop 將其部署至 GitHub。

  1. 開啟網頁瀏覽器登入 GitHub,新增一個使用者用戶名.github.io的遠端 repo。

  2. 官網 下載安裝 GitHub Desktop。

    目前 1.6.1 版本有個 Bug,登入 GitHub Desktop 會抓不到遠端名稱包含.的 repo,先不要登入。

    官方已經注意到這個問題,不知道什麼時候會修復。

  3. 先將./public檔案夾刪除,再手動填入路徑 clone 至本地./public

    URL:https://github.com/使用者用戶名/使用者用戶名.github.io.git
    Local Path:./public
    
  4. 在 Ignored Files 裡加入.DS_Store以免不必要的檔案上傳遠端。

  5. 未來新增貼文之後,commit 於本地,並 push 到遠端 GitHub 即可。

    部落格的網址為:https://使用者用戶名.github.io/

    GitHub Pages 的相關 說明