Skip to content

workos/mcp.shop

Repository files navigation

mcp.shop

The world's first MCP-based web shop, built with WorkOS AuthKit and Next.js mcp-adaptor.

Live DemoOverviewArchitecturePrerequisitesSetup

Overview

This project demonstrates how to use AuthKit with MCP to create a secure web shop where users can:

  • Connect to an MCP server
  • Authenticate via AuthKit
  • Order t-shirts using MCP tools
  • View order details (admin users only)

Architecture

The application is built on:

Key components:

  • Authentication logic: lib/with-authkit.ts
  • Client registration: app/.well-known/
  • MCP implementation: app/[transport]/route.ts

Prerequisites

  • Node.js (latest LTS version recommended)
  • WorkOS account with AuthKit configured
  • Redis service (e.g., Upstash)

Setup

  1. Clone the repository

  2. Install dependencies:

    pnpm install
  3. Configure environment variables:

    Create a .env.local file in the root directory with the following variables:

    # WorkOS Configuration
    AUTHKIT_DOMAIN=your-authkit-domain
    WORKOS_API_KEY=your-workos-api-key
    WORKOS_CLIENT_ID=your-workos-client-id
    
    # Redis Configuration (Upstash)
    KV_REST_API_URL=your-upstash-url
    KV_REST_API_TOKEN=your-upstash-token

    Note: You can find your WorkOS credentials in the WorkOS dashboard. Make sure to set your redirect URI in the dashboard.

  4. Start the development server:

    pnpm dev

    The application will be available at:

Connecting to MCP

To connect your chat client to the development server, add the following configuration to your MCP config file (e.g., .cursor/mcp.json):

{
  "mcpServers": {
    "mcp.shop": {
      "command": "npx",
      "args": ["-y", "mcp-remote", "http://localhost:3000/mcp"]
    }
  }
}

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

MIT

About

mcp.shop storefront/app for MCP Night

Resources

License

Security policy

Stars

Watchers

Forks

Contributors 5