Quick Start

Bootstrap a GenUI chat app in under a minute.

Create the app

pnpx @openuidev/cli@latest create --name genui-chat-app

Then move into the project:

cd genui-chat-app

Add your API key

The generated app uses OpenAI by default, but works with any OpenAI-compatible provider (e.g., OpenRouter, Azure OpenAI, Anthropic via proxy).

echo "OPENAI_API_KEY=sk-your-key-here" > .env

Start the dev server

pnpm dev

What's included

The CLI generates a Next.js app with everything wired up:

src/
  app/
    page.tsx          # AgentInterface chat (thread history) with the built-in component library
    api/chat/
      route.ts        # Backend route with OpenAI streaming + example tools
  library.ts          # Re-exports openuiChatLibrary and openuiChatPromptOptions
  generated/
    system-prompt.txt  # Auto-generated at build time via `openui generate`
  • page.tsx: Renders the AgentInterface chat (an artifact chat surface with thread history) with openuiChatLibrary for Generative UI rendering. It provides an llm whose send posts messages to the route and whose streamProtocol is openAIAdapter(). Storage is optional — omit it and threads are kept in memory (wiped on reload).
  • route.ts: A backend API route that sends the system prompt to the LLM and streams the response back.
  • library.ts: Your component library entrypoint. The openui generate CLI reads this file to produce the system prompt.

The dev and build scripts automatically regenerate the system prompt before starting:

"generate:prompt": "openui generate src/library.ts --out src/generated/system-prompt.txt",
"dev": "pnpm generate:prompt && next dev"

On this page