Agent skill · software engineering · davila7
vercel-deployment
Expert knowledge for deploying to Vercel with Next.js Use when: vercel, deploy, deployment, hosting, production.
Why this skill is useful
Provides specific deployment patterns and anti-patterns for Vercel with Next.js that the AI wouldn't reliably generate on its own.
What it needs
Requires nextjs-app-router installed locally. About 1k tokens when loaded. Last updated 2026-08-06. 30,138 stars on the source repository.
What this skill does
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. 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 NEXTPUBLIC ❌ Same Database for Preview ❌ No Build Cache ⚠️ Sharp Edges Issue Severity Solution ------- ---------- ---------- NEXTPUBLIC exposes secrets to the browser critical Only use NEXTPUBLIC 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
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills davila7/vercel-deployment