This guide is part of the Agentic Development Kit (ADK). The ADK enables merchants to build AI-native storefronts within conversational platforms. This section covers building for ChatGPT.
What you’ll build
MCP server
An HTTP server that declares tools (list products, show cart, start checkout) and resources (widgets) to ChatGPT.
Widgets
Self-contained HTML widgets that render inside the ChatGPT conversation as iframes—catalog, cart, and checkout.
Gr4vy Embed
A PCI-compliant payment form loaded into the checkout widget, backed by Gr4vy orchestration and webhook verification.
Prerequisites
- A ChatGPT Pro, Business, Team, or Enterprise subscription. Developer mode is required and is not available on free subscriptions.
- Access to a Gr4vy sandbox environment, including a merchant account, a private API key, and (optionally) a webhook secret. See Create an API key if you haven’t set one up yet.
- A local development runtime for your chosen implementation language.
- A tunneling tool such as ngrok to expose your local server to ChatGPT during development.
User journey
In this guide
Architecture
Understand the architecture — how MCP, tools, widgets, and the three-part return pattern fit together.
Setup
Scaffold the project with dependencies and environment variables.
MCP server
Build the MCP server — define data types, product catalog, HTTP transport, tools, and resources.
Widgets
Build the widgets — implement the widget bridge and build each widget as a self-contained HTML file.
Gr4vy Embed
Integrate Gr4vy Embed — generate embed tokens server-side, render the payment form, and verify webhooks.
Deployment
Deploy to ChatGPT — expose your server over HTTPS, connect to ChatGPT, and go live.