Next.js Generative UI Template

A starter template for building Generative UI applications with ChatBotKit and Next.js, where the AI renders interactive React components inline in the conversation.

nextjs
app-router
template
3066

This template demonstrates Generative UI, where the AI response is not just streamed text but can include fully interactive React components rendered directly in the chat. This enables experiences like appointment pickers, confirmation dialogs, and data forms appearing inline.

The architecture uses ChatBotKit's streaming primitives to intersperse structured component payloads with text, which the client maps to real React components. The server action pattern keeps credentials server-side while the UI stays reactive.

This is the recommended starting point for products that want AI responses to feel like a native part of the UI rather than a text buffer.

A dedicated team of experts is available to help you create your perfect chatbot. Reach out via or chat for more information.