使用 Gatsby + Netlify 搭建的個人技術部落格，包含自己學習程式技術的筆記、工作心得，還會不定期分享好吃新奇又好玩的音樂知識！
由於筆者的強迫症，本 Blog 並沒有套用 UI Template，而是決定純手工打造，展現日本職人的匠心，いっらしゃいませ！
採用 Jamstack，使用 Gatsby 作為 Static Site Generator（SSG），根據 repo 內的 markdown files 產生靜態頁面後，部署至 Netlify。主要有以下好處：
- Performance：不需每次請求都經過過後端 template render，把 run time 處理的事情提前到 build time 處理。
- Multiple Source：不只能使用 local 的 markdown files 作為 content source，也可以選擇透過 CI 整合 headless CMS，如 Ghost、Wordpress 等。
- Security：由於 content source 都在 local files 或是第三方 headless CMS 服務上，不需管理 API、database，減少受到攻擊的機會。
- Easy to Deploy/Scale：在有限額度內使用完全免費，透過簡單的設定即可和 Github 整合 CI/CD，也有 Deploy Previews 這種超讚的功能。
文章都放在 src/posts/ 下，為 mdx 格式，簡單來說就是可以在 markdown file 中使用 React component。經過 gatsby build 產出的網頁會在 public/ 底下，除了網頁內容外，還會包含：
sitemap/：由 gatsby-plugin-advanced-sitemap 產生，提交給 Google Search Console，讓 Google 更有效率的方式檢索網站。rss.xml：由 gatsby-plugin-feed 產生，讓 RSS 服務能夠訂閱我們的 blog。robots.txt：由 gatsby-plugin-robots-txt 產生，主要用來避免網站因要求過多而超載。
- Git branch/commit 基本上遵守 Angular Convention。
- Javascript 風格遵守個人 F2E Library 下的 ESLint、Prettier rules。
- Git commit 時會透過 lint-staged + husky 檢查。
- Pull request 時會觸發 Github Actions 進行檢查，設定檔在 .github/workflows/main.yml。
- Markdown 格式遵守 markdownlint 下的 rules。
- 文章的撰寫格式遵守 writing guideline。
Depfu 會在 npm packages 有新版本時發出 PR 且列出 changelog，方便我們進行例行性套件升級。
免費使用的 icon 資源參考 icon.md。
- Jamstack
- 淺談 Jamstack - 小隊員日誌
- SPA, SSG, SSR and JAMStack: a front-end acronyms guide
- WTF are JAMstack Apps and Static Site Generators (SSG)
- Delivering Modern Website Experiences: The Journey to a Content Mesh | Gatsby
- Day 14 Server-Side-Rendering - (1) - iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天
P.S. 舊版 Blog 小蛇蛇的筆記已沒有在維護，不過有興趣的還是可以逛逛。