The outcome

Ship a useful conversational workflow that cannot act on another user's data or expose backend credentials.

CopilotKit is a open-source frontend framework for agentic chat, generative UI, shared state, and human-in-the-loop experiences. Building product-native agent interfaces with chat, custom components, shared application state, frontend tools, streaming, and deterministic human approval checkpoints. This guide narrows that broad capability into one repeatable outcome, with checkpoints that keep the source material and your judgment in the loop.

Before you begin

Set the boundary before the tool starts.

Choose one real task, identify who will use the result, and decide what evidence or test will make the result acceptable. Gather only the source material needed for that task. If the work contains confidential, personal, regulated, or client-owned information, confirm that the platform and account are approved before sharing it.

Troiana principle

AI should make the work easier to inspect. If the workflow removes the source, the owner, or the review step, redesign the workflow.

Step by step

A workflow you can repeat.

  1. 01

    Define the user journey, agent capability, authorized resources, shared state schema, model boundary, failure states, and success metrics.

  2. 02

    Create the minimal CopilotKit UI and server-side runtime, keeping provider credentials and privileged service connections outside the browser.

  3. 03

    Authenticate every request and resolve resource ownership on the server rather than trusting thread IDs, tool arguments, or client-supplied state.

  4. 04

    Add one typed read-only tool and visible streaming states, then test malformed input, cross-user access, prompt injection, cancellation, timeout, and backend failure.

  5. 05

    Add tracing, rate and cost limits, retention rules, and support diagnostics before gradually enabling users and monitoring real failure patterns.

Working standard

What good use looks like.

  • Authorize resources server-side.
  • Keep provider keys off the client.
  • Start with read-only tools.

A polished interface does not make an agent action safe. Treat all client input and model tool arguments as untrusted, authenticate users server-side, authorize every resource and side effect, minimize shared state, keep provider keys off the client, use graph-enforced interrupts for mandatory approvals, make resumable actions idempotent, protect against cross-user thread leakage, and trace and test cancellation, retries, and partial failure.

Official references

Check the current product documentation.

Features, plan limits, availability, and data controls change. These official pages are the starting points used for this collection.