Skip to main content
Definitions: A ChatGPT App is an MCP App. The UI of a ChatGPT App is an MCP Resource. We will use these terms interchangeably. More on MCP here.
This documentation is available via MCP at https://docs.sunpeak.ai/mcp, use it in your coding agent!

What is sunpeak?

sunpeak is a framework for ChatGPT Apps. With sunpeak, you can quickly build and ship OpenAI ChatGPT Apps, all from your local machine. sunpeak consists of a library, a framework, and a CLI. Note that each sunpeak component can be used in isolation if preferred, though the most seamless experience combines all 3.

The sunpeak Library

An npm package for running & testing ChatGPT Apps. This standalone library contains:
  • Runtime APIs - Strongly typed, multi-platform APIs for interacting with the ChatGPT runtime, architected to support future platforms (Gemini, Claude).
  • ChatGPT Simulator - React component replicating ChatGPT’s runtime.
    • Testing utilities to automatically test your app in all platform states (theme, displayMode, saved states, etc.)
  • MCP Server - Mock data MCP server for testing local Resources in the real ChatGPT.

The sunpeak Framework

Next.js for ChatGPT Apps. This templated npm package includes:
  • Project Scaffold - Complete development setup with build, test, and mcp tooling, including the sunpeak library.
    • Convention Over Configuration - Create UIs (resources) by simply creating a resources/NAME-resource.tsx React file and resources/NAME-resource.json metadata file.
  • UI Components - Production-ready components following ChatGPT design guidelines and using OpenAI apps-sdk-ui React components.

The sunpeak CLI

Commands for managing ChatGPT Apps. Includes a client for the sunpeak Resource Repository (ECR for ChatGPT Apps). The repository helps you & your CI/CD decouple your App from your client-agnostic MCP server:
  • Version Tagging - Tag your app builds with version numbers and environment names (like v1.0.0 and prod).
  • Push - Push built Apps to a central location.
  • Pull - Pull built Apps to be run in different environments.

Quick Example

Build and run beautiful ChatGPT App UIs with just a few lines of code:
import { Card } from "../components/card";

export function MCPResource() {
  return (
    <Card
      image="https://images.unsplash.com/photo-1520950237264-dfe336995c34"
      imageAlt="Lady Bird Lake"
      header="Lady Bird Lake"
      metadata="⭐ 4.5 • Austin, TX"
      button1={{ children: "Visit", isPrimary: true, onClick: () => {} }}
      button2={{ children: "Learn More", onClick: () => {} }}
    >
      Scenic lake perfect for kayaking, paddleboarding, and trails.
    </Card>
  );
}