Lesson 1 of 3 · Building ChatGPT Apps

From Plugins to Apps

reading10 min

In March 2023, OpenAI launched ChatGPT Plugins. The idea was simple: let external services expose API endpoints that ChatGPT could call. Restaurants could take reservations. Travel sites could search flights. Shopping platforms could display products. The developer community went wild.

Then, quietly, the limitations surfaced. Plugins were rigid -- a flat list of API calls with no UI beyond text. Users could not interact with results. Developers could not control presentation. The model decided when and how to call your API, and the results appeared as plain text in the chat. No buttons. No forms. No rich interaction.

Plugins were deprecated. GPT Actions replaced them -- an improvement in flexibility but still fundamentally limited to API-call-and-text-response patterns. Then came Custom GPTs, which added personality and instructions but not true interactivity.

In 2025, OpenAI launched the Apps SDK. This is the real platform. And it is built on something unexpected: the Model Context Protocol.

MCP

ChatGPT Apps are built on the Model Context Protocol -- the same standard used by Claude, Cursor, and other AI tools

Why MCP?

The Model Context Protocol is an open standard (originally created by Anthropic) that defines how AI assistants communicate with external tools and data sources. It has become the lingua franca of the AI tool ecosystem -- supported by Claude, ChatGPT, Cursor, Codex, and dozens of other platforms.

Building ChatGPT Apps on MCP was a strategic decision with real consequences for developers:

The Architecture at 10,000 Feet

A ChatGPT App has two parts:

  1. MCP Server (mandatory): Defines the tools your app exposes to ChatGPT. The model calls these tools during conversation. Your server processes the request and returns results.

  2. Web Widget (optional): A web page rendered in an iframe inside ChatGPT. Provides interactive UI -- forms, maps, charts, shopping carts -- that goes beyond what text and cards can express.

The communication flow is important to understand:

  • ChatGPT to MCP Server: JSON-RPC 2.0 over HTTPS. Standard request/response.
  • ChatGPT to Widget: postMessage API through a bridge called window.openai. The widget runs in a sandboxed iframe.
  • Widget to MCP Server: The widget cannot call your server directly. It goes through ChatGPT using window.openai.callTool(). This ensures the model is always aware of what is happening.
The Model is Always in the Loop

This architecture is intentional. The model sees every tool call and every response. This means the model can reason about your app's state, explain actions to the user, and coordinate between multiple apps. The widget is not a standalone web page -- it is a participant in a conversation.

What is Possible Now

The Apps SDK enables categories of experience that were impossible with plugins:

CategoryExampleKey Capability
Interactive ToolsA Figma app that lets users manipulate designs through conversationTool calls + visual widget
CommerceA shopping app with product browsing, cart management, and checkoutRich cards + Instant Checkout
Data VisualizationA analytics dashboard that updates as users ask questionsDynamic widget + tool responses
ProductivityA project management app that creates tasks and tracks progressCRUD tools + list components
ContentA recipe app that generates shopping lists and cooking instructionsStructured content + file handling
The First Killer App

What This Course Covers

Over the next four chapters, you will learn to build a ChatGPT App from scratch:

  1. This chapter: Architecture, component types, and tool design principles
  2. Chapter 2: Building the MCP server -- tools, schemas, authentication
  3. Chapter 3: Building the widget UI -- the window.openai API, state management, file handling
  4. Chapter 4: Testing, deployment, and App Store submission

By the end, you will have the knowledge to build, deploy, and publish a production ChatGPT App.

beginner

Explore the Platform:

  1. Open chatgpt.com and browse the App Store -- note the top 5 apps by category
  2. Try at least one app and pay attention to: when tools are called, how results are rendered, whether a widget appears
  3. Identify one app idea in your professional domain that could not exist as a plugin but works as an app
  4. Write a one-sentence elevator pitch for that app
Concept Card