Docs/Getting Started

Getting Started

From zero to a fully-loaded AI agent toolkit in under 60 seconds — with real examples for frontend, backend, product ownership, and more.

Installation

Run the following command inside your project root. The kit copies agents/, skills/, workflows/, configs/, prompts/, and rules/ directly into your working directory.

terminal
npx create-raffles-it

No global install needed. Every time you run it, the latest kit is fetched from npm.

What gets installed:

your-project/
your-project/
├── agents/                  ← 19 specialist agent definitions
│   ├── orchestrator/
│   │   ├── agent.yaml       ← model, tools, skills list
│   │   └── prompt.md        ← system prompt
│   ├── frontend-specialist/
│   ├── backend-specialist/
│   └── ...16 more
├── skills/                  ← 19 modular skill packs
│   ├── react-best-practices/
│   │   └── SKILL.md
│   ├── api-patterns/
│   └── ...17 more
├── workflows/               ← 11 slash command definitions
│   ├── create.md
│   ├── debug.md
│   └── ...9 more
├── configs/                 ← model & runtime config
├── prompts/                 ← shared prompt templates
└── rules/                   ← editor rules (Gemini, etc.)

Activate in your editor

Option A — Project-localRecommended for teams

Leave the agents/ folder in your project root. Claude Code detects it automatically when you open the project.

terminal
# After running npx create-raffles-it, just open the project:
claude .

Agents are scoped to this project only.

Option B — Global agentsAvailable in every project

Copy agents to your global Claude Code config directory to use them across all projects.

terminal
# macOS / Linux
cp -r agents/ ~/.claude/agents/

# Windows (PowerShell)
Copy-Item -Recurse agents\ $env:USERPROFILE\.claude\agents\
Cursor / Windsurf

Place the agents/ and skills/ folders in your project root. Both editors read markdown-based agent definitions automatically from the workspace.

How auto-routing works

You never need to pick an agent manually. When you type a request, the AI reads your message, matches keywords and intent against the agent registry (agents/.agents), and silently loads the right agent and its skill packs.

Your message
Keyword & intent match
Agent selected (agent.yaml + prompt.md)
Skills loaded from SKILL.md files
Expert-quality response

The orchestrator agent handles multi-step tasks that span multiple domains by coordinating sub-agents in parallel.

Real-world examples

FrontendReact / Next.js project
Example 1

You type in Claude Code / Cursor chat

Create a responsive product card component with Tailwind CSS, dark mode support, and hover animations

Agent routed

frontend-specialist

Skills loaded

react-best-practicestailwind-patternsfrontend-designclean-code
Delivers a fully-typed React component following Next.js performance rules, Tailwind v4 patterns, and WCAG accessibility guidelines — all from the loaded skill packs.
BackendNode.js / Express / NestJS
Example 2

You type in Claude Code / Cursor chat

Build a JWT authentication API with refresh tokens, rate limiting, and input validation

Agent routed

backend-specialist

Skills loaded

api-patternsnodejs-best-practicesclean-codelint-and-validate
Generates a production-ready auth module with proper token rotation, express-rate-limit setup, zod validation, and error handling — following REST API best practices from the skill files.
DatabasePrisma / PostgreSQL / SQL
Example 3

You type in Claude Code / Cursor chat

Design a multi-tenant schema for a SaaS app with row-level security and soft deletes

Agent routed

database-architect

Skills loaded

database-designclean-code
Produces a Prisma schema with tenant isolation, composite indexes, soft-delete patterns, and migration files — applying database normalization and optimization rules from the skill pack.
ProductProduct Owner / Planning
Example 4

You type in Claude Code / Cursor chat

Help me prioritize our backlog for the MVP launch. We have 40 tickets and need to ship in 3 weeks

Agent routed

product-owner

Skills loaded

plan-writingbrainstorming
Runs a Socratic discovery session to understand value vs effort, then produces a prioritized sprint plan with MoSCoW categorization, acceptance criteria, and a realistic 3-week roadmap.
DebuggingRoot cause analysis
Example 5

You type in Claude Code / Cursor chat

The login endpoint returns 500 only in production but works fine locally. Help me debug it

Agent routed

debugger

Skills loaded

systematic-debugging
Applies a structured 5-phase debugging protocol: reproduce → isolate → hypothesize → verify → fix. Checks environment differences, missing env vars, database connection limits, and request timeouts.
SecurityOWASP audit
Example 6

