@svpino: One of the hardest parts of building AI agents is connecting them to your UI. The problem most people realize: Agents c…

One of the hardest parts of building AI agents is connecting them to your UI.

The problem most people realize:

Agents completely break the traditional request/response contract.

There are a bunch of problems with agents:

• They’re long-running • They’re nondeterministic • They mix structured and unstructured I/O simultaneously • They need real human checkpoints

Most teams solve this by writing glue code between their agent framework and app.

But you don’t have to: This is the problem the AG-UI protocol solves.

AG-UI is an open, event-based protocol that standardizes agent frontend communication:

• MCP connects agents to tools and data • A2A connects agents to other agents • AG-UI connects agents to users

The protocol defines 25 event types covering the full lifecycle of an agent:

• Run start/finish • Text streaming • Tool calls • State snapshots • State deltas (JSON Patch)

Google, Microsoft, AWS, Oracle, LangChain, Mastra, and almost every agent framework have already adopted it.

@CopilotKit is the open-source framework (35k+ GitHub stars) that implements this. I’m partnering with them on this post.

Here’s what it lets you do in a React/Next.js app:

• Generative UI: The agent returns actual UI components • Shared state: Agent updates backend state, your React re-renders • Human-in-the-loop: Agent pauses, user decides, execution continues • Frontend tools: Define tools in React that the agent calls remotely

Every app adding AI features will need this plumbing.

AG-UI standardizes it so you don’t have to reinvent it from scratch.

Here is the link to the repo: