Tomato Basil
Streamlit 사용기 본문

얼마 전, LLM을 활용하는 프로젝트를 위해 간단한 웹을 제작할 일이 있었다.
주요 목적은 사용자의 피드백을 받기 위한 것이었어서, 사용자의 응답을 실시간으로 받아서 저장하는 기능이 필요했다.
[정보의 흐름]
Google Sheet -> Streamlit -> Firebase Firestore
위와 같이 정보가 이동하도록 했다.
API를 통해 구글 시트로부터 읽은 정보가 Streamlit에 표현되고,
Streamlit에서 사용자가 선택한 응답 내역이 Firestore에 저장된다.
원래 Firebase의 realtime database를 사용하려고 했는데, API 연동이 생각되로 되지 않아서 Firestore를 쓰게 되었다.
[배포]
Streamlit Community Cloud
깃허브 계정으로 이곳에 로그인하면, 배포를 한 번에 뚝딱 완성할 수 있다.
1. Streamlit과 외부 API 연동하기, 라이브러리 사용하기
- 외부 API 연동 시
뭔가 Streamlit을 로컬에서 쓸 때와 배포해서 쓸 때 차이가 있는 것 같다.
main 코드도 나는 로컬, 배포의 경우에 다르게 되었는데,
Streamlit Community Cloud에 배포할 경우에는
사용할 API에 대한 정보(private key, client email 등)가 담긴 시크릿 파일을 추가해주면 된다.
- 라이브러리 사용 시
import가 필요한 라이브러리들은 requirements.txt 파일을 통해 해당 라이브러리 명을 명시해줘야 한다.
예를 들어, 다음과 같이 txt 파일을 작성한 후 main 코드와 동일한 레포지토리에 가지고 있는다.
streamlit
gspread
pandas
그런데 math와 같은 정말 기본적인 파이썬의 라이브러리들은 requirements.txt에 추가할 필요하 없는 것으로 안다.
관련 링크 (dependencies 명시하는 방법):
https://docs.streamlit.io/deploy/streamlit-community-cloud/deploy-your-app/app-dependencies
2. 구글 시트 API
구글 시트 API 연동을 위해 Streamlit Community Cloud에 아래와 같은 시크릿 텍스트를 추가해줘야 한다.
이 내용은 구글 시트에서 API 공유 설정할 때 json 파일로 받을 수 있다.
# .streamlit/secrets.toml
[connections.gsheets]
spreadsheet = "https://docs.google.com/spreadsheets/d/xxxxxxx/edit#gid=0"
# From your JSON key file
type = "service_account"
project_id = "xxx"
private_key_id = "xxx"
private_key = "xxx"
client_email = "xxx"
client_id = "xxx"
auth_uri = "https://accounts.google.com/o/oauth2/auth"
token_uri = "https://oauth2.googleapis.com/token"
auth_provider_x509_cert_url = "https://www.googleapis.com/oauth2/v1/certs"
client_x509_cert_url = "xxx"
다만 구글 시트 API (무료) 사용하며 느낀 단점이 있다.
초반에는 구글 시트에서 바꾼 데이터가 실시간으로 Streamlit 페이지에 반영이 되는 것 같더니,
어느 순간부터는 반영되는 속도가 30~40분 정도로 늘어났다.
이 딜레이가 왜 생기는지 알 수는 없었지만, (그리고 Streamlit 배포를 재실행하면 바로 반영되는 것 같긴 했지만)
불편하긴 했다.
나의 경우, Google Sheet -> Streamlit의 데이터 흐름이 실시간일 필요는 없었기에 괜찮았다.
관련 링크 (구글 시트 연동 방법):
https://docs.streamlit.io/develop/tutorials/databases/private-gsheet
3. Firebase의 Firestore API
구글 시트가 실시간을 연동이 되었다면, 사용자의 응답을 실시간으로 구글 시트에 저장할 생각이 있었으나 그러지 못하게 된 관계로..
데이터베이스를 알아보았고, 조금 익숙한 Firebase를 쓰기로 했다.
Fireabse에는 realtime databse가 있고, 이게 메인인 것 같은데, 이번에는 Firestore를 사용하게 되었다.
그 이유는 realtime databse를 API 연동하려는데 자꾸 오류가 났기 때문이다.
반면 Firestore는 비교적 쉽게 연동이 완료되었기에 이를 계속 사용했다.
Firestore 연동을 위해서도 API의 시크릿을 Streamlit Community Cloud에 저장해야 한다.
관련 링크 (Firebase 공식 문서):
https://firebase.google.com/docs/projects/learn-more?hl=ko
1) 데이터 추출하기 (비공식)
근데,
사용자의 입력값을 잘 받았다.
근데 입력받은 값들을 어떻게 export 하지?
-> 버튼 클릭을 통해 한 번에 json, csv, ... 등으로 추출할 수 있는 방법이 없는 것이었다.
그래서 나는 Firestore Database의 '쿼리 결과' 탭에 뜨는 내용을 drag & copy/paste 해서 csv 파일에 옮겼다..ㅋㅋ
데이터 양이 많지 않아서 10번? 정도 drag & copy/paste 하니 작업이 완료되었다.
물론 데이터가 원하는 형식은 아니었기에 그 이후 파이썬으로 데이터를 정제해야 했기는 했다.
2) 데이터 추출하기 (공식+3rd party)
근데 만약, Blaze 요금제(종량제), 즉 유료 버전의 Firebase를 사용하고 있다면,
데이터를 편하게 export할 수 있는 여러 옵션들이 많다.
(대량의 데이터를 다룬다면 유료 서비스를 거의 필수로 이용해야 하는 것 같다)
대표적으로 아래와 같이 플러그인, 3rd party 어플리케이션들이 있다.
1. Firebase에서 만든 공식 플러그인 (BigQuery로 데이터를 스트리밍)
https://extensions.dev/extensions/firebase/firestore-bigquery-export
Stream Firestore to BigQuery | Firebase Extensions Hub
Sends realtime, incremental updates from a specified Cloud Firestore collection to BigQuery.
extensions.dev
2. Firefoo (Firebase Firestore를 위한 GUI 클라이언트)
Powerful GUI for Firestore - Firefoo
View and edit your data in a table, tree or JSON, export to JSON and CSV, run queries from a JavaScript shell.
www.firefoo.app
4. 완성된 Streamlit 웹



