Community程式設計與開發github.com

thanatornPik/nextjs-skill-app-workshop

使用此技能來協助開發者設定、執行或理解此 Next.js 專案。適用於入門問題,例如「專案如何設定」、「如何開始執行」、「使用什麼技術棧」或對程式碼庫不熟悉的人提出 Docker/Prisma 設定問題。

nextjs-skill-app-workshop 是什麼?

此技能專為協助開發新手快速上手此 Next.js 專案而設計,涵蓋從克隆儲存庫到在本地成功執行的完整流程。它會引導 AI 代理引用專案中的實際檔案(如 `package.json`、`.env.example`、`prisma/schema.json`、`Dockerfile` 和 `next.config.ts`)來提供準確的設定步驟。為確保安全性,該技能明確禁止在入門過程中執行任何破壞性資料庫指令(例如 `npx prisma db push`),並要求代理在使用 Docker 相關建議前,務必檢查 `Dockerfile` 和 `next.config.ts`。主要支援 Cursor 和 Claude Code 等 AI 代理平台,透過執行檢查腳本、提供安全指令清單(如 `npm install`、`npx prisma generate`),並根據使用者需求導向特定參考文件來發揮作用。

相容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/thanatornPik/nextjs-skill-app-workshop/tree/HEAD/.agents/skills/project-onboarding-guide

Installed? Explore more 程式設計與開發 skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

專案入門技能

協助新進開發者理解此專案,從克隆到能在本地成功執行。回答時必須參考 repo 中的實際檔案。

注意事項

  • 禁止猜測 package.json 中不存在的腳本
  • 在入門過程中不得使用破壞性資料庫指令,例如 npx prisma db push、npx prisma migrate deploy、npx prisma migrate dev
  • 若提及 Docker,必須同時檢查 Dockerfile 和 next.config.ts

設定步驟

請檢查並執行此腳本:.agents/skills/project-boarding-guide/scripts/check-onboarding.sh 若無法執行腳本,請自行檢查:

  • package.json
  • .env.example
  • prisma/schema.json
  • Dockerfile
  • next.config.ts

針對一般入門流程,僅建議使用以下安全指令:

npm install
cp .env.example .env
npx prisma generate
npm run lint
npm run dev

如果使用者直接詢問資料庫設定或種子資料,請閱讀此檔案 references/database-setup.md

專案注意事項

詳細資訊請參閱 references/project-notes.md

  • Next.js App Router + TypeScript
  • Prisma 使用自訂輸出至 generated/prisma
  • Prisma Client 從 generated 路徑匯入,而非 @prisma/client
  • Dockerfile 可能使用 .next/standalone;必須在 next.config.ts 中設定 output: "standalone"
  • 主要 UI 語言為泰語

輸出格式

若詢問關於設定或專案配置,請僅使用 assets/templates/setup-table.md 中的範本。

必須包含:

  • 簡短的概述
  • 設定步驟表格
  • 需要執行的指令
  • 此 repo 的注意事項

Individual skills in this repo

This repo contains 2 individual skills — each has its own dedicated page.

相關技能