core-principles

此技能作為 React 19 單頁應用生態系統中架構原則與開發標準的權威來源。專為軟體工程師與自動化代理設計，透過強制執行一致的專案結構、嚴謹的資料擷取模式與現代化工具實踐，確保程式碼庫的高品質。透過為功能開發維護明確的規範，能有效防止架構偏移，並簡化團隊使用 Vite、TypeScript、Biome 與 TanStack 生態系統時的入門流程。

• 標準化專案組織，區分應用外殼、路由邏輯、純 UI 元件與領域專屬的功能鉤子 (hooks)。

• 定義嚴格的代理執行規則，包含使用 Apidog MCP 進行強制性的 API 規格同步，以及透過 TanStack Query 進行的最佳化資料存取模式。

• 推廣 React 19 的編譯器友善開發實踐，包含自動記憶化 (auto-memoization)、純元件設計與現代化的伺服器變動 (mutation) 策略。

• 透過全面的測試需求確保品質，強調 React Testing Library、Vitest 以及使用 MSW 進行網路模擬。

• 提供明確的「完成」檢查清單，以標準化拉取請求 (Pull Request) 的準備工作與提交前的程式碼品質。

• 在初始化新功能或模組時使用此技能，以符合預先定義的資料夾結構與服務分層要求。

• 參考權威來源章節，獲取關於 React 19、Vite、Biome 與 TanStack 整合模式的相關文件。

• 務必呼叫 Apidog MCP 整合，作為 API 型別產生的主要來源，以維持後端規格與前端客戶端之間的型別安全性。

• 僅在編譯器限制明確要求時使用「use no memo」指令，並優先考慮標準的 React 19 自動記憶化功能。

• 確保所有新路由皆在 TanStack Router 的檔案導向系統內實作，並納入預取載入器 (prefetch loaders) 以優化導航效能。