모자이크를 하긴 했지만... 이런 식으로 보여지게 했다.
이외에도, Streamlit 커뮤니티에는 오픈된 정보가 엄청 많다.
아래처럼 다른 사람들의 프로젝트를 참고할 수 있다.
https://blog.streamlit.io/ai21_grounded_multi_doc_q-a/
Grounded multi-doc Q&A made simple with AI21
In just a few steps, build a context-based question-answering app based on your own documents and powered by AI21’s RAG Engine and task-specific models
blog.streamlit.io
https://funziit.tistory.com/34
[Streamlit] 초기세팅 / 데이터브릭스 (databricks) & 스프레드시트 (gspread) 연동
Streamlit 선정 이유 데이터분석가/데이터 사이언티스트라면, 내가 모델링한 결과물을 유관부서와 내용을 공유 할 일이 비일비재 할 거다.나는 매번 [구글 스프레드시트]로 공유했는데, 상품 이미
funziit.tistory.com
https://www.restack.io/docs/streamlit-knowledge-streamlit-google-sheets-integration
Streamlit Google Sheets Integration Guide
Learn how to seamlessly integrate Google Sheets with Streamlit for dynamic data applications.
www.restack.io
'Web' 카테고리의 다른 글
| 15-4. 북스토어 프로젝트 (4) - 모델과 API 연동 - 라우트 작성, API통신, 회원가입 (0) | 2024.07.23 |
|---|---|
| 시각화, 애니메이션에 있어서 CSS와 JS의 역할 (0) | 2024.04.22 |