Build Once.
Run in any AI Host.
One codebase. Every AI host.
Claude
ChatGPT
Gemini
CopilotDefine once, deploy everywhere
Build React views with familiar hooks. Pancake handles the protocol adapters. Your component renders natively in every host.
1// views/weather/App.tsx2import { useViewParams, useViewState } from '@pancake-apps/web';3import { useEffect } from 'react';45export function WeatherView() {6 const { inputs, data } = useViewParams<{ city: string }, WeatherData>();7 const [weather, setWeather] = useViewState<WeatherData | null>(data);89 useEffect(() => {10 fetchWeather(inputs.city).then(setWeather);11 }, [inputs.city]);1213 if (!weather) return <Loading />;1415 return (16 <div className="weather-widget">17 <City name={weather.city} />18 <Temperature value={weather.temp} unit={weather.unit} />19 <Conditions type={weather.condition} />20 <Stats humidity={weather.humidity} wind={weather.wind} />21 </div>22 );23}Check weather for London
Here's the current weather in London:
London, UK
Rainy
Humidity
89%
Wind
12 mph
Precip
80%
ClaudeWhat's the weather in Tokyo?
Here's the current weather in Tokyo:
Tokyo, Japan
Partly Cloudy
Humidity
65%
Wind
8 mph
UV Index
Low
Weather in San Francisco?
Here's the weather for San Francisco:
San Francisco, CA
Sunny
Humidity
55%
Wind
10 mph
UV Index
High
Same app. Same code. Adapts to each platform.
Test and debug live
Run pnpm dev to start a local server, paste the URL into ChatGPT, and watch your app update as you edit. No deploys, no waiting.
ChatGPTLive PreviewWhat's the weather in San Francisco?
Here's the current weather:
San Francisco
Sunny
Humidity
55%
1// views/weather/App.tsx2import { useViewParams } from '@pancake-apps/web';34export function WeatherView() {5 const { data } = useViewParams<{}, WeatherData>();67 return (8 <div className="weather-card">9 <City name={data.city} />10 <Temperature value={data.temp} />11 12 </div>13 );14}All the toppings you need
A complete SDK for building applications for AI hosts—without the integration headaches.
Single API
Define views, actions, and data once with a clean, TypeScript-first API. No platform-specific code required.
Auto View Discovery
Drop files in a folder and they become views automatically. The SDK discovers and registers them for you.
Great DX
Hot module reloading, strong typing with inference, and clear error messages that actually help you debug.
Extensible
Add new host adapters without changing your app code. Built for a multi-platform future.
Rich Views
Build interactive React views that render natively in chat UIs. Charts, forms, maps, and more.
Type Safe
Full TypeScript support with Zod validation. Catch errors at build time, not runtime.
How it works
Every AI host has its own protocol (MCP, OpenAI Actions) and its own UI requirements. Pancake is both protocol-agnostic and host-agnostic: one codebase handles the communication layer and adapts your views to each host's styling conventions.
Modular by design
Install only what you need. Each package is focused and lightweight.
@pancake-apps/serverServer framework for Views, Actions, and Data with auto-discovery
@pancake-apps/webUnified client SDK for ChatGPT Apps SDK and MCP Apps with React hooks
create-pancakeCLI scaffolder for new Pancake projects
Build your first app for AI hosts
Get up and running in under 5 minutes. One codebase runs in ChatGPT, Claude, and every AI assistant.
npx create-pancake my-app