You type in Claude Code / Cursor chat

Audit my Express API for security vulnerabilities before we go to production

Agent routed

security-auditor

Skills loaded

clean-codelint-and-validate
Scans for OWASP Top 10 issues: SQL injection, XSS, broken auth, insecure deserialization, missing rate limiting, exposed secrets, and improper CORS config — with fix recommendations for each.

The skill tree

Skills are modular knowledge packs. Each agent lists which skills it uses in its agent.yaml. When an agent is activated, it reads those SKILL.md files and loads their rules, patterns, and scripts into context.

agents/backend-specialist/agent.yaml
name: backend-specialist
model: claude-sonnet-4-6
tools:
  - Read
  - Grep
  - Bash
  - Edit
  - Write
skills:
  - clean-code           ← always-on coding standards
  - nodejs-best-practices
  - api-patterns         ← REST/GraphQL/tRPC patterns
  - database-design
  - lint-and-validate
skills/api-patterns/SKILL.md
# API Patterns Skill

## REST Design Rules
- Use noun-based resource URLs (/users, not /getUsers)
- Version APIs with /v1/ prefix
- Return 201 for POST creation, 204 for DELETE
- Always paginate list endpoints with cursor or offset

## Error Response Format
{
  "error": "RESOURCE_NOT_FOUND",
  "message": "User with id 123 does not exist",
  "statusCode": 404
}

## Input Validation
- Validate at controller layer with zod or joi
- Strip unknown fields before DB writes
- Return field-level errors for 422 responses

Skill loading flow:

📩
User request
You type a message
🎯
Agent matched
Based on keywords & intent
📚
Skills loaded
SKILL.md files read into context
Pro tip: You can edit skills/react-best-practices/SKILL.md to add your team's own conventions. Every agent that loads that skill will follow them automatically.

Slash command workflows

Workflows are multi-step orchestrated procedures. Invoke them by typing the slash command in Claude Code or your AI editor chat.

/
/create

Scaffold a new feature end-to-end. Kicks off planning → design → implementation → tests.

/create user authentication with Google OAuth
/
/debug

Structured root-cause analysis. Isolates the bug, forms hypotheses, verifies fix.

/debug payment webhook failing in production
/
/plan

Breaks down a large task into a prioritized sprint plan with story points.

/plan migrate monolith to microservices
/
/deploy

Pre-flight checks → build → deploy → smoke test. Works with Docker, Vercel, CapRover.

/deploy to production with zero downtime
/
/test

Generates unit, integration, and E2E tests for a given module or PR diff.

/test the auth module
/
/review

Code review against OWASP, performance, readability, and team conventions.

/review src/api/payments.ts
/
/enhance

Improves existing code: performance, readability, type safety, error handling.

/enhance the user service class
/
/brainstorm

Socratic discovery session to explore architecture options or product ideas.

/brainstorm architecture for real-time notifications
/
/orchestrate

Coordinates multiple specialist agents in parallel for complex cross-domain tasks.

/orchestrate build a full SaaS billing system
/
/status

Gives a project health report: test coverage, lint status, open TODOs, security flags.

/status
/
/ui-ux-pro-max

Design mode with 50 UI styles, 21 color palettes, and 50 fonts for rapid prototyping.

/ui-ux-pro-max redesign the dashboard

Direct invocation

Auto-routing handles most cases, but you can also call any agent or skill by name when you want precise control.

Call an agent directly

Act as the product-owner agent and help me write user stories for the notifications feature

Request a specific skill

Using the database-design skill, review this Prisma schema for normalization issues

Run a workflow explicitly

/orchestrate — I need a frontend-specialist and backend-specialist to build a real-time chat feature together

Override the model

Use the orchestrator agent with Opus 4 to plan this migration strategy end-to-end

Quick reference

Which agent handles which task:

I need to…Agent
Build UI componentsfrontend-specialist
Build a REST / GraphQL APIbackend-specialist
Design a database schemadatabase-architect
Plan a sprint or backlogproduct-owner
Write product requirementsproduct-manager
Debug a production issuedebugger
Write automated teststest-engineer
Set up CI/CD or Dockerdevops-engineer
Security audit / OWASPsecurity-auditor
Refactor legacy codecode-archaeologist
Analyse the codebaseexplorer-agent
Improve page performanceperformance-optimizer
Multi-domain complex taskorchestrator