A production-ready template for building Claude-powered agents with the Claude Agent SDK. Supports both local development and Cloudflare Workers deployment.
This template provides a working example of a creative ad generation agent that:
- Researches a brand from their website
- Generates hooks (ad copy) using conversion psychology
- Creates visual prompts using art direction skills
- Produces images using Gemini's image generation
You can use this as a starting point and customize for your own use case.
claude-agent-template/
├── agent/ # Agent framework
│ └── .claude/
│ ├── agents/ # Sub-agent definitions
│ │ └── research.md # Research agent
│ └── skills/ # Skill definitions
│ ├── hook-methodology/
│ └── art-style/
│
├── server/ # Local development server
│ ├── sdk-server.ts # Express server
│ └── lib/
│ ├── ai-client.ts # SDK wrapper
│ ├── session-manager.ts
│ ├── orchestrator-prompt.ts
│ └── nano-banana-mcp.ts # Image generation MCP
│
├── deploy/ # Cloudflare deployment
│ ├── wrangler.jsonc # Cloudflare config
│ ├── Dockerfile # Sandbox container
│ ├── schema.sql # D1 database schema
│ ├── src/ # Worker code
│ └── sandbox/ # Sandbox runtime
│
├── .env.example # Environment template
└── docs/
└── CUSTOMIZATION.md # Customization guide
# Create a new project from this template
# (If using GitHub template, click "Use this template")
# Navigate to the project
cd claude-agent-template
# Install server dependencies
cd server
npm install# Copy environment template
cp .env.example .env
# Edit .env and add your API keys
ANTHROPIC_API_KEY=your_anthropic_key
GEMINI_API_KEY=your_gemini_key# Development mode (auto-reload)
npm run dev
# Or production mode
npm start# Health check
curl http://localhost:3001/health
# Generate ads for a website
curl -X POST http://localhost:3001/generate \
-H "Content-Type: application/json" \
-d '{"prompt": "Create Instagram ads for https://example.com targeting millennials"}'| Method | Endpoint | Description |
|---|---|---|
| GET | /health |
Health check |
| POST | /generate |
Main generation endpoint |
| POST | /test |
Test queries with session |
| GET | /sessions |
List all sessions |
| GET | /sessions/:id |
Get session details |
| POST | /sessions/:id/continue |
Continue a session |
| POST | /sessions/:id/fork |
Fork a session |
| GET | /images |
List generated images |
| GET | /images/:session/:file |
Serve an image |
- Cloudflare account
- Wrangler CLI (
npm install -g wrangler) - R2 bucket access
- D1 database
cd deploy
# Install dependencies
npm install
# Login to Cloudflare
wrangler login
# Create D1 database
npm run db:create
# Update wrangler.jsonc with your database ID
# Then initialize the schema
npm run db:init
# Create R2 bucket
npm run r2:create
# Set secrets
wrangler secret put ANTHROPIC_API_KEY
wrangler secret put GEMINI_API_KEY
wrangler secret put AWS_ACCESS_KEY_ID
wrangler secret put AWS_SECRET_ACCESS_KEY
# Deploy
npm run deployEdit deploy/wrangler.jsonc:
See docs/CUSTOMIZATION.md for detailed guidance on:
- Creating new agents
- Adding skills
- Modifying the orchestrator workflow
- Adding MCP servers
- Changing the model
┌─────────────────────────────────────────────────────────┐
│ User Request │
└─────────────────────────┬───────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────┐
│ Orchestrator Agent │
│ (Coordinates workflow based on system prompt) │
└─────────────────────────┬───────────────────────────────┘
│
┌───────────────┼───────────────┐
▼ ▼ ▼
┌─────────────┐ ┌─────────────┐ ┌─────────────┐
│ Research │ │ Hook │ │ Art Style │
│ Agent │ │ Skill │ │ Skill │
└──────┬──────┘ └──────┬──────┘ └──────┬──────┘
│ │ │
▼ ▼ ▼
┌─────────────────────────────────────────────────────────┐
│ MCP Server │
│ (Gemini Image Generation) │
└─────────────────────────────────────────────────────────┘
| Variable | Required | Description |
|---|---|---|
ANTHROPIC_API_KEY |
Yes | Claude API key |
GEMINI_API_KEY |
Yes | Google Gemini API key |
PORT |
No | Server port (default: 3001) |
CF_ACCOUNT_ID |
Deploy | Cloudflare account ID |
AWS_ACCESS_KEY_ID |
Deploy | R2 access key |
AWS_SECRET_ACCESS_KEY |
Deploy | R2 secret key |
- Runtime: Node.js 20+
- SDK:
@anthropic-ai/claude-agent-sdk - Server: Express.js
- Image Generation: Google Gemini 3 Pro Image Preview
- Deployment: Cloudflare Workers + Sandbox + D1 + R2
MIT
{ "name": "my-agent", // Your agent name "d1_databases": [{ "database_id": "YOUR_D1_DATABASE_ID" // From npm run db:create }], "vars": { "CF_ACCOUNT_ID": "YOUR_CLOUDFLARE_ACCOUNT_ID" } }