給會用 SSG 框架的前端與後端工程師

整合好 AI 的個人部落格,你只要專心寫內容。

Threadspage 是一套 Nuxt 3 部落格 boilerplate。就像 Laravel 替你備好 auth 和 queue,AI 分身、限流、多語系、SEO 和整套 UI 都先寫好了。用你自己的 API key,主機跑 Vercel Hobby 免費方案;repo 附 CLAUDE.md,想改哪裡,交給 Claude Code。

一次買斷,Threadspage 不收月費。主機免費,AI 用量直接付給供應商。

Volume II — 困局

自己刻部落格,難的從來不是寫文章。

很多工程師都動手架過自己的部落格,然後卡在這幾件事。

週末都在接管線

i18n、sitemap、RSS、OG 圖、深色模式、結構化資料……還沒寫第一篇,週末已經過完了。

想接 AI,又怕帳單

公開的 AI 端點誰都能打。限流、client IP 怎麼取才不會被偽造、問題長度上限、沒 key 時怎麼降級,每一項都得自己設計。

架好了,卻沒在寫

時間都花在改程式和換框架,部落格最後停在 hello world。

Volume III — 功能

像 Laravel,該有的都寫好了。

Laravel 替你處理 auth、queue、rate limit,讓你專心寫商業邏輯;Threadspage 替你的部落格處理 AI、限流、多語系和 GEO,讓你專心寫內容。

Content pipeline
# clone 下來,先在本機看看
$ npm run seed:examples
→ 放入範例內容,三種設計風格一行切換 ✓
$ npm run new:post -- --title="Hello"
→ 建立文章草稿(Markdown,Zod schema 驗證) ✓

# build 時自動完成
→ 建立 AI 分身的檢索索引 ✓
→ 產生 JSON-LD · llms.txt · sitemap · RSS ✓

# git push,Vercel 就部署好了

AI 分身,用你自己的 key

首頁的 Terminal 根據你寫過的文章回答訪客。Claude 或 OpenAI 設定一行切換;沒設 key 時自動顯示 demo 回覆,網站照常運作。

限流和防護都寫好了

每個 IP 10 分鐘 20 次的滑動視窗、偽造不了的 client IP 解析、問題長度上限,錯誤訊息不外洩上游細節。pre-commit 還會用 secretlint 掃金鑰。

幾乎不花錢

頁面在 build 時靜態產生,個人部落格用 Vercel Hobby 就夠。每題只送最相關的段落,作者介紹走 prompt caching,文章再多,每題成本也大致固定。

用 Claude Code 改得動

repo 附 CLAUDE.md,寫好專案規則與驗證指令;內容有 Zod schema 把關。Nuxt 3、Tailwind v4、PrimeVue,都是你熟的東西。

Volume IV — 如何開始

付款到上線,就是 Git 流程。

你需要一個 GitHub 帳號和一個 Vercel 帳號。Fork 之後它就是一個普通的 Nuxt 專案,用你習慣的編輯器和終端機開發。

  1. STEP 01

    購買

    用 Stripe 結帳,卡號直接交給 Stripe 處理。付款後填上你的 GitHub 帳號。

  2. STEP 02

    接受邀請

    系統會自動寄出 GitHub 的邀請信,按下接受。

  3. STEP 03

    Fork 並 clone

    Fork 成你的私有 repo,clone 下來 npm install、npm run dev,本機就跑起來了。

  4. STEP 04

    部署到 Vercel

    在 Vercel 匯入你的 fork,個人部落格用 Hobby 方案就夠。之後 git push 就是部署。

  5. STEP 05

    綁定網域

    在 Vercel 加上你的網域,照畫面指示設定 DNS。

  6. STEP 06

    寫第一篇

    在編輯器寫 Markdown,或用 Pages CMS 在瀏覽器寫;commit 之後網站自動重建。

Volume V — 上線之後

很多事,一行指令就能做。

網站上線後,這些工作都有現成的指令。

  • npm run import:youtube --url="https://youtu.be/VIDEO_ID"

    把 YouTube 影片轉成文章,影片會嵌在文章裡。

  • npm run i18n:translate

    把文章翻成其他語言,每種語言有自己的網址。

  • npm run new:post -- --title="My first post"

    建立一篇新文章的草稿。

還有更多指令,文件裡都有。匯入影片和翻譯會用到你自己的 AI API key。

想改網站本身?

repo 附 CLAUDE.md,寫好專案規則、fork 契約和每種改動該跑的驗證指令。告訴 Claude Code 你想改什麼,它知道該動哪些檔案,改完也有測試可以跑。

真實範例

兩個用 Threadspage 架的網站。

都是現在正在使用的網站,點進去就能看。

也可以直接問問看。

下面這個 Terminal 用的是本站的內容。你的網站上線後,訪客看到的也是這樣的介面。

terminal — threadspage
$

Volume VI — 比較

