StackMCP

Full-Stack Web Dev Stack for VS Code

Intermediate6 servers48.6K tokens

Configuration

{
  "servers": {
    "supabase-mcp": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@supabase/mcp-server-supabase"
      ],
      "env": {
        "SUPABASE_ACCESS_TOKEN": "YOUR_SUPABASE_ACCESS_TOKEN"
      }
    },
    "stripe-mcp": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@stripe/mcp",
        "--tools=all"
      ],
      "env": {
        "STRIPE_SECRET_KEY": "YOUR_STRIPE_SECRET_KEY"
      }
    },
    "github-mcp": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-github"
      ],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "YOUR_GITHUB_PERSONAL_ACCESS_TOKEN"
      }
    },
    "playwright-mcp": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@playwright/mcp"
      ]
    },
    "vercel-mcp": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "vercel-mcp"
      ],
      "env": {
        "VERCEL_API_TOKEN": "YOUR_VERCEL_API_TOKEN"
      }
    },
    "context7-mcp": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@upstash/context7-mcp"
      ]
    }
  }
}

Where to save

Paste the config above into:

.vscode/settings.json → mcp section

Environment Variables

Replace the YOUR_ placeholders with your actual values.

SUPABASE_ACCESS_TOKENrequired

Supabase personal access token

Used by: Supabase MCP

STRIPE_SECRET_KEYrequired

Stripe secret API key

Used by: Stripe MCP

GITHUB_PERSONAL_ACCESS_TOKENrequired

GitHub personal access token

Used by: GitHub MCP

VERCEL_API_TOKENrequired

Vercel API token

Used by: Vercel MCP

What’s in this stack

Supabase MCP25 tools

Query your Supabase database, manage tables, run migrations, deploy edge functions, and manage branches directly from your AI editor.

Database, auth, and storage in one service. The full-stack developer's shortcut to a production-ready backend.

Stripe MCP15 tools

Integrate Stripe APIs for payments, subscriptions, customers, and invoices directly from your AI editor using the official Stripe agent toolkit.

Most web apps need payments eventually. Having Stripe wired in from day one saves a painful integration later.

GitHub MCP20 tools

Access the GitHub API to manage repositories, issues, pull requests, branches, and workflows directly from your AI editor.

Full-stack means more moving parts — PRs, branches, and code reviews keep everything from falling apart.

Playwright MCP20 tools

Automate browser interactions, take screenshots, fill forms, and test web applications using Microsoft Playwright from your AI editor.

End-to-end testing across the entire stack. Verify that your frontend, API, and database all work together correctly.

Vercel MCP12 tools

Connect to the Vercel API to manage deployments, projects, domains, and environment variables from your AI editor.

One-command deployments with preview URLs for every PR. Full-stack shipping without DevOps overhead.

Context7 MCP2 tools

Pull up-to-date documentation and code examples for any library directly into your prompt context using the Context7 API.

You're touching multiple frameworks per day. Up-to-date docs for Next.js, Supabase, and Stripe keep context switches painless.

Other editors

Claude CodeCursorWindsurfClaude DesktopContinue