Build chat-based apps 채팅 관련 기능에 대한 설명입니다. 각 위젯의 역할, 특징, 적용 가능한 수식 형식입니다.
# Insert a chat message container.
with st.chat_message("user"):
st.write("Hello 👋")
st.line_chart(np.random.randn(30, 3))
# Display a chat input widget at the bottom of the app.
>>> st.chat_input("Say something")
# Display a chat input widget inline.
with st.container():
st.chat_input("Say something")
st.chat_message(sender) 채팅 애플리케이션에서 메시지를 표시할 컨테이너를 생성합니다. 특징: sender: 메시지의 발신자를 나타냅니다. 일반적으로 "user" 또는 "assistant"과 같은 문자열로 지정됩니다. 메시지 컨테이너 내부에 텍스트, 그래프, 이미지 등 다양한 콘텐츠를 추가할 수 있습니다. 적용 가능한 수식:
with st.chat_message("user"):
st.write("Hello 👋") # 메시지 텍스트
st.line_chart(np.random.randn(30, 3)) # 메시지 컨테이너에 차트를 표시
st.chat_input(label) 채팅 애플리케이션에서 사용자가 입력할 수 있는 입력 필드를 생성합니다. 특징: label: 입력 필드에 표시될 안내 텍스트. 사용자가 메시지를 입력하면 해당 메시지가 문자열로 반환됩니다. 기본적으로 화면 하단에 표시되며, 컨테이너 안에서도 사용할 수 있습니다. 적용 가능한 수식:
# 화면 하단에 채팅 입력 필드 추가
st.chat_input("Say something")
st.container() 채팅 입력 위젯을 특정 컨테이너 내에 배치하여 레이아웃을 사용자 정의할 수 있습니다. 특징: 컨테이너 내부에 st.chat_input()을 포함하여 일반적인 위치(화면 하단) 외에도 다른 위치에 입력 필드를 배치할 수 있습니다. 적용 가능한 수식:
with st.container():
st.chat_input("Say something") # 컨테이너 내부에 입력 필드 배치
Mutate data 앱이 실행 중일 때데이터를 동적으로 업데이트하거나 수정할 수 있도록 지원합니다. 이를 통해 실시간 데이터 업데이트를 처리하거나, 사용자 입력 또는 외부 이벤트에 따라 데이터 시각화와 테이블을 동적으로 갱신하는 작업이 가능합니다.
# Add rows to a dataframe after
# showing it.
element = st.dataframe(df1)
element.add_rows(df2)
# Add rows to a chart after
# showing it.
element = st.line_chart(df1)
element.add_rows(df2)
element = st.dataframe(df1) Streamlit 앱에 데이터프레임 df1을 표시합니다. element는 해당 데이터프레임의 참조 객체로 사용됩니다. 특징: 동적 데이터프레임을 생성하여 이후 행을 추가하거나 수정할 수 있습니다. 기본적으로 데이터를 테이블 형식으로 표시하며, 스크롤 및 정렬 기능이 내장되어 있습니다. 적용 가능한 수식:
import pandas as pd
# 데이터프레임 초기화
df1 = pd.DataFrame({"A": [1, 2], "B": [3, 4]})
df2 = pd.DataFrame({"A": [5, 6], "B": [7, 8]})
# 데이터 표시 및 행 추가
element = st.dataframe(df1)
element.add_rows(df2) # df2 데이터를 df1 뒤에 추가
element = st.line_chart(df1) df1 데이터를 사용해 라인 차트를 생성하여 화면에 표시합니다. element 객체를 통해 이후 추가 데이터를 반영할 수 있습니다. 특징: 실시간으로 차트를 업데이트할 수 있습니다. 추가 데이터를 차트에 동적으로 추가하는 데 적합합니다. 적용 가능한 수식:
import pandas as pd
import numpy as np
# 데이터프레임 초기화
df1 = pd.DataFrame({"A": [1, 2, 3], "B": [3, 6, 9]})
df2 = pd.DataFrame({"A": [4, 5], "B": [12, 15]})
# 차트 생성 및 업데이트
element = st.line_chart(df1)
element.add_rows(df2) # df2 데이터를 차트에 추가
add_rows(df2) st.dataframe 또는 st.line_chart 객체에 새로운 행(df2)을 추가합니다. 데이터프레임 또는 차트의 내용을 동적으로 갱신하는 데 사용됩니다. 특징: add_rows() 메서드는 추가할 데이터의 컬럼 이름과 기존 데이터의 컬럼 이름이 동일해야 작동합니다. 실시간 데이터 스트리밍과 같은 시나리오에 유용합니다.
Display code
with st.echo():
st.write("Code will be executed and printed")
with st.echo(): st.echo()는 스트림릿에서 코드 블록을 실행하고, 실행된 코드를 화면에 출력하는 함수입니다.이를 사용하면 코드가 실행되는 동시에 해당 코드도 화면에 표시되므로, 사용자가 실행한 코드와 그 결과를 동시에 확인할 수 있습니다. 특징: 코드가 실행되는 과정과 결과를 화면에 출력할 수 있습니다.주로 디버깅, 교육, 문서화, 또는 코드를 실행하며 결과를 확인하는 데 유용합니다.with 블록 내에서 실행되는 모든 코드는 자동으로 출력됩니다. 적용 가능한 수식:
with st.echo():
st.write("This will be displayed on the app and executed.")
Placeholders, help, and options
# Replace any single element.
element = st.empty()
element.line_chart(...)
element.text_input(...) # Replaces previous.
# Insert out of order.
elements = st.container()
elements.line_chart(...)
st.write("Hello")
elements.text_input(...) # Appears above "Hello".
st.help(pandas.DataFrame)
st.get_option(key)
st.set_option(key, value)
st.set_page_config(layout="wide")
st.query_params[key]
st.query_params.from_dict(params_dict)
st.query_params.get_all(key)
st.query_params.clear()
st.html("<p>Hi!</p>")
st.empty() st.empty()는 비어 있는 자리(플레이스홀더)를 만들고, 이후 그 자리에 다른 요소를 동적으로 삽입할 수 있게 해주는 함수입니다. 이 함수를 사용하면 특정 공간에 내용을 동적으로 교체할 수 있습니다. 특징: 처음에는 비어 있지만, 후속 작업에서 다른 UI 요소로 채워집니다. 여러 번 호출하여 동일한 위치에 다른 요소를 삽입할 수 있습니다. 적용 가능한 수식:
element = st.empty() # 빈 플레이스홀더 생성
element.line_chart(...) # 차트를 삽입
element.text_input(...) # 텍스트 입력 필드로 교체
st.empty()를 사용하면 특정 위치에 빈 공간을 명시적으로 남겨두고,나중에 그 공간을 다른 요소로 채우는 것이 가능하다는 점에서 편리합니다. 예를 들어, 반복문 내에서 화면을 갱신할 때 유용하게 사용할 수 있죠.
st.container() st.container()는 여러 개의 스트림릿 요소를 그룹화할 수 있는 컨테이너를 생성합니다. 이 컨테이너 내에서 위치나 순서를 바꾸어도 컨테이너 자체의 순서는 변하지 않으며, 내부 요소만 변경 가능합니다. 특징: 여러 UI 요소를 그룹화하여 논리적으로 구분할 수 있습니다. 컨테이너 내의 요소 순서를 변경할 수 있습니다. 외부에서 다른 위치에 UI 요소를 삽입해도 컨테이너 내의 요소는 변하지 않습니다. 적용 가능한 수식:
elements = st.container() # 컨테이너 생성
elements.line_chart(...) # 컨테이너 내 차트 삽입
st.write("Hello") # "Hello" 출력
elements.text_input(...) # 텍스트 입력 필드를 컨테이너 내에서 삽입
st.help() st.help()는 특정 객체나 함수에 대한 설명서나 도움말을 스트림릿 화면에 표시합니다. 주로 파이썬 라이브러리나 함수의 사용법을 표시할 때 사용됩니다. 특징: 객체나 함수에 대한 문서화된 정보를 제공합니다. 사용법, 매개변수, 반환값 등 상세한 내용을 자동으로 출력합니다. 적용 가능한 수식:
st.help(pandas.DataFrame) # pandas.DataFrame에 대한 도움말 표시
st.get_option() st.get_option()은 스트림릿의 설정 옵션을 가져오는 함수입니다. 설정된 값을 반환합니다. 특징: key로 지정된 설정값을 반환합니다. 사용자 정의 옵션을 저장하고 활용할 때 유용합니다. 적용 가능한 수식:
st.get_option("theme") # "theme"에 대한 설정값을 반환
st.set_option() st.set_option()은 스트림릿의 설정값을 변경하는 함수입니다. 특징: key에 해당하는 설정값을 value로 변경합니다. 스트림릿의 기본 설정을 수정할 수 있습니다. 적용 가능한 수식:
st.set_option("theme", "dark") # "theme"을 "dark"로 설정
st.set_page_config() st.set_page_config()는 스트림릿 애플리케이션의 페이지 레이아웃, 제목, 아이콘 등을 설정하는 함수입니다. 특징: 페이지의 레이아웃을 wide나 centered로 설정할 수 있습니다. 페이지의 타이틀과 아이콘도 설정할 수 있습니다. 적용 가능한 수식:
st.set_page_config(layout="wide") # 페이지 레이아웃을 "wide"로 설정
st.query_params st.query_params는 URL 쿼리 파라미터를 다룰 때 사용하는 객체입니다. URL에서 파라미터를 가져오거나 설정할 수 있습니다. 특징: st.query_params.get()을 사용해 특정 키의 값을 가져올 수 있습니다. st.query_params.from_dict()로 딕셔너리에서 값을 가져오거나, st.query_params.clear()로 쿼리 파라미터를 제거할 수 있습니다. 적용 가능한 수식:
st.query_params["key"] # 특정 키에 해당하는 값 가져오기
st.query_params.from_dict(params_dict) # 딕셔너리에서 파라미터 설정
st.query_params.get_all("key") # 동일한 키에 대한 모든 값 가져오기
st.query_params.clear() # 쿼리 파라미터 제거
st.html() st.html()은 HTML 코드를 스트림릿 앱 내에 직접 삽입하여 화면에 출력하는 함수입니다. 특징: HTML 태그를 포함한 콘텐츠를 삽입할 수 있습니다. 다른 스트림릿 위젯이나 요소와 함께 사용할 수 있습니다. 적용 가능한 수식:
st.connection() st.connection() 함수는 스트림릿에서 데이터베이스와의 연결을 설정할 때 사용됩니다. 이 함수는 여러 종류의 데이터베이스와 연결할 수 있는 기능을 제공하며, 데이터베이스 연결에 필요한 다양한 설정을 처리할 수 있습니다. 특징: st.connection()은 연결하려는 데이터베이스의 유형과 연결 정보를 지정하는 인자를 받습니다. 이 함수는 특정 데이터베이스(예: SQL, Snowflake 등)와의 연결을 생성할 수 있습니다. 연결 후, 쿼리를 실행하거나 데이터를 읽고 쓸 수 있는 객체를 반환합니다. 적용 가능한 수식:
# SQL 데이터베이스와 연결
conn = st.connection("pets_db", type="sql") # SQL 데이터베이스에 연결
conn = st.connection("sql") # SQL 연결을 기본으로 설정
# Snowflake 데이터베이스와 연결
conn = st.connection("snowflake") # Snowflake에 연결
MyConnection 클래스 MyConnection 클래스는 BaseConnection을 상속받아, 사용자 정의 데이터베이스 연결 객체를 생성하는 방법을 보여줍니다. 이 클래스는 _connect 메서드를 통해 실제 연결을 설정하고, query 메서드를 사용하여 쿼리를 실행하는 기능을 제공합니다. 특징: BaseConnection을 상속받아 데이터베이스 연결을 처리하는 방식입니다. _connect() 메서드는 데이터베이스에 연결하는 로직을 구현합니다. query() 메서드는 데이터베이스에서 쿼리를 실행하는 데 사용됩니다. 적용 가능한 수식:
# 사용자 정의 연결 클래스 정의
class MyConnection(BaseConnection[myconn.MyConnection]):
def _connect(self, **kwargs) -> MyConnection:
return myconn.connect(**self._secrets, **kwargs) # 실제 데이터베이스 연결
def query(self, query):
return self._instance.query(query) # 연결된 데이터베이스 인스턴스에서 쿼리 실행
st.connection()은 스트림릿에서 데이터베이스와의 연결을 설정하는 함수로, 다양한 데이터베이스를 지원하며 연결 객체를 반환합니다. MyConnection 클래스는 사용자 정의 클래스이며, BaseConnection을 상속받아 데이터베이스 연결과 쿼리 실행을 처리하는 메서드를 제공합니다. st.connection()을 사용하면 데이터베이스와의 연결을 쉽게 설정하고, 해당 연결을 통해 데이터를 조회하거나 수정할 수 있습니다.
def _connect(self, kwargs) -> MyConnection:에서 -> MyConnection은 함수의 반환 타입을 지정하는 부분입니다. 이는 타입 힌트(Type Hint)라고 불리며, 해당 함수가 무엇을 반환할지를 명시적으로 나타냅니다. 설명: def _connect(self, **kwargs): 함수 정의 부분으로, self는 클래스 내부에서 메서드를 정의할 때 첫 번째 인자로 사용되며, kwargs는 키워드 인자를 받아들이는 부분입니다. -> MyConnection: 이 부분은 함수가 MyConnection 타입의 값을 반환한다는 것을 나타냅니다. 즉, _connect 메서드는 MyConnection 객체를 반환할 것이라고 예상할 수 있습니다. 중요한 점은 _connect 함수가 반환하는 객체가 connection 변수이고, 이 변수는 MyConnection 클래스의 인스턴스라는 것입니다. 이 인스턴스는 MyConnection 타입을 가진다고 명시되어 있기 때문에, -> MyConnection이 함수의 반환 타입으로 설정된 것입니다.
Optimize performance 데이터 캐싱을 사용하여 성능을 최적화하는 방법이며. 데이터나 자원의 계산이 비용이 많이 들고 반복적으로 발생할 때, 캐시를 사용하여 이전에 계산된 값을 재사용함으로써 성능을 향상시킬 수 있습니다. Cache data objects
# E.g. Dataframe computation, storing downloaded data, etc.
@st.cache_data
def foo(bar):
# Do something expensive and return data
return data
# Executes foo
d1 = foo(ref1)
# Does not execute foo
# Returns cached item by value, d1 == d2
d2 = foo(ref1)
# Different arg, so function foo executes
d3 = foo(ref2)
# Clear the cached value for foo(ref1)
foo.clear(ref1)
# Clear all cached entries for this function
foo.clear()
# Clear values from *all* in-memory or on-disk cached functions
st.cache_data.clear()
@st.cache_data 데코레이터는 주어진 함수의 출력값을 캐시하여 동일한 인자가 주어졌을 때 다시 계산하지 않고 캐시된 값을 반환합니다. 데이터 계산이 반복적으로 일어날 때 유용하게 사용할 수 있습니다. 특징: 함수의 출력값을 인자로 캐시합니다. 동일한 입력값이 주어지면 캐시된 결과를 반환하고, 입력값이 달라지면 함수를 다시 실행합니다. clear() 메서드를 사용하여 특정 캐시를 삭제하거나 모든 캐시를 삭제할 수 있습니다. 적용 가능한 수식:
@st.cache_data
def foo(bar):
# 복잡한 작업을 수행하고 데이터를 반환
return data
# ref1 인자로 foo 실행
d1 = foo(ref1)
# 동일한 입력 ref1 사용, foo를 재실행하지 않고 캐시된 값 반환
# d1 == d2
d2 = foo(ref1)
# 다른 입력 ref2 사용, foo 다시 실행
d3 = foo(ref2)
# foo(ref1)에 대한 캐시 삭제
foo.clear(ref1)
# 이 함수의 모든 캐시된 값 삭제
foo.clear()
# 메모리와 디스크에 저장된 모든 데이터 캐시 삭제
st.cache_data.clear()
@st.cache_data는 foo 함수의 출력값을 캐시합니다. 동일한 인자(ref1)가 전달되면 foo(ref1)을 다시 실행하지 않고 캐시된 결과를 반환합니다. foo.clear(ref1)는 특정 캐시를 지우고, foo.clear()는 해당 함수의 모든 캐시를 지웁니다. st.cache_data.clear()는 전체 앱에서 모든 데이터 캐시를 삭제합니다.
Cache global resources
# E.g. TensorFlow session, database connection, etc.
@st.cache_resource
def foo(bar):
# Create and return a non-data object
return session
# Executes foo
s1 = foo(ref1)
# Does not execute foo
# Returns cached item by reference, s1 == s2
s2 = foo(ref1)
# Different arg, so function foo executes
s3 = foo(ref2)
# Clear the cached value for foo(ref1)
foo.clear(ref1)
# Clear all cached entries for this function
foo.clear()
# Clear all global resources from cache
st.cache_resource.clear()
@st.cache_resource 데코레이터는 데이터가 아닌 글로벌 자원(예: TensorFlow 세션, 데이터베이스 연결 등)을 캐시할 때 사용됩니다. 이 방법은 세션과 같은 상태를 캐시하여 재사용할 수 있도록 합니다. 특징: 함수가 반환하는 "자원"을 캐시합니다. 데이터 객체와는 달리, 캐시된 자원은 객체를 참조하는 방식으로 반환됩니다. 동일한 인자로 함수가 호출될 경우, 새로 실행되지 않고 이미 캐시된 자원을 반환합니다. 자원을 삭제할 때 clear() 메서드를 사용하여 캐시를 삭제할 수 있습니다. 적용 가능한 수식:
@st.cache_resource
def foo(bar):
# 데이터가 아닌 자원(예: 세션)을 생성하고 반환
return session
# ref1 인자로 foo 실행, 세션 생성 및 캐시
s1 = foo(ref1)
# 동일한 입력 ref1 사용, foo 재실행하지 않고 캐시된 값 반환
# s1 == s2
s2 = foo(ref1)
# 다른 입력 ref2 사용, foo 다시 실행
s3 = foo(ref2)
# foo(ref1)에 대한 캐시 삭제
foo.clear(ref1)
# 이 함수의 모든 캐시된 자원 삭제
foo.clear()
# 모든 글로벌 자원 캐시 삭제
st.cache_resource.clear()
@st.cache_data 데이터 객체의 계산 결과를 캐시하여, 동일한 입력값에 대해 재계산을 방지하고 성능을 최적화합니다. @st.cache_resource 데이터가 아닌 글로벌 자원(예: 세션, 데이터베이스 연결 등)을 캐시하여 동일한 입력값에 대해 재사용할 수 있도록 합니다.
Display progress and status Streamlit 앱에서 작업의 진행 상황을 시각적으로 알리고 상태를 표시하거나 사용자와 상호작용하는 방법을 설명합니다.
# Show a spinner during a process
with st.spinner(text="In progress"):
time.sleep(3)
st.success("Done")
# Show and update progress bar
bar = st.progress(50)
time.sleep(3)
bar.progress(100)
with st.status("Authenticating...") as s:
time.sleep(2)
st.write("Some long response.")
s.update(label="Response")
st.balloons()
st.snow()
st.toast("Warming up...")
st.error("Error message")
st.warning("Warning message")
st.info("Info message")
st.success("Success message")
st.exception(e)
st.spinner 작업이 진행 중임을 나타내는 스피너(로딩 표시)를 표시합니다. 특징: 컨텍스트 매니저(with) 내에서 작업이 실행되는 동안 로딩 애니메이션을 표시합니다. 작업이 완료되면 애니메이션이 사라집니다. 데이터 로딩, API 호출, 복잡한 연산 등을 수행하는 동안 사용자에게 진행 중임을 알리는 데 사용됩니다.
with st.spinner(text="In progress"):
time.sleep(3)
st.success("Done")
st.progress 진행률을 나타내는 프로그레스 바를 표시합니다. 특징: 초기 상태의 진행률(%)을 설정할 수 있습니다. bar.progress() 메서드를 사용하여 값을 업데이트할 수 있습니다. 대량의 데이터 처리, 파일 다운로드, 반복 작업 등을 시각적으로 표현할 때 유용합니다. 적용 가능한 수식:
bar = st.progress(50)
time.sleep(3)
bar.progress(100)
st.status 작업 상태를 표시하는 상태 메시지를 나타냅니다. 특징: 컨텍스트 매니저(with)를 사용하여 작업 중 상태를 관리할 수 있습니다. update() 메서드를 통해 상태 레이블을 동적으로 변경할 수 있습니다. 로그인 상태, 데이터 처리 상태 등 긴 작업의 중간 상태를 사용자에게 알릴 때 적합합니다. 적용 가능한 수식:
with st.status("Authenticating...") as s:
time.sleep(2)
st.write("Some long response.")
s.update(label="Response")
st.balloons 작업이 성공적으로 완료되었음을 축하하는 애니메이션 효과(풍선)를 표시합니다. 특징: 사용자에게 긍정적인 피드백을 시각적으로 제공합니다. 애니메이션은 자동으로 사라집니다. 특정 작업(예: 파일 업로드, 처리 완료 등) 후 축하 메시지로 사용됩니다. 적용 가능한 수식:
st.balloons()
st.snow 화면에 눈이 내리는 애니메이션 효과를 표시합니다. 특징: 앱의 시각적 매력을 높이기 위한 장식적인 효과입니다. 계절별 이벤트(예: 크리스마스)나 특별한 테마를 위해 사용됩니다. 적용 가능한 수식:
st.snow()
st.toast 화면에 간단한 알림 메시지를 표시합니다. 특징: 짧은 기간 동안 사용자에게 정보를 전달합니다. 별도의 작업 진행을 나타낼 필요가 없는 간단한 메시지에 적합합니다. 경고, 간단한 알림, 성공/실패 상태를 알리는 데 유용합니다. 적용 가능한 수식:
st.toast("Warming up...")
상태 메시지 공통 역할: 사용자에게 특정 상태를 알리는 텍스트 기반의 메시지입니다. 설명: st.error("Error message"): 오류 메시지를 빨간색으로 표시합니다. st.warning("Warning message"): 경고 메시지를 노란색으로 표시합니다. st.info("Info message"): 정보 메시지를 파란색으로 표시합니다. st.success("Success message"): 성공 메시지를 녹색으로 표시합니다. st.exception(e): 예외 객체(e)의 세부 정보를 표시합니다. 특징: 상태별로 색상과 형식이 다르게 표시됩니다. 사용자에게 작업 상태를 명확하게 전달할 수 있습니다. 적용 가능한 수식: 오류 알림, 정보 전달, 성공 상태 확인 등에 사용됩니다.
Personalize apps for users 사용자의 이메일 주소에 따라 조건부로 콘텐츠를 표시하고, 앱의 쿠키 및 헤더 정보를 가져오는 방법을 설명합니다.
# Show different content based on the user's email address.
if st.experimental_user.email == "jane@examples.com":
display_jane_content()
elif st.experimental_user.email == "adam@example.com":
display_adam_content()
else:
st.write("Please contact us to get access!")
# Get dictionaries of cookies and headers
st.context.cookies
st.context.headers
이메일 주소 기반 콘텐츠 표시 사용자의 이메일 주소를 확인하여 개인화된 콘텐츠를 동적으로 표시합니다. 특징: 권한 관리: 특정 사용자만 앱의 일부 콘텐츠에 접근하도록 설정. 개인화 콘텐츠: 사용자의 이메일 기반으로 개인 맞춤형 데이터를 제공. st.experimental_user.email 속성을 사용하여 사용자의 이메일을 확인합니다. 조건문을 통해 특정 사용자에게 맞춤형 콘텐츠를 제공할 수 있습니다. 이메일 주소가 등록되지 않은 경우 기본 메시지를 표시합니다. 적용 가능한 수식:
if st.experimental_user.email == "jane@examples.com":
display_jane_content()
elif st.experimental_user.email == "adam@example.com":
display_adam_content()
else:
st.write("Please contact us to get access!")
st.context.cookies 앱에서 사용되는 쿠키 정보를 딕셔너리 형태로 반환합니다. 특징: 사용자 세션 추적. 웹 애플리케이션에서 상태 관리. 쿠키 데이터를 읽어와 세션 관리나 사용자 추적에 활용할 수 있습니다. 보안과 개인정보 보호를 위해 쿠키 정보를 처리할 때 주의가 필요합니다. 적용 가능한 수식:
st.context.cookies
st.context.headers 앱의 HTTP 요청 헤더 정보를 딕셔너리 형태로 반환합니다. 특징: 사용자 에이전트 기반 UI 최적화. 요청의 메타정보 분석. 사용자의 요청 헤더를 읽어 특정 클라이언트 정보(예: 브라우저 종류, 언어 설정)를 확인할 수 있습니다. 헤더 데이터를 기반으로 사용자 경험을 최적화하는 데 사용됩니다. 적용 가능한 수식:
