Skip to content
所有分類

tech

529 篇文章
techguide

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

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

techguide

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

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

techguide

FastAPI:Python AI 服務的標準答案

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

techguide

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

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

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

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

techguide

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

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

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

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

techguide

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

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

techguide

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

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

techguide

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

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

techguide

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

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

techguide

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

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

techguide

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

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

techguide

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

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

techguide

TanStack Query:Server State 的標準解法

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

techguide

Turborepo + pnpm workspaces:Monorepo 的標準答案

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

techguide

Zod:TypeScript 的 Runtime 型別驗證

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

techguide

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

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

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

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

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

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