Free SKILL.md scraped from GitHub. Clone the repo or copy the file directly into your Claude Code skills directory.
npx versuz@latest install jeremylongshore-claude-code-plugins-plus-skills-plugins-saas-packs-claude-pack-skills-clade-deploy-integrationgit clone https://github.com/jeremylongshore/claude-code-plugins-plus-skills.gitcp claude-code-plugins-plus-skills/SKILL.MD ~/.claude/skills/jeremylongshore-claude-code-plugins-plus-skills-plugins-saas-packs-claude-pack-skills-clade-deploy-integration/SKILL.md---
name: clade-deploy-integration
description: 'Deploy Claude-powered applications to Vercel, Fly.io, and Cloud Run
Use when working with deploy-integration patterns.
with proper secrets management and streaming support.
Trigger with "deploy anthropic", "claude production deploy",
"anthropic vercel", "deploy claude app".
'
allowed-tools: Read, Write, Edit, Bash(vercel:*), Bash(fly:*), Bash(gcloud:*)
version: 1.0.0
license: MIT
author: Jeremy Longshore <jeremy@intentsolutions.io>
tags:
- saas
- anthropic
- claude
- deploy
- production
compatibility: Designed for Claude Code
---
# Deploy Anthropic Integration
## Overview
Claude integrations are stateless API wrappers — a serverless function receives a user request, streams from the Messages API, and returns the response. No database, no connection pool, no persistent state.
## Vercel Edge Function (Recommended)
```typescript
// app/api/chat/route.ts (Next.js App Router)
import Anthropic from '@claude-ai/sdk';
export const runtime = 'edge';
export async function POST(req: Request) {
const client = new Anthropic();
const { messages, system } = await req.json();
const stream = await client.messages.create({
model: 'claude-sonnet-4-20250514',
max_tokens: 4096,
system: system || 'You are a helpful assistant.',
messages,
stream: true,
});
// Convert Anthropic stream to ReadableStream for SSE
const encoder = new TextEncoder();
const readable = new ReadableStream({
async start(controller) {
for await (const event of stream) {
if (event.type === 'content_block_delta' && event.delta.type === 'text_delta') {
controller.enqueue(encoder.encode(`data: ${JSON.stringify(event.delta)}\n\n`));
}
}
controller.enqueue(encoder.encode('data: [DONE]\n\n'));
controller.close();
},
});
return new Response(readable, {
headers: {
'Content-Type': 'text/event-stream',
'Cache-Control': 'no-cache',
},
});
}
```
## Instructions
### Step 1: Deploy to Vercel
```bash
# Add secret
vercel env add ANTHROPIC_API_KEY
# Deploy
vercel --prod
```
## Fly.io (Long-Running / WebSocket)
```dockerfile
FROM node:20-slim
WORKDIR /app
COPY package*.json ./
RUN npm ci --only=production
COPY . .
EXPOSE 3000
CMD ["node", "server.js"]
```
```bash
fly launch --name my-claude-app
fly secrets set ANTHROPIC_API_KEY=sk-ant-api03-...
fly deploy
```
## Google Cloud Run
```bash
gcloud run deploy claude-api \
--source . \
--region us-central1 \
--allow-unauthenticated \
--set-secrets=ANTHROPIC_API_KEY=claude-key:latest \
--timeout=300 \
--concurrency=80
```
## Health Check
```typescript
// api/health.ts
import Anthropic from '@claude-ai/sdk';
export async function GET() {
try {
const client = new Anthropic();
const msg = await client.messages.create({
model: 'claude-haiku-4-5-20251001',
max_tokens: 5,
messages: [{ role: 'user', content: 'ping' }],
});
return Response.json({ status: 'healthy', model: msg.model });
} catch (err) {
return Response.json({ status: 'unhealthy', error: err.message }, { status: 503 });
}
}
```
## Environment Variables
| Variable | Required | Description |
|----------|----------|-------------|
| `ANTHROPIC_API_KEY` | Yes | API key from console.anthropic.com |
| `ANTHROPIC_MODEL` | No | Default model ID (override per request) |
| `ANTHROPIC_MAX_TOKENS` | No | Default max tokens |
## Output
- Application deployed to chosen platform with streaming support
- `ANTHROPIC_API_KEY` stored in platform secrets manager
- Health check endpoint returning Claude connectivity status
- Environment-specific configuration (model, max_tokens) in place
## Error Handling
| Issue | Cause | Solution |
|-------|-------|----------|
| `FUNCTION_INVOCATION_TIMEOUT` | Claude response > function timeout | Set timeout to 300s. Use streaming. |
| Secret not found | Missing env var | Add via platform CLI |
| 529 in production | API overloaded | SDK retries automatically. Add fallback model. |
| CORS errors | Missing headers | Add CORS headers to API route |
## Examples
See Vercel Edge Function (with SSE streaming), Fly.io Dockerfile, Cloud Run deploy script, and Health Check endpoint above.
## Resources
- [Anthropic API Docs](https://docs.anthropic.com/en/api/getting-started)
- [Vercel AI SDK](https://sdk.vercel.ai/docs) (optional higher-level wrapper)
## Next Steps
See `clade-observability` for monitoring your Claude calls in production.
## Prerequisites
- Completed `clade-install-auth` and `clade-prod-checklist`
- Production Anthropic API key (separate from dev key)
- Platform CLI installed: `vercel`, `fly`, or `gcloud`
- Application code tested locally