LangGraph 빌더를 위한 커스텀 챗봇 인터페이스
- LangChain의 기본 Agent Chat UI가 프로덕션 환경에 부적합하여, 클로드 코드의 도움을 받아 커스터마이징된 LangGraph용 챗봇 UI를 개발했습니다. 🎨
- 새로운 UI는
settings.toml 파일을 통해 로고, 앱 설명, 챗 오프 메뉴, 전체 설명(MD 파일) 등 다양한 요소를 쉽게 수정할 수 있도록 설계되었습니다. ⚙️
- 개발 모드(
make dev)와 프로덕션 모드(make run)를 지원하여 배포 과정을 간소화했습니다. 🚀
- 대화 시작 메뉴, 개선된 툴 콜링(자동 축소), 대화창 너비 조절, 다크 테마, 폰트 크기 및 스타일 변경 등 사용자 경험을 향상시키는 기능들이 추가되었습니다. 💬
- 앱의 간략한 설명과 '자세한 설명 보기' 모달을 통해 사용자에게 앱 기능을 명확하게 전달하며, 이 내용들은 MD 파일을 통해 쉽게 수정 가능합니다. 📝
- 툴 콜링 표시 여부, 이전 메시지 수정, 휴먼 인 더 루프 기능 등 대화 흐름을 유연하게 제어할 수 있는 옵션들을 제공합니다. ✏️
- 백엔드에 저장되는 대화 이력(쓰레드) 관리 기능을 통해 과거 대화를 조회하고 이어서 진행하거나, 이름을 변경하고 삭제할 수 있습니다. 🕰️
- 설정 메뉴에서 LangGraph 백엔드의 시스템 프롬프트, 모델, 검색 결과 수 등 핵심 설정을 UI에서 동적으로 변경하고 즉시 반영할 수 있습니다. 🧠
- 학생 프로젝트나 전문적인 챗봇 개발에 활용하기 좋으며, React 기반 프런트엔드와 LangGraph 백엔드를 결합하여 전문적인 챗봇을 구축할 수 있습니다. 🎓
- 향후 LangGraph V1 업데이트 및 미들웨어와 같은 신규 기능들을 프런트엔드와 연동하여 시너지를 낼 수 있도록 지속적으로 개선할 예정입니다. 📈
데브허브 | DEVHUB | LangGraph 빌더를 위한 커스텀 챗봇 인터페이스