Skip to content
所有分類

tech

89 篇文章
tech deep-dive

從外面連回家裡的 Mac:Cloudflare Tunnel 與 2026 的替代方案

想從外面連回家裡的 Mac,2026 年的標準答案有兩個:要公開分享或瀏覽器免裝 client,用 Cloudflare Tunnel;自己用、要簡單,用 Tailscale。本文比較兩者、加上 ZeroTier / Pangolin / NetBird 等替代方案,說明 2026 年 Cloudflare 推的『遠端託管 tunnel』為什麼讓設定變簡單。

tech

Warp:從現代終端機到 Agentic Development Environment

Warp 從一個用 Rust 打造的現代終端機,演化成整合 AI Agent 的開發環境(ADE),2026 年 4 月開源,目前擁有 70 萬開發者用戶。

tech project

DeerFlow:字節跳動開源的超級代理框架,把 Agent 做成可長跑的研究系統

DeerFlow 是字節跳動開源的 Super Agent Harness,基於 Python 3.12 + LangGraph,透過沙箱、長期記憶、子代理、技能與訊息閘道協調長時任務。2026 年 2 月登上 GitHub 趨勢榜第一,目前超過 63,000 星,支援 Telegram/Slack/飛書等 IM、Claude Code 整合與多種搜尋後端。

tech guide

YouTube to NotebookLM 擴充套件怎麼做到的?拆解逆向工程與跨 Tab 架構

NotebookLM 沒有官方 API,這個擴充套件靠的是逆向工程 Google 內部 batchexecute RPC + DOM scraping + 跨 Tab 訊息傳遞,三者組合完成整個流程。

tech debug

本機開發 AI Backend API 永遠回空資料:Cookie Domain 隔離問題

主後端跑在遠端 HTTPS,auth_token cookie 的 domain 是遠端,瀏覽器不會把它送到本機 AI backend,導致 API 認為未登入。

tech guide

Cloudflare Workers AI binding 全貌:不只是 run()

env.AI 這個 binding 不是只有 run()。它還掛了 toMarkdown(文件轉 Markdown)、autorag(託管 RAG)、gateway(外部 provider 代理)、models(metadata 查詢)。認識這四組方法,才能在 Workers 上把 Cloudflare 當完整的 AI 平台用。

tech guide

Better Agent Terminal:把多個專案的 Terminal 和 Claude Code Agent 收進同一個視窗

Better Agent Terminal (BAT) 是一個 Electron 桌面 app,把多個專案的 workspace、terminal、以及 Claude Code Agent 整合到同一個視窗,解決開一堆 iTerm 分頁、Agent 沒有好 GUI 容器的日常痛點。MIT License,macOS / Windows / Linux 都能裝。

tech guide

Codex 和 Claude Code 的設定檔重複維護問題:用 symlink 一次解決

Claude Code 不認 AGENTS.md,Codex 不認 CLAUDE.md,多人協作項目被迫維護兩份一樣的設定。解法:把 CLAUDE.md 做成 AGENTS.md 的 symlink,只維護一份。

tech guide

AI Agent 的全域 Skills 要放哪裡?.claude、Codex Skills、AGENTS.md 的分工

Skill 路徑通常是 runtime-specific,跨 agent 真正穩的是 AGENTS.md;個人共用能力放各自 agent 支援的全域目錄,專案 workflow 放 repo 內。

tech guide

code-review-graph:用知識圖譜讓 AI Code Review 省下 8 倍 Token

code-review-graph 用 Tree-sitter 解析 codebase 建立持久化知識圖譜,追蹤變更的爆炸半徑,只把真正相關的 context 餵給 AI,號稱平均省下 8.2 倍 token。

tech guide

GitBook:把文件變成產品的文件平台

GitBook 是一個以 Git 為底層的文件平台,支援 Markdown 編輯、版本控制、多人協作。適合技術文件、API docs、內部知識庫。免費方案對個人和小團隊夠用。

tech guide

