0 前言
本文並不是從 0 開始使用 gatsby.js 搭建博客，starter 使用的是 gatsby-starter-blog。使用 gatsby-starter-blog 可以大量節省項目搭建時間，直接得到一個最簡單的博客模版，這個模板的缺點是功能少，但是反過來說優點是有較高的自由度。
根據下面整個流程做好的靜態博客大概長這個樣：https://ssshooter.com/tag/gatsby
涉及到的前置知識：
- JavaScript
- React
- graphQL（次要，即時上手也基本能看懂）
我從最簡單的博客模板開始添加功能的原因，就是可以讓自己更熟悉整個博客的構造，自己可以隨心所欲地添加功能，這纔是真正的自己的博客。以前用過 Wordpress 和 Hexo，可能就是因爲下載下來模版就太完善了，根本不想自己研究裏面的實現，然後模板不加修改樣式就與其他人一摸一樣，變得很沒特色，所以我也失去的更新的慾望。所以自己定值博客，或許可以讓自己堅持更新下去。
整個流程最主要是前面 5 步，後面的 3 步都是非必要的，其他附加功能後續可能還會有更新。這篇文章的作用是一個導航，下面只會簡單概括文章內容，詳細內容請點全文鏈接。你可以根據你的需要一步一步進行，也可以跳過熟悉的步驟。
PS. 本教程涉及到的服務都是免費的，窮苦學生黨莫慌（不過域名還是沒有免費的）
1 關鍵文件
這一部分主要介紹模板的下載、項目結構及其一些關鍵文件。主要會提到 gatsby-node.js（頁面生成函數所在文件）、/src/templates/blog-post.js（生成頁面所用模板）以及 gatsby-config.js（Gatsby 的配置文件）。
2 實現分頁
現成模板缺少博客最重要的功能——分頁。因爲分頁實現十分重要，並且可以藉此理解頁面生成原理，所以用自己實現分頁來入門 Gatsby 我覺得是個不錯的選擇。
實現的關鍵在於模板文件的修改和 graphQL 查詢的編寫。（本項目所需的 graphQL 要求不高，但是對此感興趣的話可以深入瞭解一下這個查詢語言，中文文檔在此）
3 樣式調整
比較簡單的一節，包括修復代碼高亮和覆蓋主題樣式兩部分。注意一下使用全局 CSS 的 bug 就 OK 了。
4 標籤系統
標籤系統實現了標籤彙總頁和各個標籤的文章列表頁，是 graphQL 查詢實踐的加強版，原理跟分頁是一樣的，不過複雜一點看起來有一丁點望而生畏。
5 博客上線
網站上線的步驟，包括把項目部署到 netlify 和自定義域名設置相關問題與解釋。
6 評論系統
首先是因爲幾個出色的社會化評論服務網站都已經被牆了，然後是自己有一點對數據的佔有慾，所以這一節甚至要自己搞一個評論系統。不過藉助現成的 staticman，這一步也不會太麻煩。
7 文章目錄
良好的文章頁面必不可少地需要一個文章導航，對不起！由於難度的誤判，這個功能雖然來晚了，但是絕對不會缺席！使用 gatsby-transformer-remark 輕鬆解決問題～
EX 使用語雀發佈到博客
比較好玩的一節，主要好玩在使用 GitHub 接口提交文件，感覺打開了新世界的大門。配合上語雀的文章發佈推送絕配，於是有了這麼個功能專題。
未來
本系列依然會繼續更新，UI 肯定會繼續調整，功能肯定會增加。想要堅持寫 blog，要先喜歡自己的 blog，用心添加新功能吧！