chats
AI가 답을 실시간으로 써 내려가는 대화와 일반 채팅을 같은 입력창과 메시지 목록으로 그리는 채팅 화면 패키지입니다. 요청과 재시도는 쓰는 제품이 맡습니다.
- 2025.09 ~ 현재
- Firstage
- 설계와 구현 (1인)

핵심 가치
AI 대화를 넣는 제품은 편집 제안 카드 같은 자기 메시지만 더하면 되고, 실시간 답변 표시와 스크롤은 다시 만들지 않아도 됩니다.
성과
- Journey와 홈페이지의 포토북 대화 화면에서 사용
- 특정 통신 방식이나 서버에 묶이지 않음
- 이전 기록을 불러와도 보던 위치 유지
- 긴 대화도 화면에 보이는 메시지만 그려 가볍게 유지
기술 스택
배경
chats는 Firstage에서 AI와 주고받는 흐름의 대화 화면을 맡는 패키지입니다. 포토북 편집기에서 AI와 대화하며 지면을 고치는 흐름이 대표적이며, 이 대화에는 편집 제안 카드, 확인 질문, 사용량 안내처럼 제품에 맞춘 메시지가 들어갑니다. 스트리밍 표시와 스크롤 같은 대화 화면의 기본 동작은 제품마다 다시 만들지 않도록 한 곳에 두었고, WebSocket, SSE, AI SDK 같은 전송 방식이나 특정 백엔드에는 묶이지 않게 했습니다.
결정과 구현
- 입력기와 메시지 리스트를 독립된 부품으로 나눠, 둘 중 하나만 붙여 쓸 수도 있게 했습니다. AI 스트리밍 대화와 일반 채팅이 같은 부품을 조합해 씁니다.
- 스트리밍 이벤트는 순수 함수가 메시지 노드에 반영하고, UI는 토큰 단위 렌더와 가상 스크롤을 맡습니다. 별도의 상태 기계는 두지 않았습니다.
- 메시지 내용은 node.type별 렌더러 레지스트리로 그립니다. 제품은 편집 제안 같은 자기 노드를 등록하고, 호스트의 렌더러 목록은 그 제품의 노드 종류를 빠짐없이 다뤄야 합니다.
- 요청, 재시도, 저장, 낙관적 상태는 사용하는 제품이 소유합니다. 메시지를 다시 그리거나 기록을 다시 불러오거나 복구 버튼을 눌러도 비용이 드는 요청이 반복되지 않도록 하는 책임을 호스트 쪽에 분명히 두었습니다.
- 짧은 대화는 입력기 바로 위에 붙이고, 사람이 위로 스크롤하기 전까지는 길어지는 응답을 따라갑니다. 이전 기록을 앞에 불러와도 보고 있던 위치는 그대로 유지합니다.
현재 상태
Journey 앱 포토북 편집기의 AI 대화와 Firstage 홈페이지의 포토북 만들기 화면이 이 패키지로 대화를 그립니다. 현재 버전은 1.0.0-alpha.0이고, 1.0.0으로 올리기 전에 포토북 연동을 실서비스에서 처음부터 끝까지 검수하는 일이 남아 있습니다.