NVIDIA DGX Spark:桌上型 AI 超級電腦,把一個 petaFLOP 塞進你的桌面

NVIDIA DGX Spark 搭載 GB10 Grace Blackwell Superchip,128GB 統一記憶體,提供 1 petaFLOP FP4 算力,售價約 $3,999 美元起。適合開發者在本地跑 200B 參數模型、fine-tune 70B 模型,是目前最容易入手的 NVIDIA AI 開發平台。

tech guide

文件平台選擇指南:GitBook、Docusaurus、Mintlify 和其他七個選項

九個主流文件平台的定位、優缺點、適用場景和實際使用案例。選擇邏輯:開源專案選 Docusaurus/VitePress,API docs 選 Mintlify/ReadMe,企業內部選 Confluence,快速上手選 GitBook。

tech guide

Claude Code:Anthropic 終端機 AI Coding Agent 完整介紹

Claude Code 是 Anthropic 的 agentic coding 工具,跑在終端機、IDE、Slack、GitHub 和 Web 上。核心擴充機制有六層:CLAUDE.md(永駐 context)、Skills(按需工作流程)、Hooks(確定性自動化)、Subagents(隔離委派)、MCP(外部工具連接)、Agent Teams(多 agent 協作)。

tech project

Codex CLI:OpenAI 開源終端機 Coding Agent 完整介紹

Codex CLI 是 OpenAI 的開源終端機 coding agent,用 Rust 打造,支援 MCP、subagents、圖片輸入、code review。搭配 codex-1(o3 優化版)或 GPT-5-Codex 模型,可在本地端直接讀寫、執行程式碼。

tech project

Gemini CLI:Google 開源終端機 AI Agent 完整介紹

Gemini CLI 是 Google 開源的終端機 AI agent(Apache 2.0),免費帳號每分鐘 60 次、每天 1,000 次請求。支援 1M token context window、Google Search grounding、MCP 擴充,並整合 Gemini Code Assist 與 VS Code。

tech project

OpenCode:開源 AI 終端機 Coding Agent 完整介紹

OpenCode 是用 Go 打造的開源 AI coding agent(95K+ GitHub stars),內建 TUI 介面、支援 75+ LLM、LSP 整合、Vim 風格編輯器、SQLite session 管理。免費、不需訂閱,可接本地或雲端模型。

tech project

Pi Coding Agent:極簡主義的開源終端機 Coding Harness

Pi 是 Mario Zechner 用 TypeScript 打造的極簡 coding agent,只有 4 個核心工具(read、write、edit、bash)和 300 字 system prompt。透過 Extensions、Skills、Prompt Templates 擴充,跑在 Bun runtime 上。Ollama 已內建 `ollama launch pi` 一鍵啟動。

tech guide

Claude Code Spinner Verbs:從原始碼挖出 185 個狀態動詞的完整清單

Claude Code 處理請求時會從 185 個預設動詞中隨機顯示(如 Thinking、Brewing、Clauding),完成時從 8 個動詞中選一個搭配耗時。可透過 settings.json 的 spinnerVerbs 設定自訂,支援 replace 和 append 兩種模式。本文所有資料來自 cli.js 原始碼實際驗證。

tech guide

gstack — Garry Tan 把 Claude Code 變成虛擬工程團隊的 20 個 Skills

gstack 是 Garry Tan 開源的 Claude Code skills 工具集,用 20 個專業 skill 把一個人變成一整個工程團隊——從產品規劃、設計審查、code review、QA 到部署,全部自動化。

tech guide

AI Agent 繞過 Cloudflare 反爬蟲完整指南:從踩坑到自建 MCP Server

標準 Playwright 無法通過 Cloudflare 驗證。playwright-extra + stealth 和 nodriver 都能繞過,最終包成 MCP server 讓 AI agent 自動使用。

tech guide

「推薦下一條」和「推薦類似的」不是同一件事 — RAG 推薦系統的意圖消歧

