AIMCP Shop

Built on the Model Context Protocol

A store assistant that discovers its own tools

Ask for a recommendation, place an order or add a product in plain language. The assistant finds the right tool at runtime, so new capabilities ship by registering a tool on the server, not by changing the client.

Try the live demo Read the LinkedIn post
/shop
The MCP shop: product grid with an AI Assistant button

How it works

The chat route asks the MCP server which tools exist on every request and hands them to the model next to two local tools. The model decides which to call.

  1. Step 1

    Chat UI

    Next.js + useChat streams the conversation.

  2. Step 2

    LLM + MCP client

    Vercel AI SDK lists the server's tools on every request and lets the model pick one.

  3. Step 3

    MCP server

    A Streamable HTTP endpoint inside the app exposes 4 tools backed by PostgreSQL.

Four tools, discovered at runtime

getProducts

Reads the live catalogue from PostgreSQL so answers are never stale.

getOrders

Looks up existing orders and what was in them.

order

Places an order for one or more products, with quantities.

createProduct

Adds a new product to the store from a chat message.

Connect your own MCP client

The same four tools the shop assistant uses are served publicly over Streamable HTTP. Point Claude, Cursor or any MCP client at the endpoint and query the live catalogue yourself. Orders and new products go into the demo database.

Endpoint (Streamable HTTP)

https://mcp-shop-chi.vercel.app/api/store/mcp

Run this once in your terminal, then start a new session and ask “list the products in mcp-shop”.

claude mcp add --transport http mcp-shop https://mcp-shop-chi.vercel.app/api/store/mcp

Stack

Next.jsReact 19TypeScriptGroq (gpt-oss-120b)Vercel AI SDKModel Context ProtocolStreamable HTTPPostgreSQLDrizzle ORMTailwind CSS