undefined

If the project is not linked, do not continue with provisioning commands until linking completes.

undefined

For browsing the full catalog interactively, use the [Vercel Marketplace](https://vercel.com/marketplace) dashboard.

undefined

Use `--framework <fw>` as the default discovery flow when framework-specific setup matters. The guide returns structured setup steps including required environment variables, SDK packages, and code snippets — ideal for agentic workflows.

undefined

`vercel integration add` is the primary scripted/AI path. It installs to the currently linked project, auto-connects the integration, and auto-runs environment sync locally unless disabled.

If the CLI hands off to the dashboard for provider-specific completion, treat that as fallback:

```bash
vercel integration open <integration-name>

undefined

No manual `.env` file management is needed — the variables are injected into all environments (Development, Preview, Production) automatically.

// app/api/users/route.ts — using Neon auto-provisioned env vars
import { neon } from "@neondatabase/serverless";

// POSTGRES_URL is auto-injected by the Neon integration
const sql = neon(process.env.POSTGRES_URL!);

export async function GET() {
  const users = await sql`SELECT * FROM users LIMIT 10`;
  return Response.json(users);
}

// app/api/cache/route.ts — using Upstash auto-provisioned env vars
import { Redis } from "@upstash/redis";

// KV_REST_API_URL and KV_REST_API_TOKEN are auto-injected
const redis = Redis.fromEnv();

export async function GET() {
  const cached = await redis.get("featured-products");
  return Response.json(cached);
}

undefined

undefined

undefined

undefined

undefined

undefined

// vercel-integration.json
{
  "name": "my-integration",
  "slug": "my-integration",
  "description": "Provides X for Vercel projects",
  "logo": "public/logo.svg",
  "website": "https://my-service.com",
  "categories": ["databases"],
  "scopes": {
    "project": ["env-vars:read-write"],
    "team": ["integrations:read-write"]
  },
  "installationType": "marketplace",
  "resourceTypes": [
    {
      "name": "database",
      "displayName": "Database",
      "description": "A managed database instance"
    }
  ]
}

// app/api/webhook/route.ts
import { verifyVercelSignature } from "@vercel/integration-utils";

export async function POST(req: Request) {
  const body = await req.json();

  // Verify the webhook is from Vercel
  const isValid = await verifyVercelSignature(req, body);
  if (!isValid) {
    return Response.json({ error: "Invalid signature" }, { status: 401 });
  }

  switch (body.type) {
    case "integration.installed":
      // Provision resources for the new installation
      await provisionDatabase(body.payload);
      break;

    case "integration.uninstalled":
      // Clean up resources
      await deprovisionDatabase(body.payload);
      break;

    case "integration.configuration-updated":
      // Handle config changes
      await updateConfiguration(body.payload);
      break;
  }

  return Response.json({ received: true });
}

// lib/provision.ts
async function provisionEnvVars(
  installationId: string,
  projectId: string,
  credentials: { url: string; token: string },
) {
  const response = await fetch(
    `https://api.vercel.com/v1/integrations/installations/${installationId}/env`,
    {
      method: "POST",
      headers: {
        Authorization: `Bearer ${process.env.VERCEL_INTEGRATION_TOKEN}`,
        "Content-Type": "application/json",
      },
      body: JSON.stringify({
        projectId,
        envVars: [
          {
            key: "MY_SERVICE_URL",
            value: credentials.url,
            target: ["production", "preview", "development"],
            type: "encrypted",
          },
          {
            key: "MY_SERVICE_TOKEN",
            value: credentials.token,
            target: ["production", "preview", "development"],
            type: "secret",
          },
        ],
      }),
    },
  );

  return response.json();
}

undefined

> **Building integrations?** Use `npx create-vercel-integration` to scaffold, then deploy your
> integration app to Vercel normally with `vercel --prod`. Publish to the Marketplace via the
> [Vercel Partner Dashboard](https://vercel.com/docs/integrations).

undefined

undefined

undefined

undefined

undefined

Check the response for a drain pointing to the vendor's ingestion endpoint. If no drain appears, the integration may need manual drain setup — see `⤳ skill: observability` for REST API drain creation.

undefined

Confirm the vendor dashboard shows the test event arriving.

undefined

Verify that logs appear both in Vercel's runtime logs and in the vendor's dashboard.

> **For drain payload formats and signature verification**, see `⤳ skill: observability` — the Drains section covers JSON/NDJSON schemas and `x-vercel-signature` HMAC-SHA1 verification.

undefined

> **Payload schema reference:** See `⤳ skill: observability` for Web Analytics drain payload formats (JSON array of `{type, url, referrer, timestamp, geo, device}` events).