攀岩 RAG 系統中「推薦下一條路線」(progression)和「推薦類似路線」(similarity)被同一個 hasSimilarRouteIntent() 函式混為一談,導致推薦品質崩壞。解法是 Regex Fast Path + LLM Fallback 的兩階段意圖分類。

tech guide

RAG 多實體查詢:當使用者一次丟五條路線,系統只看到第一條

RAG 系統的 extractRouteReference() 用 for...return 只抓第一個匹配,使用者給了五條完攀紀錄卻只用到一條。解法從 rule-based 多實體擷取、user profile aggregation 到 embedding centroid,分三層遞進實作。

tech deep-dive

當 Vector Search 把名字當難度搜:RAG 系統的 Attribute Conflation 問題

查詢「美人照鏡 5.11b,推薦類似難度路線」,結果回來的全是名字像的路線而不是難度像的。根因是 dense embedding 把多個屬性壓進同一個向量,名稱的稀有性壓過了難度信號。解法:metadata pre-filter + query rewriting + score fusion 三層防線。

tech guide

Biome:用 Rust 取代 ESLint + Prettier

Biome 一個工具做 ESLint + Prettier 兩個工具的事,速度快 10-20 倍,設定簡單很多。DaoDao 在整個 monorepo 用它,lint + format 一次過。

tech guide

AEO 答案引擎優化指南 — 讓 AI 搜尋引擎引用你的內容

AEO(Answer Engine Optimization)是針對 AI 搜尋引擎(Perplexity、ChatGPT Search、Google AI Overview)的內容優化策略。核心是讓你的內容成為 AI 最容易引用的「答案來源」,而不只是搜尋結果中的一個連結。

tech guide

部落格 SEO 優化完整指南 — 從 meta tags 到結構化資料

SEO 不只是關鍵字,結構化資料(JSON-LD)、Open Graph、hreflang、robots.txt 這些技術面優化才是讓搜尋引擎真正理解你內容的關鍵。本文以 Astro 部落格為例,完整走一遍實作。

tech guide

BullMQ:Node.js 最成熟的 Redis-backed 任務佇列

BullMQ 是 Node.js 生態裡最成熟的任務佇列,底層用 Redis,支援優先級、重試、排程、延遲任務。島島用它處理通知發送和實踐自動完成排程。

tech guide

Celery:Python 生態裡分散式任務佇列的標準解法

Celery 是 Python 最主流的分散式任務佇列,用 Redis 或 RabbitMQ 當 broker,讓耗時工作跑在背景。島島的 AI 服務用它處理 LLM 回饋生成等非同步任務。

tech debug

Claude Code Global Skills 新 Session 找不到?釐清 Skill Discovery 機制與排查方法

Global skills 放在 ~/.claude/skills/ 但新 session 或 Desktop App 看不到?問題通常不是檔案不存在,而是 skill 描述沒被載入 context。本文釐清 CLI vs Desktop App 的差異、settings.json 的角色,以及最穩定的解法。

tech guide

ClickHouse:當 PostgreSQL 的分析查詢開始變慢,你需要 OLAP

ClickHouse 是欄導向 OLAP 資料庫,掃幾億行只要幾秒,島島用它記錄使用行為事件,供 AI 推薦引擎的特徵工程使用,讓 PostgreSQL 專心處理交易型資料。

tech guide

Cloudflare D1:跑在邊緣的 SQLite 關聯式資料庫

D1 是 Cloudflare 的 serverless SQLite 資料庫,直接綁定 Workers,支援完整 SQL(JOIN、transaction)、自動備份。適合中小規模的關聯式資料需求,NobodyClimb 把它當主資料庫用。

tech guide

Cloudflare KV:全球邊緣的 Key-Value Store

KV 是 Cloudflare 的全球分散式 key-value store,讀取從最近的邊緣節點回應,延遲極低。適合快取、feature flag、暫態資料,但寫入是最終一致性。

tech guide

Cloudflare R2:零 Egress 費用的 S3 替代方案

