← 回部落格
2 min readHiHi Digital

這個網站怎麼做的:Nuxt + 檔案式內容,不用資料庫也能很完整

Nuxt網頁開發SEO

既然要重做官網,乾脆把過程也寫成一篇文章。這個站的技術選擇其實處處藏著「一人公司」的務實考量:好維護、好部署、SEO 友善,而且不養多餘的基礎設施

為什麼是 Nuxt

我需要 SEO,所以純前端 SPA 直接出局——爬蟲看到一片空白可不行。Nuxt 的 SSR / SSG 讓每個頁面都回傳完整 HTML,搜尋引擎和分享預覽都吃得到。

行銷頁(首頁、服務、關於)走預渲染(prerender),純靜態、快到不行;部落格和作品集則用 SSR,新文章一發布就看得到,不用重新建置。

不用資料庫,用檔案

對一個內容量不大的官網來說,資料庫是過度設計。所以:

  • 部落格:每篇文章就是一個 Markdown 檔,YAML front matter 放標題、日期、標籤。
  • 作品集:同樣是 Markdown,多了 techlinks 等欄位。
  • 一組 CRUD API 讓我可以用程式新增/修改文章,但檔案本身永遠是唯一的真相來源。
# 新增一篇文章,就這麼簡單
curl -X POST https://hihi.digital/api/blog \
  -H "Authorization: Bearer $TOKEN" \
  -d '{ "title": "新文章", "body": "# 嗨" }'

聯絡表單:收到就通知我

沒有資料庫,那表單資料存哪?答案是——不存。表單送出後,API 直接把內容寄到我的信箱,同時推一則 Telegram 給我。我幾乎是即時就會收到,根本不需要登入任何後台去翻。

加上 honeypot 蜜罐欄位和簡單的速率限制,擋掉大部分機器人,乾淨俐落。

小結

技術沒有最好,只有最適合。對這個站來說,少即是多:少一個資料庫、少一套後台、少一份維運負擔,換來的是更專注、更好維護的成果。

這也是我幫客戶做系統時的一貫信念——不為了技術而技術,只解決真正的問題。

覺得有幫助,想聊得更深入?

不論是 AI 導入還是系統開發,歡迎找我聊聊。

預約免費諮詢 →