vercel-deployment
Expert knowledge for deploying to Vercel with Next.js Use when: vercel, deploy, deployment, hosting, production.
Best use case
vercel-deployment is best used when you need a repeatable AI agent workflow instead of a one-off prompt.
Expert knowledge for deploying to Vercel with Next.js Use when: vercel, deploy, deployment, hosting, production.
Teams using vercel-deployment should expect a more consistent output, faster repeated execution, less prompt rewriting.
When to use this skill
- You want a reusable workflow that can be run more than once with consistent structure.
When not to use this skill
- You only need a quick one-off answer and do not need a reusable workflow.
- You cannot install or maintain the underlying files, dependencies, or repository context.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/vercel-deployment/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How vercel-deployment Compares
| Feature / Agent | vercel-deployment | Standard Approach |
|---|---|---|
| Platform Support | Not specified | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
Expert knowledge for deploying to Vercel with Next.js Use when: vercel, deploy, deployment, hosting, production.
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
SKILL.md Source
# Vercel Deployment You are a Vercel deployment expert. You understand the platform's capabilities, limitations, and best practices for deploying Next.js applications at scale. ## When to Use This Skill Use this skill when: - Deploying to Vercel - Working with Vercel deployment - Hosting applications on Vercel - Deploying to production on Vercel - Configuring Vercel for Next.js applications Your core principles: 1. Environment variables - different for dev/preview/production 2. Edge vs Serverless - choose the right runtime 3. Build optimization - minimize cold starts and bundle size 4. Preview deployments - use for testing before production 5. Monitoring - set up analytics and error tracking ## Capabilities - vercel - deployment - edge-functions - serverless - environment-variables ## Requirements - nextjs-app-router ## Patterns ### Environment Variables Setup Properly configure environment variables for all environments ### Edge vs Serverless Functions Choose the right runtime for your API routes ### Build Optimization Optimize build for faster deployments and smaller bundles ## Anti-Patterns ### ❌ Secrets in NEXT_PUBLIC_ ### ❌ Same Database for Preview ### ❌ No Build Cache ## ⚠️ Sharp Edges | Issue | Severity | Solution | |-------|----------|----------| | NEXT_PUBLIC_ exposes secrets to the browser | critical | Only use NEXT_PUBLIC_ for truly public values: | | Preview deployments using production database | high | Set up separate databases for each environment: | | Serverless function too large, slow cold starts | high | Reduce function size: | | Edge runtime missing Node.js APIs | high | Check API compatibility before using edge: | | Function timeout causes incomplete operations | medium | Handle long operations properly: | | Environment variable missing at runtime but present at build | medium | Understand when env vars are read: | | CORS errors calling API routes from different domain | medium | Add CORS headers to API routes: | | Page shows stale data after deployment | medium | Control caching behavior: | ## Related Skills Works well with: `nextjs-app-router`, `supabase-backend`
Related Skills
orchestrating-deployment-pipelines
Deploy use when you need to work with deployment and CI/CD. This skill provides deployment automation and orchestration with comprehensive guidance and automation. Trigger with phrases like "deploy application", "create pipeline", or "automate deployment".
managing-deployment-rollbacks
Deploy use when you need to work with deployment and CI/CD. This skill provides deployment automation and orchestration with comprehensive guidance and automation. Trigger with phrases like "deploy application", "create pipeline", or "automate deployment".
kubernetes-deployment-creator
Kubernetes Deployment Creator - Auto-activating skill for DevOps Advanced. Triggers on: kubernetes deployment creator, kubernetes deployment creator Part of the DevOps Advanced skill category.
creating-kubernetes-deployments
Deploy applications to Kubernetes with production-ready manifests. Supports Deployments, Services, Ingress, HPA, ConfigMaps, Secrets, StatefulSets, and NetworkPolicies. Includes health checks, resource limits, auto-scaling, and TLS termination. Use when working with creating kubernetes deployments. Trigger with 'creating', 'kubernetes', 'deployments'.
canary-deployment-setup
Canary Deployment Setup - Auto-activating skill for ML Deployment. Triggers on: canary deployment setup, canary deployment setup Part of the ML Deployment skill category.
adk-deployment-specialist
Deploy and orchestrate Vertex AI ADK agents using A2A protocol. Manages AgentCard discovery, task submission, Code Execution Sandbox, and Memory Bank. Use when asked to "deploy ADK agent" or "orchestrate agents". Trigger with phrases like 'deploy', 'infrastructure', or 'CI/CD'.
vercel-composition-patterns
React composition patterns that scale. Use when refactoring components with boolean prop proliferation, building flexible component libraries, or designing reusable APIs. Triggers on tasks involving compound components, render props, context providers, or component architecture. Includes React 19 API changes.
azure-deployment-preflight
Performs comprehensive preflight validation of Bicep deployments to Azure, including template syntax validation, what-if analysis, and permission checks. Use this skill before any deployment to Azure to preview changes, identify potential issues, and ensure the deployment will succeed. Activate when users mention deploying to Azure, validating Bicep files, checking deployment permissions, previewing infrastructure changes, running what-if, or preparing for azd provision.
electric-deployment
Deploy Electric via Docker, Docker Compose, or Electric Cloud. Covers DATABASE_URL (direct connection, not pooler), ELECTRIC_SECRET (required since v1.x), ELECTRIC_INSECURE for dev, wal_level=logical, max_replication_slots, ELECTRIC_STORAGE_DIR persistence, ELECTRIC_POOLED_DATABASE_URL for pooled queries, IPv6 with ELECTRIC_DATABASE_USE_IPV6, Kubernetes readiness probes (200 vs 202), replication slot cleanup, and Postgres v14+ requirements. Load when deploying Electric or configuring Postgres for logical replication.
vercel-react-native-skills
React Native and Expo best practices for building performant mobile apps. Use when building React Native components, optimizing list performance, implementing animations, or working with native modules. Triggers on tasks involving React Native, Expo, mobile performance, or native platform APIs.
deploy-to-vercel
Deploy applications and websites to Vercel. Use when the user requests deployment actions like "deploy my app", "deploy and give me the link", "push this live", or "create a preview deployment".
deployment-automation
Automate application deployment to cloud platforms and servers. Use when setting up CI/CD pipelines, deploying to Docker/Kubernetes, or configuring cloud infrastructure. Handles GitHub Actions, Docker, Kubernetes, AWS, Vercel, and deployment best practices.