R2 是 Cloudflare 的物件儲存,S3 相容 API、零 egress 費用、Workers 原生 binding。媒體密集的應用不用再擔心流量帳單。

tech guide

Cloudflare Workers:不是 Lambda,不是容器,是 V8 Isolate

Cloudflare Workers 用 V8 Isolate 取代容器,沒有 cold start,全球邊緣部署,透過 Bindings 接 D1、R2、KV、AI。適合 API、SSR、輕量後端,不適合長時間執行的任務。

tech guide

Docker 實務入門:從開發到部署的容器化

Docker 讓你把應用程式和它的環境打包在一起,消除「在我電腦上可以跑」的問題。搭配 multi-stage build 和 Compose,是現代後端部署的基本配備。

tech guide

Expo + React Native:一套程式碼跑 iOS 和 Android,實際上是什麼體驗

Expo 讓 React Native 開發從「環境設定地獄」變成可以直接寫邏輯的狀態。Expo Router 帶來 file-based routing,讓 web 開發者轉移成本更低。島島和 NobodyClimb 都用它跨 iOS/Android。

tech guide

Express.js:Node.js 後端的預設答案,以及它為什麼還值得選

Express 是 Node.js 最成熟的 Web framework,middleware 生態完整、學習資源豐富。搭配 TypeScript 和清楚的分層架構,在 2026 年仍然是有理由選的選項。

tech guide

FastAPI:Python AI 服務的標準答案

FastAPI 是基於 Python type hint 的現代 Web framework,自動生成 OpenAPI 文件、原生 async 支援、效能接近 Node.js。AI/ML 服務的首選,也是 Python 後端裡最值得學的框架。

tech guide

GitHub Actions:CI/CD 的入門與 Monorepo 策略

GitHub Actions 是目前最省設定成本的 CI/CD 工具,適合中小型專案。Monorepo 的關鍵是用 path filter 讓只有受影響的 app 觸發 build。

tech guide

Hono:為 Edge Runtime 而生的輕量 Web Framework

Hono 是專為 Cloudflare Workers、Deno、Bun 等 edge runtime 設計的 Web framework,比 Express 輕一個數量級,原生支援 Web Standard API,是 edge 環境下的首選。

tech guide

Next.js 15 + App Router:Server Components 和 use cache 實際上在做什麼

Next.js 15 + React 19 的 App Router 把渲染責任從客戶端移到伺服器,use cache 讓快取邏輯直接跟資料綁在一起而不是散在 fetch 選項裡。島島和 NobodyClimb 都選它,原因很務實。

tech guide

@opennextjs/cloudflare:把 Next.js 跑在 Cloudflare Workers 上

@opennextjs/cloudflare 讓 Next.js 15 App Router 部署到 Cloudflare Workers,動態 SSR 走 Worker,靜態資源走 Cloudflare Assets。沒有 server 管理成本,但有明確的功能限制。

tech guide

PM2:Node.js 程序管理的實用選擇

PM2 讓 Node.js 應用在 server 上持續跑,掛掉自動重啟,可以開 cluster 模式用滿 CPU,Log 也幫你管好。部署在 VM 或 VPS 的 Node.js 應用幾乎都需要它。

tech guide

Prisma ORM:TypeScript 專案的型別安全資料庫存取

Prisma 用 schema-first 設計讓資料庫 migration 有版本控制、查詢有完整 TypeScript 型別、關聯查詢直覺。代價是學習曲線和 ORM 的固有限制,但對多數 TypeScript 專案是值得的換法。

tech guide

React Hook Form + Zod:表單處理的最佳組合

React Hook Form 處理表單效能,Zod 定義驗證 schema,兩者搭配讓表單開發幾乎不需要寫樣板程式碼。在 monorepo 裡共用 Zod schema,前後端驗證邏輯一份就夠。

tech guide

Redis 入門:快取、Session、Pub/Sub 一次搞懂

Redis 是 in-memory key-value store,快到不像話,島島用它同時扛快取、Session、BullMQ 任務佇列三個職責,一台 Redis 幹三件事。

