Deploy Clay integrations to Vercel, Fly.io, and Cloud Run platforms. Use when deploying Clay-powered applications to production, configuring platform-specific secrets, or setting up deployment pipelines. Trigger with phrases like "deploy clay", "clay Vercel", "clay production deploy", "clay Cloud Run", "clay Fly.io".
Deploys Clay applications to Vercel, Fly.io, and Cloud Run while configuring platform secrets and pipelines.
/plugin marketplace add jeremylongshore/claude-code-plugins-plus-skills/plugin install clay-pack@claude-code-plugins-plusThis skill is limited to using the following tools:
Deploy Clay-powered applications to popular platforms with proper secrets management.
# Add Clay secrets to Vercel
vercel secrets add clay_api_key sk_live_***
vercel secrets add clay_webhook_secret whsec_***
# Link to project
vercel link
# Deploy preview
vercel
# Deploy production
vercel --prod
{
"env": {
"CLAY_API_KEY": "@clay_api_key"
},
"functions": {
"api/**/*.ts": {
"maxDuration": 30
}
}
}
app = "my-clay-app"
primary_region = "iad"
[env]
NODE_ENV = "production"
[http_service]
internal_port = 3000
force_https = true
auto_stop_machines = true
auto_start_machines = true
# Set Clay secrets
fly secrets set CLAY_API_KEY=sk_live_***
fly secrets set CLAY_WEBHOOK_SECRET=whsec_***
# Deploy
fly deploy
FROM node:20-slim
WORKDIR /app
COPY package*.json ./
RUN npm ci --only=production
COPY . .
CMD ["npm", "start"]
#!/bin/bash
# deploy-cloud-run.sh
PROJECT_ID="${GOOGLE_CLOUD_PROJECT}"
SERVICE_NAME="clay-service"
REGION="us-central1"
# Build and push image
gcloud builds submit --tag gcr.io/$PROJECT_ID/$SERVICE_NAME
# Deploy to Cloud Run
gcloud run deploy $SERVICE_NAME \
--image gcr.io/$PROJECT_ID/$SERVICE_NAME \
--region $REGION \
--platform managed \
--allow-unauthenticated \
--set-secrets=CLAY_API_KEY=clay-api-key:latest
// config/clay.ts
interface ClayConfig {
apiKey: string;
environment: 'development' | 'staging' | 'production';
webhookSecret?: string;
}
export function getClayConfig(): ClayConfig {
const env = process.env.NODE_ENV || 'development';
return {
apiKey: process.env.CLAY_API_KEY!,
environment: env as ClayConfig['environment'],
webhookSecret: process.env.CLAY_WEBHOOK_SECRET,
};
}
// api/health.ts
export async function GET() {
const clayStatus = await checkClayConnection();
return Response.json({
status: clayStatus ? 'healthy' : 'degraded',
services: {
clay: clayStatus,
},
timestamp: new Date().toISOString(),
});
}
Select the platform that best fits your infrastructure needs and follow the platform-specific guide below.
Store Clay API keys securely using the platform's secrets management.
Use the platform CLI to deploy your application with Clay integration.
Test the health check endpoint to confirm Clay connectivity.
| Issue | Cause | Solution |
|---|---|---|
| Secret not found | Missing configuration | Add secret via platform CLI |
| Deploy timeout | Large build | Increase build timeout |
| Health check fails | Wrong API key | Verify environment variable |
| Cold start issues | No warm-up | Configure minimum instances |
#!/bin/bash
# Platform-agnostic deploy helper
case "$1" in
vercel)
vercel secrets add clay_api_key "$CLAY_API_KEY"
vercel --prod
;;
fly)
fly secrets set CLAY_API_KEY="$CLAY_API_KEY"
fly deploy
;;
esac
For webhook handling, see clay-webhooks-events.
Expert guidance for Next.js Cache Components and Partial Prerendering (PPR). **PROACTIVE ACTIVATION**: Use this skill automatically when working in Next.js projects that have `cacheComponents: true` in their next.config.ts/next.config.js. When this config is detected, proactively apply Cache Components patterns and best practices to all React Server Component implementations. **DETECTION**: At the start of a session in a Next.js project, check for `cacheComponents: true` in next.config. If enabled, this skill's patterns should guide all component authoring, data fetching, and caching decisions. **USE CASES**: Implementing 'use cache' directive, configuring cache lifetimes with cacheLife(), tagging cached data with cacheTag(), invalidating caches with updateTag()/revalidateTag(), optimizing static vs dynamic content boundaries, debugging cache issues, and reviewing Cache Component implementations.