채팅
Elftia의 채팅 시스템은 애플리케이션의 핵심 상호작용 인터페이스입니다. 다중 탭 병렬 대화, 메시지 브랜치 생성 및 전환, 실시간 스트리밍 응답, 파일 첨부 업로드, 세션 구성 및 관리, 그리고 다양한 슬래시 명령어와 키보드 단축키를 지원합니다.
사용 사례
- AI와 다회차 대화를 통해 제안, 답변을 얻거나 작업을 협업
- 여러 탭을 동시에 열어 서로 다른 주제 간에 자유롭게 전환
- AI 답변이 마음에 들지 않을 때 재생성하고, 브랜치 탐색으로 다른 결과 비교
- 이미지, 문서 등 첨부 파일을 업로드하여 AI가 파일 내용을 이해하고 분석하게 하기
- 슬래시 명령어로 내장 동작을 빠르게 실행
@기호로 프로젝트 파일을 참조하여 AI에 코드 컨텍스트 제공//로 미리 설정된 프롬프트 템플릿을 빠르게 삽입
다중 탭
Elftia는 여러 채팅 탭을 동시에 열 수 있습니다. 각 탭은 독립된 세션 컨텍스트와 메시지 내역을 가집니다.
사용 방법
- 탭 바의 + 버튼을 클릭하여 새 탭 생성
- 새 탭에서 독립적인 대화 시작
- 다른 탭을 클릭하여 대화 전환
- 탭을 우클릭하여 닫거나 이름 변경
각 탭의 메시지, 컨텍스트, 상태는 완전히 독립적이며 서로 영향을 주지 않습니다.
탭 Keep-alive (0.1.8)
탭 전환 시 상태가 유지됩니다:
- 탭을 벗어났다가 돌아와도 스크롤 위치, 미전송 초안, 스트리밍 상태가 보존됩니다
- 여러 탭이 같은 LLM에 동시 요청해도 서로 덮어쓰지 않습니다 (스트림 버퍼는 sessionId로 격리)
- 백그라운드 탭의 폴링과 애니메이션은 CPU 절약을 위해 자동 일시 중지
설정 페이지, Agents 페이지 등 비채팅 페이지에도 keep-alive가 적용됩니다. 설정을 수정하는 도중 다른 탭으로 전환했다가 돌아와도, 어떤 탭에 있었는지, 얼마나 스크롤했는지, 어떤 필드를 변경했는지가 모두 유지됩니다.
메시지 브랜치
메시지 브랜치는 Elftia 채팅 시스템의 핵심 기능 중 하나입니다. AI 답변을 재생성하거나 전송된 메시지를 편집하면 시스템이 자동으로 브랜치를 생성하여 모든 이전 버전을 언제든지 보고 전환할 수 있게 보존합니다.
브랜치 생성 방식
| 동작 | 결과 |
|---|---|
| 답변 재생성 | 현재 AI 메시지 위치에 새 브랜치 생성, 원본 답변 보존 |
| 전송된 메시지 편집 | 편집 지점부터 새 브랜치 생성; 이후 대화는 수정된 내용을 기반으로 계속 |
브랜치 탐색
메시지에 여러 브랜치가 있으면 메시지 옆에 브랜치 탐색 컴포넌트가 나타나며 다음을 표시합니다:
- 브랜치 아이콘 — 현재 메시지에 여러 버전이 있음을 표시
- 현재 인덱스 / 전체 브랜치 수 — 예:
2 / 3은 브랜치가 3개이고 현재 2번째를 보고 있음을 의미 - 좌우 화살표 — 클릭하여 브랜치 전환
사용 방법
- AI 답변 위에 마우스를 올리고 툴바의 재생성 버튼 클릭
- 시스템이 새 답변을 생성하고 새 브랜치 생성
- 메시지 옆에 브랜치 탐색 컴포넌트 표시 (예:
1 / 2) - 좌우 화살표를 클릭하여 다른 답변 버전 보기
- 여러 번 재생성 가능하며, 매번 새 브랜치 추가
:::tip 브랜치는 사라지지 않습니다 모든 브랜치는 영구 저장됩니다. 앱을 닫았다가 다시 열어도 브랜치 기록은 완전히 보존됩니다. :::
스트리밍 응답
AI 답변은 스트리밍 전송을 사용합니다. 메시지 내용은 전체 생성이 완료될 때까지 기다리지 않고 실시간으로 채팅 인터페이스에 순차적으로 표시됩니다.
동작 방식
- 답변 생성 중 메시지 영역이 실시간으로 업데이트됩니다
- 메시지 하단의 로딩 표시기가 답변이 생성 중임을 나타냅니다
- 생성 중 언제든지 중지 버튼을 클릭하여 답변을 중단할 수 있습니다
- 부분적으로 생성된 답변은 보존됩니다
- Markdown 형식 (코드 블록, 목록, 제목 등)은 콘텐츠가 스트리밍되는 즉시 렌더링됩니다
- 추론 과정: 추론 모델의 추론 과정은 최종 답변 위의 접을 수 있는 영역에 표시됩니다
스트리밍 상태 계약
스트리밍 중인 각 메시지의 루트 DOM 요소에는 data-streaming 및 data-stream-phase 마커가 있어, 외부 드라이버(elftia-cli)가 메시지 완료를 신뢰성 있게 대기할 수 있습니다. reasoning / tool-call / 내용 타이핑 중 어느 하나라도 진행 중이면 data-streaming은 "true"입니다. 즉, 지연된 tool-call 결과가 도착하더라도 스트리밍 상태가 잘못 "false"로 전환되지 않습니다.
풍부한 콘텐츠 렌더링
채팅 시스템은 다양한 풍부한 콘텐츠 타입의 인라인 렌더링을 지원합니다:
| 콘텐츠 | 렌더링 동작 |
|---|---|
| Markdown | 제목, 목록, 코드 블록 (구문 강조 + 원클릭 복사), 표, 인용 블록 |
| 이미지 / 동영상 | 인라인 미리 보기; 이미지는 Lightbox에서 전체 크기로 열기 가능 |
| 오디오 | 내장 플레이어 |
| 추론 과정 | 접을 수 있는 영역, 기본적으로 접혀 있음 |
| 도구 호출 | 도구 이름 + 인수 + 결과, 접기 가능 |
| 인라인 HTML | 완전한 HTML 문서(<!DOCTYPE> / <html> 포함)가 감지되면 iframe에서 안전하게 렌더링 (샌드박스는 same-origin 허용 안 함) |
| Question Form (디자인 세션 전용) | 라디오 버튼, 체크박스, 텍스트 필드, direction 카드가 있는 설문 형식 메시지; 제출하면 대화를 이어가기 위한 답변으로 변환 |
| JSON | 자동 감지 후 형식화된 형태로 표시 |
첨부 파일 업로드
채팅은 AI가 파일 내용을 분석할 수 있도록 여러 방법의 첨부 파일 업로드를 지원합니다.
업로드 방법
| 방법 | 방식 |
|---|---|
| 드래그 앤 드롭 | 파일 관리자에서 채팅 입력 영역으로 파일 드래그 |
| 붙여넣기 | Ctrl+V로 클립보드의 이미지 붙여넣기 |
| 파일 선택기 | 입력 상자 옆 첨부 버튼을 클릭하고 대화 상자에서 파일 선택 |
지원하는 파일 형식
- 이미지 — PNG, JPG, GIF, WebP 등 일반적인 이미지 형식
- 문서 — PDF, TXT, Markdown 등 텍스트 파일
- 코드 파일 — 다양한 프로그래밍 언어의 소스 코드 파일
업로드된 첨부 파일은 입력 상자 위에 미리 보기 썸네일로 표시됩니다. 전송 전에 클릭하여 제거할 수 있습니다.
세션 관리
Elftia는 다수의 대화를 효율적으로 관리할 수 있도록 포괄적인 세션 구성 및 관리 기능을 제공합니다.
폴더
- 사이드바에 폴더를 생성하여 관련 세션을 그룹으로 구성
- 다중 중첩 폴더 구조 지원
- 세션을 폴더로 드래그하여 분류
태그
- 세션에 사용자 정의 태그를 추가하여 쉽게 분류
- 태그로 관련 세션을 빠르게 필터링
검색
- 사이드바 상단의 검색 상자에 키워드 입력
- 세션 제목과 메시지 내용 모두 검색 가능
- 검색 결과에서 일치 항목 실시간 강조 표시
고정 세션
- 세션을 우클릭하고 고정을 선택하여 상단에 유지
- 고정된 세션은 항상 목록 상단에 표시되며 새 세션으로 밀리지 않음
명령 메뉴 (/ 슬래시 명령어)
입력 상자에 /를 입력하면 명령 메뉴가 열리고, 다양한 빠른 동작을 제공합니다.
사용 방법
- 채팅 입력 상자에
/입력 - 명령 메뉴가 나타나며 사용 가능한 명령 목록 표시
- 계속 입력하여 명령 필터링
- 위/아래 화살표로 명령 선택 후
Enter로 실행 - 또는 명령을 직접 클릭하여 실행
내장 명령어
| 명령어 | 설명 |
|---|---|
/clear | 현재 세션의 메시지 기록 삭제 |
/help | 도움말 정보 표시 |
/model | 현재 사용 중인 AI 모델 빠르게 전환 |
/settings | 설정 패널 열기 |
:::info 사용자 정의 명령어 내장 명령어 외에도 Agent 시스템과 플러그인이 사용자 정의 명령어를 등록할 수 있습니다. 사용 가능한 명령어는 현재 활성화된 Agent와 설치된 플러그인에 따라 다릅니다. 명령 팔레트(슬래시 팔레트)는 퍼지 검색을 지원하며, Tab을 눌러 인수를 자동 완성할 수 있습니다. :::
파일 참조 (@ 기호)
입력 상자에 @를 입력하면 프로젝트의 파일을 참조하여 파일 내용을 메시지 컨텍스트에 추가할 수 있습니다.
사용 방법
- 채팅 입력 상자에
@입력 - 파일 선택 드롭다운이 나타나며 현재 프로젝트의 파일 목록 표시
- 파일명 키워드를 입력하여 필터링
- 위/아래 화살표로 파일 선택 후
Enter로 확인 - 파일 참조가 입력 상자에 마커 형태로 삽입
- 메시지 전송 시 참조된 파일의 내용이 함께 AI에 전송됨
:::tip 사용 사례 파일 참조 기능은 코드 관련 대화에서 특히 유용합니다. 소스 코드 파일을 참조하여 AI가 코드 로직을 분석하고, 버그를 찾거나 최적화를 제안하도록 할 수 있습니다. :::
빠른 프롬프트 삽입 (// 더블 슬래시)
입력 상자에 //를 입력하면 미리 설정된 프롬프트 템플릿을 빠르게 삽입할 수 있습니다.
사용 방법
- 채팅 입력 상자에
//입력 - 빠른 프롬프트 삽입 메뉴가 나타남
- 메뉴에 즐겨찾기 프롬프트, 최근 사용한 프롬프트, 프롬프트 체인 표시
- 프롬프트 템플릿 선택
- 템플릿에 변수가 포함되어 있으면 (예:
{{language}}) 변수 입력 폼이 팝업 - 변수를 입력한 후 최종 프롬프트 내용이 입력 상자에 삽입
자세한 프롬프트 관리는 프롬프트 문서를 참조하세요.
키보드 단축키
| 단축키 | 동작 |
|---|---|
Enter | 메시지 전송 (기본 모드) |
Ctrl+Enter | 메시지 전송 (Ctrl+Enter 모드) 또는 줄 바꿈 삽입 (기본 모드) |
Shift+Enter | 입력 상자에 줄 바꿈 삽입 |
Esc | 명령 메뉴 또는 파일 선택 메뉴 닫기 |
Up / Down | 명령 메뉴 또는 파일 메뉴에서 선택 항목 이동 |
Ctrl+V | 텍스트 또는 이미지 붙여넣기 |
전송 모드 설정
설정에서 메시지 전송 키보드 단축키를 변경할 수 있습니다:
| 모드 | Enter 키 동작 | Ctrl+Enter 키 동작 |
|---|---|---|
| Enter로 전송 (기본) | 메시지 전송 | 줄 바꿈 삽입 |
| Ctrl+Enter로 전송 | 줄 바꿈 삽입 | 메시지 전송 |
설정 > 일반에서 전송 모드를 전환하세요.
전체 대화 흐름
완전한 대화의 일반적인 흐름은 다음과 같습니다:
메시지 입력 → 전송 → 스트리밍 응답 실시간 표시
↓
답변이 만족스럽나요?
├── 예 → 대화 계속
└── 아니요 → 재생성 (브랜치 생성)
↓
브랜치 탐색으로 버전 비교
↓
원하는 버전 선택 후 계속
자주 묻는 질문
| 문제 | 해결 방법 |
|---|---|
| 메시지 전송 후 답변 없음 | LLM 제공자에 API Key가 설정되어 있는지 확인하고 네트워크 연결 상태 확인 |
| 스트리밍 응답 중단 | 네트워크 불안정 또는 API 타임아웃일 가능성이 높으므로 답변 재생성 시도 |
| 첨부 파일 업로드 실패 | 파일 크기가 제한을 초과하는지, 파일 형식이 지원되는지 확인 |
| 명령 메뉴가 나타나지 않음 | 입력 상자 맨 앞이나 공백 뒤에 /를 입력했는지 확인 |
| 브랜치 탐색이 표시되지 않음 | 탐색 컴포넌트는 메시지에 브랜치가 두 개 이상일 때만 나타남 |
@ 파일 참조가 응답 없음 | 먼저 프로젝트를 열어야 합니다; 파일 참조 기능은 프로젝트 컨텍스트에 의존 |
관련 링크
- LLM 제공자 설정 — AI 모델 및 API Key 설정
- 프롬프트 — 프롬프트 템플릿 관리 및 사용
- Agent — Agent 시스템 및 사용자 정의 명령어 알아보기
- 웹 검색 — 대화에 실시간 웹 검색 통합