tech guide

shadcn/ui:不是套件,是複製貼上的元件原始碼

shadcn/ui 不是 npm 套件,它把元件原始碼複製到你的專案,你完全擁有這些程式碼。島島用它建立 packages/ui 元件庫,讓三個 Next.js app 共用同一套 UI。

tech guide

TailwindCSS:utility-first 不只是風格偏好,是一種 CSS 管理策略

TailwindCSS 解決的核心問題是 CSS 的全域命名汙染和死碼問題。utility class 讓樣式跟元件放在一起,build 時自動移除沒用到的 class,生產環境的 CSS bundle 通常只有幾十 KB。島島和 NobodyClimb 都用它做 web 端樣式。

tech guide

Tamagui:React Native 的 UI framework,為什麼 NobodyClimb 選它而不是 NativeWind

Tamagui 是針對 React Native 設計的 UI framework,有完整的 design token 系統和 theme 支援,編譯時期優化讓樣式計算移到 build time。NobodyClimb 選它而不是 NativeWind,主要是因為跨平台的 token 系統更完整。

tech guide

TanStack Query:Server State 的標準解法

自己用 useState + useEffect 管 API 資料,等於重造輪子還造得比較差。TanStack Query 處理快取、背景更新、loading/error 狀態,讓你專注在 UI 邏輯。

tech guide

Turborepo + pnpm workspaces:Monorepo 的標準答案

Turborepo 解決 monorepo 的 build 速度問題,pnpm workspaces 解決依賴共用問題。兩者搭配是目前 JS/TS monorepo 的最佳選擇。

tech guide

Zod:TypeScript 的 Runtime 型別驗證

TypeScript 的型別只存在編譯期,執行時消失。Zod 讓你在 runtime 驗證外部資料,同時推斷出 TypeScript 型別,一個 schema 兩件事都搞定。

tech guide

Zustand:React 最輕量的全域狀態管理

不需要 Provider、不需要 reducer,幾行就能設定好全域狀態。NobodyClimb 用它管 auth 和 UI 狀態,搭配 TanStack Query 處理 server state。

tech guide

一個人的全端團隊:從 OpenSpec 到自動部署的 AI 驅動開發流程

用 OpenSpec 把需求拆成工程任務,Claude Code 實作,hooks 自動格式化和保護,commit 前本地 review,PR 上三個 AI reviewer 平行審查,merge 後自動部署。整套流程讓一個人能維護六個子專案的品質。

tech guide

Claude Code Hooks 完整指南:用事件驅動控制 AI 的每一步

Hook 是 Claude Code 的事件系統。在 AI 執行工具前後、送出 prompt 時、結束任務時自動觸發 shell command、HTTP 請求或 LLM 判斷。用來擋住危險操作、自動審核、注入上下文、記錄 audit log。

tech guide

Claude Code Scheduled Tasks:讓 AI 在雲端自動幫你做事

Scheduled Task 是 Claude Code 的雲端排程系統。設定 cron、指定 repo、寫好 prompt,AI 就會定時自動執行——掃 issue、審 PR、跑檢查、開 PR,電腦關了也會跑。

tech guide

Claude Code Skill 完整指南:把重複的工作流程變成一句指令

Skill 是寫給 AI 看的 SOP。一個 markdown 檔案定義步驟,Claude 照著執行。不用寫程式,不用學框架,只要把「有經驗的人會怎麼做」寫成步驟就好。

tech guide

用 Claude Code Skill 把 Debug 對話變成 GitHub Issue:/file-bug-issue 的設計

Debug 到一半發現修不了?用 /file-bug-issue 直接把對話中的錯誤分析、重現步驟、已嘗試的方案打包成一個結構完整的 GitHub issue。搭配 Remote Agent,還能讓 AI 自動接手修復。

tech guide

讓 AI 自己接 Issue、寫 Code、開 PR:用 Claude Code Remote Agent 做到半夜自動開發

