搬家記
本人三心二意，Blog 的形式從最早期的WordPress到Hugo，這次換到Docusaurus
希望這是最後一次 XD
從原本用免費網域到用付費網域...現在應該可以確定就是使用Cloudflare了哈哈
最近我把我的部落格從 Hugo 搬到了 Docusaurus，主要原因是想要把技術筆記和部落格放在同一個專案裡管理，讓寫作與維護更方便。
為什麼搬家？
Hugo 的靜態生成速度很快，也有自己的優點，但隨著筆記與文章數量增加，我發現管理多種類型的內容（技術筆記、閱讀筆記、生活心得）變得不太直覺。而我原本就有一個以 Docusaurus 管理的技術筆記網站，然後他的速度也是蠻快的，PageSpeed 測試下其實不輸給 Hugo，所以最後就選擇留下 Docusaurus, 放棄 Hugo
目前我把內容分成兩個主要部分：
/doc：技術筆記，主要是「系統性整理」技術點、技能點/blog：閱讀筆記、單一技術或軟體技巧筆記、生活隨筆、參加 Conf 的心得等。
搜尋卡關
一開始是想要使用 Docusaurus 推薦的 DocSearch+Algolia 下去玩，但不知道為什麼明明我的網站 robots.txt 其實都是寫對的，但 DocSearch 的爬蟲還是認為我的robots.txt不合格，說我的robots.txt阻擋了它...
所以弄到後面我覺得很煩...於是退而求其次使用@easyops-cn/docusaurus-search-local，採用所謂的local-search方案，這也是在 Docusaurus 裡面所推薦 local search plugin 之一(https://docusaurus.io/community/resources#search)
設定上也蠻簡單的，就跟著 readme 跟著操作大概就行了
自動化小工具
我就有點懶，為了方便生成新文章，我寫了一個簡單的 shell script，功能就是快速建立 Markdown 範本，帶上必要的 Front Matter，例如 title、date、tags，還有 ，這樣每次新增文章就不用手動寫這些基本設定了。如果搭配 Makefile 使用，甚至可以直接用一條命令生成新文章，效率提升不少。
不過還是要謝謝 ChatGPT 幫忙，雖然好像不是馬上就可以用...你的東西多多少少還是有點 bug...跟你討論有時候還有點歪來歪去總是聽不太懂我要的指令...但幸虧本人還是會 Coding...我們的合作還是很愉快 XD
#!/bin/bash
# 檢查是否有提供 title
if [ -z "$1" ]; then
echo "請提供 Blog 標題，例如: ./post.sh 'WordCamp 2023 一日遊'"
exit 1
fi
TITLE="$1"
DATE=$(date +"%Y-%m-%d %H:%M:%S+08:00") # 取得當前日期時間含時區
FILENAME_DATE=$(date +"%Y-%m-%d") # 用於檔名的日期格式
BLOG_DIR="blog"
FILENAME="$BLOG_DIR/$FILENAME_DATE.md"
# 確保 blog 目錄存在
mkdir -p "$BLOG_DIR"
# 生成 Blog Markdown
cat <<EOT > "$FILENAME"
---
title: $TITLE
date: "$DATE"
hide_table_of_contents: false
tags:
-
---
:::info[]
description: 這是自動生成的 Blog 範本，請記得補充內容與標籤。
:::
<!-- truncate -->
EOT
echo "Blog 已生成: $FILENAME"
以及我在makefile寫
post:
./post.sh "$(TITLE)"
最後就只要在 Shell 那裡下
make post TITLE=搬家記
其實就可以簡單幫我先將 Docusaurus 可以吃的 Markdown 以及我懶得背的設定一起放進來啦...
部署後通知
之前，我的部署是透過 Github 和 Cloudflare 的連動，當我 push 上去 Github 時，就會啟動 Cloudflare Page 的 Deployment.
可是 Deployment 完成無論是成功或失敗，好像都不會給我 Notification...我後來研究之後發現他都整合到了 Cloudflare Notification...而設定過之後，發現他 只能給我寄 Email...
於是，我就改回我的老本行：Github action，畢竟，我比較喜歡 Slack Notification...沒想到 cloudflare page 的 Github action 也是蠻簡單設定的，已經都有很多大大都幫我寫好 Lib 給我用了...
name: Deploy Docusaurus to Cloudflare Pages
on:
push:
branches:
- main
jobs:
build-and-deploy:
runs-on: ubuntu-latest
steps:
# 1️⃣ 取得程式碼
- uses: actions/checkout@v3
# 2️⃣ 安裝 Node.js
- uses: actions/setup-node@v3
with:
node-version: "22"
# 3️⃣ 安裝依賴
- run: npm ci
# 4️⃣ Build Docusaurus
- run: npm run build
# 5️⃣ Deploy 到 Cloudflare Pages
- run: npx wrangler pages publish ./build --project-name=$CF_PROJECT_NAME --branch=main
env:
CF_API_TOKEN: ${{ secrets.CF_API_TOKEN }}
CF_ACCOUNT_ID: ${{ secrets.CF_ACCOUNT_ID }}
CF_PROJECT_NAME: ${{ secrets.CF_PROJECT_NAME }}
notify:
runs-on: ubuntu-latest
needs: build-and-deploy
if: always()
steps:
- name: Notify Slack
run: |
if [ "${{ needs.build-and-deploy.result }}" = "success" ]; then
STATUS="✅ 部署完成"
else
STATUS="❌ 部署失敗"
fi
curl -X POST -H 'Content-type: application/json' \
--data "{\"text\":\"$STATUS: ${{ github.repository }}\nWorkflow: ${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}\"}" \
${{ secrets.SLACK_WEBHOOK }}
SLACK_WEBHOOK: 這裡很簡單，去 Slack 上加入incoming Webhook後複製組態的網址即可，我比較喜歡這個設定...CF_API_TOKEN: 去自己 Cloudflare 的 Profile → API Tokens → Create Token -> Custom Token (注意要給 Cloudflare Page 的 Read/Write 的權限即可)CF_ACCOUNT_ID: 到 Overview → Account Home 這邊，看網址那邊會像這樣格式：https://dash.cloudflare.com/<ACCOUNT_ID>/xxx, 這個 ACCOUNT_ID 就是你的CF_ACCOUNT_IDCF_PROJECT_NAME: 這個就去 Page 那一區去找你的專案名稱
舊文章的搬遷策略
舊部落格的文章大多沒有搬過來，主要原因是：
hugo的格式和docusaurus所吃的markdown樣式不太一樣，即使我寫了很多臨時 Python 腳本做出轉換，但還是很難覆蓋到全部的文章順便遮蓋一些我不想讓大家看到的文章
未來我會專注在這裡持續寫作與整理。
寫作心態與未來規劃
搬家後的好處是明顯的：集中管理 is 讚！ 寫作更有條理。對我來說，寫作不僅是整理思緒，也是一種自我學習的方式，更方便回顧與複習。人總是要透過輸出才能夠確認自己是否真的學會了
小君曰：這篇文章用 ChatGPT 幫忙生成草稿我在下去補充、還有幫忙寫一些搬家腳本和自動化腳本...AI 真方便 XD