agent-chat-ui: LangGraph 서버와 상호작용하는 Next.js 채팅 인터페이스

해결하는 문제

LangGraph 서버와 상호작용할 수 있는 즉시 사용 가능한 채팅 인터페이스를 제공합니다. 이로써 개발자는 LangGraph로 구축된 AI 에이전트를 배포하거나 테스트하고자 할 때 처음부터 맞춤형 프론트엔드를 구축할 필요가 없어집니다.

작동 방식

Next.js 애플리케이션으로 구축된 이 UI는 배포 URL, 어시스턴트 또는 그래프 ID, 그리고 인증(LangSmith API 키 또는 커스텀 인증)을 통해 LangGraph 서버에 연결됩니다. 사용자와 서버 간의 통신을 처리하며, LLM 응답의 실시간 스트리밍과 사이드 패널에 표시되는 특수 콘텐츠인 "artifacts" 렌더링을 지원합니다.

대상 사용자

LangGraph를 사용하여 AI 에이전트를 구축하고, 프론트엔드 개발에 시간을 들이지 않고 에이전트를 위한 전문적인 채팅 인터페이스가 필요한 개발자.

주요 기능

• 빠른 배포: npx create-agent-chat-app을 통해 실행하거나 호스팅된 데모로 사용할 수 있습니다.
• 메시지 제어: 개발자는 langsmith:nostream 태그를 사용하거나 ID에 do-not-render- 접두사를 추가하여 사용자에게 특정 메시지를 숨길 수 있습니다.
• 아티팩트 지원: 채팅과 함께 구조화된 콘텐츠(아티팩트)를 렌더링하는 사이드 패널 시스템을 포함합니다.
• 프로덕션 준비: 보안 API 키 관리 및 커스텀 인증 스키마를 위한 API 패스스루 프록시를 포함한 여러 인증 경로를 지원합니다.