用 Claude Code 的 Scheduled Remote Agent,每 2 小時自動掃描 GitHub issues、實作功能、開 PR、修 review feedback。人類只需要寫 issue 和按 merge。搭配自製的 /publish-tasks skill,把 OpenSpec 的工程任務一鍵發成 GitHub issues。

tech guide

Claude Code 的三層品質防線:Hook、Skill、指令檔

Hook 是自動化安全網(擋住壞 commit),Skill 是互動式工作流程(跑檢查 + 自動修),指令檔(CLAUDE.md / AGENTS.md)是行為指引。三層各自獨立,組合起來讓 AI agent 在 commit 前自動完成 lint、typecheck、build 檢查。

tech guide

Code Review Comment 怎麼分類?從 Conventional Comments 到 AI Review 工具的分類體系

主流分類系統有三種路線:Conventional Comments(標籤制)、Google 嚴重度前綴(Nit/Optional/FYI)、SonarQube 四象限(Bug/Vulnerability/Code Smell/Hotspot)。AI review 工具各自發展出不同分類,但核心維度收斂在正確性、安全、效能、可維護性四大塊。

tech guide

用 Cloudflare Workers AI 把前端 mock 變成真的:action-maker AI 整合全記錄

把 action-maker 從假資料升級為 Cloudflare Workers AI 即時生成,架構拆成 Worker(純 AI)、Server(存資料)、Frontend(串接),踩了 Qwen3 thinking block 和 Workers AI response 格式兩個坑。

tech guide

Node.js image 弱掃誤判?先分 app 套件與 npm 內建套件

Node.js image 的弱掃結果不能只看套件名稱,先分清楚是專案依賴,還是 base image 內建 npm 自己帶的相依套件,才不會修錯地方。

tech guide

弱掃是什麼?用 Trivy 快速建立 Docker 與套件掃描觀念

弱掃不是只為了交報告,而是幫你提早知道系統裡有哪些已知風險。這篇用 Trivy 當例子,快速介紹弱掃在掃什麼、常見結果怎麼看,以及該怎麼開始。

tech guide

把爬蟲腳本做成 MCP Server,讓 Claude 直接用

用 FastMCP 把本地 Python 腳本包成 MCP Server,讓 Claude Code 可以直接呼叫,不再需要手動跑 pipeline。

tech debug

MCP Tool 回傳 1M 字元:search_local_jobs 的 token 爆炸問題

MCP tool 回傳 description 欄位導致 1033 筆職缺超過 token 上限,改成預設不回傳 description 並加上分頁就解決了。

tech guide

docker restart 不會重新套用 volumes —— bind mount 失效排查記錄

docker restart 不會重建容器,volumes 設定改了必須用 docker-compose down && up 才會生效。

tech guide

Claude Code Permission Modes 全解析:從預設到 Auto Mode 的五種權限模式

Claude Code 有五種權限模式:default(逐步確認)、acceptEdits(自動接受編輯)、plan(唯讀規劃)、auto(AI classifier 背景審查)、bypassPermissions(YOLO 全跳過)。用 Shift+Tab 切換,搭配 settings.json 精細控制。auto mode 是最佳平衡點——既不用每步確認,又有安全防護。

tech guide

Claude Code /loop:把 AI 變成背景 worker 的排程功能

/loop 是 Claude Code 的原生 cron 功能,自然語言設定排程,讓 Claude 在背景持續監控、自動修 PR、定期執行任務。

tech guide

nginx 502:跨 Compose 專案的容器 DNS 解析踩坑

跨 Compose 專案時 service name 不可解析,要加 network alias 才能讓 nginx 找到容器。

tech guide

為 GitHub Copilot CLI 安裝並驗證 Superpowers:實作、診斷與驗證

紀錄在本機為 Copilot CLI 安裝 Superpowers(DwainTR 打包)、遇到安裝後看不到技能的診斷流程,以及最終解法和實用建議。

tech guide

Docker DNS 解析:container_name vs network alias

跨 Compose 專案只能靠 container_name 或 network alias 解析,而 alias 才支援 scale。

