Quick Start

Bootstrap a GenUI chat app in under a minute.

Create the app

npx @openuidev/cli@latest create --name genui-chat-app
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

npm run dev

What's included

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

src/
  app/
    page.tsx          # FullScreen chat layout 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 FullScreen chat layout with openuiChatLibrary for Generative UI rendering and openAIAdapter() for streaming.
  • 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