Hofmann
1958f8e17e
Starter template with requirements, architecture, frontend, backend, qa, deploy, and help skills — inspired by Alex Sprogis' guide. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
68 lines
2.6 KiB
Markdown
68 lines
2.6 KiB
Markdown
# Agent Skills Sample Project
|
|
|
|
> A starter template demonstrating Claude Code Agent Skills — based on the 7-skill system by Alex Sprogis.
|
|
|
|
## Tech Stack
|
|
|
|
| Layer | Tech |
|
|
|-------|------|
|
|
| Frontend | Next.js 16 · TypeScript · Tailwind CSS |
|
|
| Backend | Supabase (auth, database, storage) |
|
|
| Deploy | Vercel / self-hosted (Caddy) |
|
|
| AI Agent | Claude Code (Opus 4.6) |
|
|
|
|
## Skills System
|
|
|
|
This project ships with 7 Agent Skills that simulate a professional dev team:
|
|
|
|
| Skill | Role | Invoke |
|
|
|-------|------|--------|
|
|
| `/requirements` | Product Manager — clarifies specs, edge cases | User only |
|
|
| `/architecture` | Tech Lead — designs systems, picks patterns | User only |
|
|
| `/frontend` | Frontend Dev — builds UI/UX (sub-agent) | User only |
|
|
| `/backend` | Backend Dev — APIs, database, auth (sub-agent) | User only |
|
|
| `/qa` | QA Engineer — tests against acceptance criteria | User only |
|
|
| `/deploy` | DevOps — handles production deployment | User only |
|
|
| `/help` | Guide — explains workflow, answers questions | Both |
|
|
|
|
## Project Structure
|
|
|
|
```
|
|
├── CLAUDE.md # ← you are here
|
|
├── .claude/
|
|
│ └── skills/ # Agent Skills (the magic)
|
|
│ ├── requirements/ # /requirements
|
|
│ ├── architecture/ # /architecture
|
|
│ ├── frontend/ # /frontend (sub-agent)
|
|
│ ├── backend/ # /backend (sub-agent)
|
|
│ ├── qa/ # /qa (sub-agent)
|
|
│ ├── deploy/ # /deploy
|
|
│ └── help/ # /help
|
|
├── features/ # Feature specs (PROJ-XXX.md)
|
|
├── src/ # Next.js app
|
|
│ ├── app/ # App router pages
|
|
│ ├── components/ # React components
|
|
│ └── lib/ # Utilities, Supabase client
|
|
├── supabase/ # Database migrations
|
|
└── public/ # Static assets
|
|
```
|
|
|
|
## Conventions
|
|
|
|
- TypeScript strict mode, no `any`
|
|
- Server Components by default, `"use client"` only when needed
|
|
- Tailwind for styling, no CSS modules
|
|
- All API responses: `{ data, error, meta }`
|
|
- Feature specs go in `features/PROJ-XXX.md` before coding
|
|
- Use skills in order: requirements → architecture → frontend/backend → qa → deploy
|
|
|
|
## Commands
|
|
|
|
```bash
|
|
npm run dev # Dev server on :3000
|
|
npm run build # Production build
|
|
npm run lint # ESLint + TypeScript check
|
|
npm run test # Vitest
|
|
npm run db:migrate # Run Supabase migrations
|
|
```
|