快速開始

如果你等不及了，可以直接透過以下指令克隆並執行 基本範例：

npx gitpick TanStack/router/tree/main/examples/react/start-basic start-basic
cd start-basic
npm install
npm run dev

npx gitpick TanStack/router/tree/main/examples/react/start-basic start-basic
cd start-basic
npm install
npm run dev

如果想使用其他範例，只需將上述指令中的 start-basic 替換為下方列表中你想要的範例 slug。

克隆完想要的範例後，請回到 基礎教學 指南，學習如何使用 TanStack Start！

TanStack Start 提供了大量範例供你入門。從以下範例中選擇一個開始吧！

• 基本範例 (start-basic)
• 基本範例 + 認證 (start-basic-auth)
• 計數器 (start-counter)
• 基本範例 + React Query (start-basic-react-query)
• Clerk 認證 (start-clerk-basic)
• Convex + Trellaux (start-convex-trellaux)
• Supabase (start-supabase-basic)
• Trellaux (start-trellaux)
• WorkOS (start-workos)
• Material UI (start-material-ui)

每個範例都嵌入了 Stackblitz 預覽功能，方便你找到合適的起點。

若要快速部署範例，只需點擊範例頁面上的 Deploy to Netlify 按鈕，即可將範例克隆並部署至 Netlify。

若要手動克隆範例並部署至其他平台，請使用以下指令，並將 EXAMPLE_SLUG 替換為上方列表中你想要的範例 slug：

npx gitpick TanStack/router/tree/main/examples/react/EXAMPLE_SLUG my-new-project
cd my-new-project
npm install
npm run dev

npx gitpick TanStack/router/tree/main/examples/react/EXAMPLE_SLUG my-new-project
cd my-new-project
npm install
npm run dev

克隆或部署範例後，請回到 基礎教學 指南，學習如何使用 TanStack Start！

雖然這些範例並非專為 Start 設計，但可能有助於你更了解 TanStack Router 的運作方式：

• 快速入門 (基於檔案)
• 基本範例 (基於檔案)
• 完整功能展示 (基於檔案)
• 完整功能展示 + React Query (基於檔案)
• 位置遮罩
• 認證路由
• 滾動恢復
• 延遲載入資料
• 導航攔截
• 視圖過渡
• 搭配 tRPC
• 搭配 tRPC + React Query