Skip to content

Getting Started

  • Node.js >= 18
  • pnpm >= 9 (corepack enable to auto-install)
Terminal window
# Clone and install
git clone https://github.com/kibadist/agentui
cd agentui
pnpm install
# Build all packages
pnpm build
# Add your API key (Anthropic, OpenAI, DeepSeek, or Google — all supported)
echo "ANTHROPIC_API_KEY=sk-ant-your-key-here" > examples/nest-api/.env
echo "PORT=3001" >> examples/nest-api/.env
# Run backend (:3001) + frontend (:3000) together
pnpm dev

Open http://localhost:3000.

Terminal window
# Or run individually
pnpm dev:api # NestJS backend on :3001
pnpm dev:app # Next.js frontend on :3000

No clone required — the chat-starter example runs in your browser below. It uses a mock SSE backend (in-process Next.js route handlers), so there’s no API key to set. Send a message, then edit app/page.tsx or components/registry.tsx and watch the change reflect live.

Cold boots take a few seconds while StackBlitz installs the published @kibadist/agentui-* packages. If the embed doesn’t load, open it in a new tab.

Try these once you have the dev server running:

Show me a summary of recent sales

→ Renders a stat-card grid + data-table

Compare pricing plans for a SaaS product

→ Renders a structured comparison data-table

Create a project task board with backlog, in progress, and done columns

→ Renders a task-board with draggable cards

Show system health status for production servers

→ Renders stat-card components with live-style indicators