從零刻一個,還是從做好的開始?

兩種做法都能得到一個部落格,差別在你的時間花在哪裡。

自己從零刻

先接好幾個週末的管線

  • i18n、SEO、OG 圖、RSS 都要自己接
  • AI 端點的限流與成本防護要自己設計
  • UI、深色模式、RWD 從空白開始
  • 基礎建設做完,文章還沒開始寫

管線交給 boilerplate,你的時間留給寫作。

定價 · 買斷版

一次買斷,完全屬於你 的 boilerplate。

給想要一個整合 AI 的個人部落格、又不想從零刻的工程師。附完整原始碼,可以自由修改,內容和網域都是你的。

Volume VII — 釋疑

常見問題

買之前,你可能想知道的事。

需要什麼技術背景?

會用 Git 和 npm、寫過任何一個元件式框架就夠了。它是一般的 Nuxt 3 專案:Nuxt Content v3 管 Markdown、Tailwind CSS v4 管樣式、PrimeVue 做元件,部署在 Vercel。只想寫文章、不改程式也可以,直接編輯 Markdown,或用 Pages CMS 在瀏覽器寫。

真的幾乎免費嗎?會花到哪些錢?

Threadspage 一次買斷,不收月費。頁面是靜態產生的,個人、非商業用途的部落格用 Vercel 的免費 Hobby 方案就夠;網站若用於商業用途,Vercel 的條款要求改用付費的 Pro 方案。網域要自己買。AI 用你自己的 API key,按用量付給供應商:每題只送最相關的段落,作者介紹走 prompt caching;文章推薦用 Haiku 時,100 篇文章跑一次 build 大約 US$0.05,不想花錢也可以改用純演算法。建議先在供應商後台設好每月支出上限。AI 功能都是選用的,不開也不影響網站。

限流在 serverless 上準嗎?

內建的是 in-memory 滑動視窗(每個 IP 10 分鐘 20 次)。在 Vercel 上每個函式實例各自計數,屬於盡力而為:擋得住單一來源連續灌,擋不住大規模的分散式攻擊。所以防護分成四層:偽造不了的 client IP 解析、IP 限流、供應商後台的每月支出上限(真正的帳單天花板),以及沒設 key 時的 demo 回覆。需要全域硬上限的話,可以自己換成 Upstash 這類外部儲存。

用 Claude Code 改過程式,之後還能同步更新嗎?

可以,但要看改到哪裡。內容(content/)、靜態檔(public/)和設定檔(threadspage.user.ts)是你的,上游永遠不會動,同步更新不會衝突。改到核心檔案的話,按 Sync fork 時可能出現衝突,需要自己處理。repo 裡的 CLAUDE.md 寫了這條規則,Claude Code 動手前會先讀到。

和自己用 Astro、Hugo 架有什麼不同?

Astro 和 Hugo 都是很好的工具,但它們給你的是框架;Threadspage 給你的是一個做完的部落格。AI 分身和它的限流、每種語言各自的網址、JSON-LD 與 llms.txt、文章推薦、CMS 設定、三種設計風格,都已經接好並有測試。如果你享受從零打造的過程,自己刻會更有樂趣;如果你想把時間留給寫作,從這裡開始比較快。

用 Stripe 付款安全嗎?

Stripe 是國際上最普遍的線上金流之一。Amazon、Google、Shopify、OpenAI 這些大公司用它收款,很多一人公司和獨立開發者也用它。台灣比較常聽到的是綠界、藍新,Stripe 則是國外的主流選擇。它通過 PCI DSS Level 1 認證,這是信用卡產業最高等級的安全標準。你在 Stripe 的結帳頁輸入卡號,卡號直接交給 Stripe,不會經過、也不會存在 Threadspage 的伺服器。付款完成後,收據也由 Stripe 寄出。

授權範圍是什麼?

你可以把它用在自己的網站上,包含商業用途,也可以修改程式碼。不可以轉售、轉散佈、再授權,也不能當成模板或建站服務,拿來替別人架站。完整內容見購買與授權條款。

可以退款嗎?

本商品是數位內容,付款後即開始提供,所以不適用七天解除權。唯一的退款情況是:付款後經作者提供技術支援,你仍無法取得 boilerplate repo 的存取權並完成 fork,這時會全額退款。除此之外,購買後恕不退款。詳見購買與授權條款。

AI 真的會引用我嗎?

沒有任何工具能保證 AI 一定會引用你,那是模型那一端的決定。Threadspage 能做到的,是讓你的內容具備被引用的條件:結構化資料、AI 讀得懂的格式、自己的網域。就像 SEO,做好了不保證排第一,但沒做,被看到的機會就少很多。

Volume VIII — 聯絡

有任何問題,隨時來找我。

購買前想確認細節,或開通時遇到狀況,寫信或私訊我都可以,我會親自回覆。

由作者親自回覆 · 通常一個工作天內