tech guide

nginx 重啟後 Cloudflare 一直回 502,但 origin 明明是正常的

nginx 重啟期間短暫出錯,Cloudflare 偵測到 origin 不健康後停止轉發請求,自己回傳 502。localhost 打 origin 是 200,nginx access log 空白是關鍵線索。等 Cloudflare 自動 re-check 即可恢復。

tech guide

用 nginx conf.d 管理多服務 reverse proxy:以島島為例

單一 nginx.conf 隨服務增加變得難以維護,用 include conf.d/*.conf 按服務拆分是標準解法。

tech guide

nginx 第一個請求必定 502,之後全部正常

nginx 用 set $variable 做動態 upstream 時,DNS 快取每 30 秒過期,第一個請求因無可用 IP 而 502。升到 nginx 1.27.3 改用 upstream + resolve 參數,DNS 在背景非同步更新,根治問題。

tech guide

用 SSH config alias 下載 VPS 檔案

設定好 SSH config 後,scp 可以直接用 alias,不用打完整 IP

tech guide

Ghostty 與 cmux:現代終端機的選擇指南

Ghostty 是快速、原生的通用終端機;cmux 是基於 Ghostty、專為 AI coding agents 設計的終端機。不是競品,是不同層級的工具。

tech guide

Cloudflare Free Plan 設維護頁:Custom Error Pages 不能用,改用 Worker

Cloudflare Custom Error Pages 需要付費方案,Free Plan 可改用 Worker inline HTML 攔截 5xx。

tech guide

用 Git Conditional Includes 管理個人與工作帳號

用 includeIf + SSH Host alias,讓 git 自動依路徑切換帳號,不再手動切換。

tech debug

Astro + Cloudflare Workers:Native Module 在 Prerender Route 也會讓 Build 炸掉

即使 route 有 prerender = true,Cloudflare Workers 的 Rollup 還是會嘗試打包 native module,導致 build 失敗。把需要 native module 的工作移到 postbuild script 才是正解。

tech debug

Astro Scoped CSS 不套用到 MDX 渲染的內容

Astro scoped CSS 會加 scope hash,但 <Content /> 渲染的 MDX 元素沒有這個 hash,導致所有 prose 樣式失效。

tech guide

對話即文件:用 Claude Code 把 Debug 過程直接變成文章

Debug 完直接說「把錯誤寫成文章」,Claude Code 會從對話裡萃取內容,套用模板、生成 frontmatter、commit 到 repo。不需要額外寫任何東西。

tech debug

Cloudflare Workers 綁定自訂網域的正確寫法

wrangler.jsonc 的 routes 用 custom_domain: true,pattern 只填 hostname,不加 /*

tech deep-dive

島島(DaoDao)技術架構全覽:Monorepo、多語言後端與 AI 推薦系統

Next.js + Expo 前端、Node.js + Python 雙後端、PostgreSQL + Redis 核心架構,加上社交通知系統與 LLM 推薦引擎,島島如何用現代技術棧打造學習社群平台。

tech deep-dive

NobodyClimb:用 Cloudflare 全端打造攀岩社群平台

一個攀岩社群平台,從 Web、Mobile 到 AI 問答全部跑在 Cloudflare 上,沒有獨立伺服器。

tech deep-dive

NobodyClimb AI 架構:在 Cloudflare Workers 上打造 20 節點 RAG Pipeline

用 Cloudflare Workers AI(gemma-3-12b-it + bge-m3)打造可動態組裝的 RAG pipeline,14 個基礎 step + 6 個 LangGraph 專屬節點,三種策略圖(Baseline / Agentic / Plan-Execute)動態切換。

tech guide

Astro 部落格換模板前要知道的事

換模板 = 換整個專案底層;先搞清楚自己要什麼,再選 AstroPaper / Cactus / AstroWind

tech guide

這個部落格用了哪些工具

Astro + Cloudflare 全家桶,靜態優先、邊緣運算、零維運成本