React, Angular, Vue 및 채팅 앱에서 생성형 UI, 공유 상태, 휴먼 인 더 루프 흐름을 갖춘 에이전트 네이티브 앱을 구축하는 TypeScript SDK입니다.
ag-ui-protocol/ag-ui
AI 에이전트와 사용자 대면 프런트엔드 애플리케이션의 연결 방식을 표준화하는 개방형 이벤트 기반 프로토콜입니다.
- 스타
- 16,716
- 포크
- 1,728
- 열린 이슈
- 495
- 마지막 커밋
- 8시간 전
어떤 프로젝트인가요?
AG-UI(Agent-User Interaction Protocol)는 AI 에이전트 백엔드가 실행 중에 내보내는 경량 이벤트 형식을 정의합니다. 이를 통해 프런트엔드 애플리케이션은 에이전트의 출력을 일관된 방식으로 표시하고 이에 응답할 수 있습니다. 에이전트는 소수의 AG-UI 호환 입력을 받으며, 프로토콜은 전송 방식에 종속되지 않아 SSE, WebSockets, 웹훅 등의 채널에서 사용할 수 있습니다.
이 프로젝트는 에이전트에 도구를 제공하는 MCP, 에이전트 간 통신을 가능하게 하는 A2A와 나란히, 에이전트와 사용자 인터페이스를 연결하는 역할을 합니다. 실시간 스트리밍 채팅, 양방향 상태 동기화, 생성형 UI, 프런트엔드 도구 호출, 휴먼 인 더 루프 상호작용을 지원합니다. 참조용 HTTP 구현과 기본 커넥터도 포함되어 있습니다.
저장소에는 LangChain, CrewAI, Google ADK, Pydantic AI, LlamaIndex, Mastra 등 다양한 에이전트 프레임워크와의 통합이 나열되어 있습니다. 여러 언어로 제공되는 클라이언트 SDK와 TypeScript 코어 패키지도 포함됩니다. CLI 명령어인 npx create-ag-ui-app으로 새 애플리케이션의 기본 구조를 생성할 수 있습니다.
핵심 기능
- 01표준 이벤트 유형을 통해 에이전트 출력을 프런트엔드로 실시간 스트리밍합니다
- 02에이전트와 사용자 인터페이스 간 상태를 양방향으로 동기화합니다
- 03생성형 UI와 구조화된 메시지를 지원합니다
- 04에이전트가 프런트엔드 도구를 호출하고 사용자 입력을 요청할 수 있습니다
- 05SSE, WebSockets 등 모든 전송 방식에서 사용할 수 있습니다
활용 사례
- 기존 에이전트 백엔드에 스트리밍 응답을 지원하는 채팅 인터페이스 추가
- 에이전트가 웹 또는 모바일 UI에 표시되는 애플리케이션 상태를 읽고 업데이트하도록 구성
- 사용자가 에이전트의 작업을 확인하는 휴먼 인 더 루프 승인 흐름 구축
- LangChain, CrewAI 또는 Pydantic AI로 만든 에이전트를 공통 프런트엔드 프로토콜에 연결
빠른 시작
- 1
create 스크립트를 사용해 새 AG-UI 애플리케이션을 만듭니다
npx create-ag-ui-app my-agent-app
사용 전 알아둘 점
- 프로토콜은 아직 발전 중이며, 일부 프레임워크 통합은 진행 중으로 표시되어 있습니다.
- 제대로 사용하려면 일반적으로 에이전트 백엔드를 연결해야 하므로 독립형 도구가 아닙니다.
토픽
자주 묻는 질문
- ag-ui은(는) 무엇인가요?
- AI 에이전트와 사용자 대면 프런트엔드 애플리케이션의 연결 방식을 표준화하는 개방형 이벤트 기반 프로토콜입니다. AG-UI(Agent-User Interaction Protocol)는 AI 에이전트 백엔드가 실행 중에 내보내는 경량 이벤트 형식을 정의합니다. 이를 통해 프런트엔드 애플리케이션은 에이전트의 출력을 일관된 방식으로 표시하고 이에 응답할 수 있습니다. 에이전트는 소수의 AG-UI 호환 입력을 받으며, 프로토콜은 전송 방식에 종속되지 않아 SSE, WebSockets, 웹훅 등의 채널에서 사용할 수 있습니다.
- ag-ui은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?
- ag-ui은(는) MIT 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.
- ag-ui은(는) 아직 유지보수되고 있나요?
- 활발히 유지보수 중. ag-ui의 마지막 커밋은 2026년 10월 20일입니다.
- ag-ui은(는) 어디에 사용할 수 있나요?
- 기존 에이전트 백엔드에 스트리밍 응답을 지원하는 채팅 인터페이스 추가 에이전트가 웹 또는 모바일 UI에 표시되는 애플리케이션 상태를 읽고 업데이트하도록 구성 사용자가 에이전트의 작업을 확인하는 휴먼 인 더 루프 승인 흐름 구축 LangChain, CrewAI 또는 Pydantic AI로 만든 에이전트를 공통 프런트엔드 프로토콜에 연결
- ag-ui는 어떻게 설치하나요?
- create 스크립트를 사용해 새 AG-UI 애플리케이션을 만듭니다: npx create-ag-ui-app my-agent-app
- ag-ui은(는) 어디서 받을 수 있나요?
- 소스 코드와 설치 방법은 GitHub에 있습니다: https://github.com/ag-ui-protocol/ag-ui
요약은 프로젝트 README를 바탕으로 AI가 작성했습니다. GitHub 통계는 매일 갱신됩니다.
관련 프로젝트
LLM이 자체 컴포넌트 라이브러리로 렌더링 가능한 UI를 생성하도록 지원하는 OpenUI Lang 기반 프레임워크 독립형 Generative UI 툴킷
각 에이전트에 전용 브라우저·파일·도구를 제공하고 모든 작업을 정책으로 제어하고 기록하는 셀프 호스팅 AI 동료 플랫폼입니다.
CopilotKit과 AG-UI로 설명, 비교, 차트, 실제 작동하는 도구를 보여주는 오픈소스 채팅 인터페이스
메모리, 도구, MCP, RAG, 음성, 워크플로를 지원하는 AI 에이전트 구축용 TypeScript 프레임워크와 관측성을 위한 VoltOps 콘솔입니다.
MCP 서버와 React 뷰를 사용하는 MCP Apps 및 클라이언트를 만들 수 있는 TypeScript 프레임워크로, Inspector와 CLI를 기본 제공합니다.