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. It is especially useful for teams working in multi. Expert knowledge for deploying to Vercel with Next.js Use when: vercel, deploy, deployment, hosting, production.
Expert knowledge for deploying to Vercel with Next.js Use when: vercel, deploy, deployment, hosting, production.
Users should expect a more consistent workflow output, faster repeated execution, and less time spent rewriting prompts from scratch.
Practical example
Example input
Use the "vercel-deployment" skill to help with this workflow task. Context: Expert knowledge for deploying to Vercel with Next.js Use when: vercel, deploy, deployment, hosting, production.
Example output
A structured workflow result with clearer steps, more consistent formatting, and an output that is easier to reuse in the next run.
When to use this skill
- Use this skill when you want a reusable workflow rather than writing the same prompt again and again.
When not to use this skill
- Do not use this when you only need a one-off answer and do not need a reusable workflow.
- Do not use it if you cannot install or maintain the related files, repository context, or supporting tools.
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
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.
vercel-cli-with-tokens
Deploy and manage projects on Vercel using token-based authentication. Use when working with Vercel CLI using access tokens rather than interactive login — e.g. "deploy to vercel", "set up vercel", "add environment variables to vercel".
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".
vercel-deploy-claimable
Deploy applications and websites to Vercel. Use this skill when the user requests deployment actions such as 'Deploy my app', 'Deploy this to production', 'Create a preview deployment', 'Deploy and give me the link', or 'Push this live'. No authentication required - returns preview URL and claimable deployment link.
vercel-automation
Automate Vercel tasks via Rube MCP (Composio): manage deployments, domains, DNS, env vars, projects, and teams. Always search tools first for current schemas.
kubernetes-deployment
Kubernetes deployment workflow for container orchestration, Helm charts, service mesh, and production-ready K8s configurations.
deployment-validation-config-validate
You are a configuration management expert specializing in validating, testing, and ensuring the correctness of application configurations. Create comprehensive validation schemas, implement configurat
deployment-procedures
Production deployment principles and decision-making. Safe deployment workflows, rollback strategies, and verification. Teaches thinking, not scripts.
deployment-pipeline-design
Design multi-stage CI/CD pipelines with approval gates, security checks, and deployment orchestration. Use when architecting deployment workflows, setting up continuous delivery, or implementing GitOps practices.
deployment-engineer
Expert deployment engineer specializing in modern CI/CD pipelines, GitOps workflows, and advanced deployment automation. Masters GitHub Actions, ArgoCD/Flux, progressive delivery, container security, and platform engineering. Handles zero-downtime deployments, security scanning, and developer experience optimization. Use PROACTIVELY for CI/CD design, GitOps implementation, or deployment automation.
azd-deployment
Deploy containerized applications to Azure Container Apps using Azure Developer CLI (azd). Use when setting up azd projects, writing azure.yaml configuration, creating Bicep infrastructure for Container Apps, configuring remote builds with ACR, implementing idempotent deployments, managing environment variables across local/.azure/Bicep, or troubleshooting azd up failures. Triggers on requests for azd configuration, Container Apps deployment, multi-service deployments, and infrastructure-as-code with Bicep.
expo-deployment
Deploying Expo apps to iOS App Store, Android Play Store, web hosting, and API routes