Agent Skills Hub

react-patterns

實現 React 19 模式：React Compiler、Server Actions、表單與新 hook（如 'use'）。指導在 Actions 與 TanStack Query 之間進行變更處理的決策。

app-builder

全端應用程式建構編排器，分析自然語言需求以決定技術堆疊、建立專案架構並協調各領域專業代理人。

Parallel Routes Generator

實作 Next.js Parallel Routes 模態視窗以消除版面位移 (layout shifts)。適用於對話框、模態視窗與攔截路由 (intercepted routes)。

review-react-best-practices

為 React 和 Next.js 應用程式執行自動化、基於規則的效能與可靠性審核，涵蓋套件大小、瀑布式請求、渲染與資料擷取等面向。

roier-seo

AI 技術 SEO 稽核工具，執行 Lighthouse/PageSpeed 評測並自動修復網站效能、無障礙網頁與結構化資料等程式碼問題。

interaction-design

設計並實作微互動、動態設計與轉場效果。用於提升 UI 精緻度、實現載入狀態，並創造直觀、令人愉悅的用戶反饋體驗。

music-theory-visual-design

Harmonic Orbit 音樂理論應用程式的視覺設計與 UI 樣式指南，涵蓋字體、配色系統、間距、動畫及無障礙設計標準。

template-nextjs-moderne

為 Claude Code 提供的全方位 Next.js 15 開發與專案管理技能，包含 Supabase 整合、RBAC 權限管理及自動化品質驗證。

react-router-data-mode

使用 React Router 的資料模式 (data mode) 開發 React 應用程式，包含 createBrowserRouter、路由器 (RouterProvider)、loaders、actions、fetchers 與樂觀 UI 更新。

fumadocs-i18n

自動化設定 Fumadocs 的國際化 (i18n)。包含 Next.js 多語言路由、語言切換器、側邊欄篩選及內容結構配置。

react-ui-patterns

標準化的 React UI 模式，用於處理載入狀態、錯誤處理與資料擷取，確保一致的使用者體驗與穩固的元件架構。

chrome-devtools-mcp

Chrome DevTools MCP 伺服器，透過 Puppeteer 實現 AI 驅動的瀏覽器自動化、測試與除錯。支援輸入自動化、視覺截圖、效能追蹤與網路偵測。