50분
How: 메인 앱 진입점 + Chat 페이지 구현
프론트엔드 UI 개발 (Streamlit)
How: 메인 앱 진입점 + Chat 페이지 구현
통합 프로젝트 > 프론트엔드 UI 개발 (Streamlit)
학습 목표
Streamlit 멀티페이지 앱의 진입점을 구현할 수 있다 채팅 페이지를 Agent와 연동하여 구현할 수 있다 도구 사용 로그를 UI에 표시할 수 있다
메인 앱 + Chat 페이지 구현
Step 1: main.py (진입점)
- 서비스 초기화 (@st.cache_resource)
- session_state 설정
- 사이드바 구성
Step 2: pages/1_Chat.py
- 채팅 UI (st.chat_message + st.chat_input)
- Agent 호출 및 응답 표시
- 도구 사용 로그 (st.expander)
에디터 로딩 중...
힌트 보기
- • st.chat_message("user") / st.chat_message("assistant")로 역할 구분
- • session_state에 messages를 저장해야 페이지 재실행 시 이력 유지
- • st.spinner("생각 중...")으로 로딩 상태 표시
- • st.expander로 상세 정보를 접을 수 있게
정답 보기
에디터 로딩 중...