Streamlit 구성 요소 소개

Name

Olaf Källström

Updated on 2023. 7. 24.

Streamlit은 데이터 과학자와 개발자가 머신 러닝 및 데이터 과학을 위한 대화형하고 사용자 친화적인 웹 애플리케이션을 생성할 수 있는 강력한 오픈 소스 라이브러리입니다. 이러한 응용프로그램의 핵심은 사용자가 제시된 데이터를 조작하고 상호작용할 수 있는 상호작용식 위젯인 Streamlit 구성 요소입니다.

Streamlit 구성 요소는 Streamlit 응용프로그램의 구성 요소입니다. 이들은 사용자 인터페이스를 제공하여 사용자가 다양한 방법으로 애플리케이션과 상호작용할 수 있게 합니다. 간단한 버튼 및 체크박스부터 더 복잡한 폼 및 테이블까지, Streamlit 구성 요소는 대화형 및 동적 데이터 과학 애플리케이션을 생성하기 위한 다양한 가능성을 제공합니다.

Streamlit 앱을 Tableau로 변환해주는 멋진 데이터 분석 및 데이터 시각화 도구인 PyGWalker를 들어보셨나요?

PyGWalker (opens in a new tab)는 자체 Streamlit 앱으로 Tableau와 유사한 UI를 손쉽게 포함할 수 있도록 도와주는 파이썬 라이브러리입니다. Coding is Fun (opens in a new tab)의 Sven이 제작한 이 놀라운 비디오에서 이 강력한 데이터 시각화 파이썬 라이브러리를 Streamlit 앱에 통합하는 자세한 단계를 확인해보세요!

Sven과 그의 훌륭한 공헌 (opens in a new tab)에 특히 감사드립니다. PyGWalker 커뮤니티를 확인해보세요!

또한 PyGWalker GitHub 페이지 (opens in a new tab)에서 PyGWalker의 더 많은 예제를 확인할 수도 있습니다.

Streamlit의 상호작용 위젯

Streamlit에서 위젯은 사용자 상호작용의 주요 수단입니다. 이를 통해 사용자는 데이터를 입력하고 선택하며 애플리케이션의 동작을 제어할 수 있습니다. Streamlit은 버튼, 체크박스, 텍스트 입력, 슬라이더 등 다양한 위젯을 제공합니다. 각 위젯은 특정 목적을 제공하며 애플리케이션의 요구에 맞게 사용자 정의할 수 있습니다.

Streamlit의 위젯은 단지 사용자 입력에 대한 것뿐만 아니라 데이터 및 기타 정보를 표시하는 데에도 사용될 수 있습니다. 예를 들어, 테이블 위젯은 데이터 프레임을 표시하는 데 사용할 수 있으며, 마크다운 위젯은 서식이 있는 텍스트를 표시하는 데 사용할 수 있습니다. 이러한 유연성은 위젯을 사용하여 대화형 및 동적 데이터 과학 애플리케이션을 생성하기 위한 강력한 도구입니다.

Streamlit 구성 요소의 깊은 이해

Streamlit 버튼

Streamlit 버튼은 간단하지만 강력한 구성 요소입니다. 이를 통해 사용자는 스크립트를 실행하거나 화면을 업데이트하는 등의 동작을 트리거할 수 있습니다. 버튼 구성 요소는 st.button 함수를 사용하여 정의되며, 버튼 레이블을 위한 문자열 인수가 필요합니다.

import streamlit as st
 
if st.button('Click Me'):
    st.write('Button clicked!')

이 예제에서 'Click Me'라는 레이블이 있는 버튼을 클릭하면, 'Button clicked!'라는 메시지가 화면에 표시됩니다. 이 간단한 메커니즘은 더 복잡한 동작을 트리거하는 데에 사용될 수 있어, 버튼은 Streamlit 응용프로그램에서 다양한 용도로 활용될 수 있는 다재다능한 구성 요소입니다.

Streamlit 컬럼

Streamlit 컬럼을 사용하면 애플리케이션의 레이아웃을 더 효율적으로 조직할 수 있습니다. st.columns 함수를 사용하여 애플리케이션을 여러 컬럼으로 나누고 각 컬럼에 다른 구성 요소를 배치할 수 있습니다.

import streamlit as st
 
col1, col2 = st.columns(2)
 
with col1:
    st.write('This is column 1')
 
with col2:
    st.write('This is column 2')

이 예제에서는 애플리케이션이 두 개의 컬럼으로 나누어집니다. 첫 번째 컬럼은 'This is column 1'이라는 텍스트를 표시하고, 두 번째 컬럼은 'This is column 2'를 표시합니다. 이를 통해 보다 복잡한 레이아웃을 생성하고 애플리케이션의 사용자 경험을 개선할 수 있습니다.

Streamlit 폼

Streamlit 폼은 관련된 입력 위젯을 그룹화하고 그 값들을 일괄적으로 제출하는 방법입니다. 이는 함께 제출해야 하는 여러 입력이 있는 경우 특히 유용합니다.

import streamlit as st
 
with st.form(key='my_form'):
    text_input = st.text_input(label='Enter some text')
    submit_button = st.form_submit_button(label='Submit')

이 예제에서는 텍스트 입력 필드와 제출 버튼이 있는 폼을 생성합니다. 제출 버튼을 클릭하면 폼 내의 모든 입력이 함께 제출됩니다.

Streamlit 테이블

Streamlit 테이블은 구조화된 형식으로 데이터를 표시하는 방법을 제공합니다. st.table 함수를 사용하여 Streamlit에서 테이블을 생성할 수 있으며, 데이터 프레임이나 딕셔너리를 입력으로 사용합니다.

import streamlit as st
import pandas as pd
 
data = {'이름': ['John', 'Anna', 'Peter'],
        '나이': [28, 23, 35]}
 
df = pd.DataFrame(data)
 
st.table(df)

이 예제에서는 pandas 라이브러리를 사용하여 데이터 프레임을 생성하고, 이를 Streamlit 애플리케이션에서 테이블로 표시합니다. 테이블은 데이터를 행과 열로 명확하게 표시하여 사용자가 이해하기 쉽게 합니다.

Streamlit 체크박스

Streamlit 체크박스는 사용자가 이진 옵션을 전환할 수 있는 구성 요소입니다. 이를 통해 추가 정보를 표시하거나 숨기는 등 애플리케이션의 동작을 제어할 수 있습니다. 체크박스 구성 요소는 체크박스 레이블을 위한 문자열 인수가 필요한 st.checkbox 함수를 사용하여 정의합니다.

import streamlit as st
 
if st.checkbox('자세한 내용 보기'):
    # 상세 정보 표시 코드

import streamlit as st
 
st.write('세부 정보는 다음과 같습니다...')

이 예제에서는 '세부 정보를 표시합니다'라는 메시지가 화면에 표시됩니다. 이 메시지는 사용자의 기호에 따라 추가 정보의 가시성을 제어하는 데 사용할 수 있습니다.

Streamlit 텍스트 입력

Streamlit 텍스트 입력은 사용자가 한 줄의 텍스트를 입력할 수 있는 구성 요소입니다. 사용자 입력(예: 검색 쿼리 또는 양식 응답)을 캡처하는 데 사용할 수 있습니다. 텍스트 입력 구성 요소는 입력 레이블을 위한 문자열 인수를 사용하여 st.text_input 함수를 사용하여 정의됩니다.

import streamlit as st
 
title = st.text_input('영화 제목', '브라이언의 삶')
st.write('현재 영화 제목은', title)

이 예제에서는 '영화 제목'이라는 레이블이 있는 텍스트 입력 필드가 '브라이언의 삶'이라는 기본 값으로 생성됩니다. 텍스트 입력 필드의 값은 응용 프로그램에서 액세스하고 사용할 수 있으며, 현재 영화 제목을 표시하는 메시지에 나와 있습니다.

Streamlit 마크다운

Streamlit 마크다운은 마크다운 구문에 따라 서식이 지정된 텍스트를 표시할 수 있는 구성 요소입니다. 이를 사용하여 제목, 굵은 텍스트, 기울임 텍스트, 목록, 링크 등을 표시할 수 있습니다. 마크다운 구성 요소는 st.markdown 함수를 사용하여 정의되며, 마크다운 형식의 텍스트가 포함된 문자열 인수를 사용합니다.

import streamlit as st
 
st.markdown('## 이것은 제목입니다')
st.markdown('이것은 **굵은** 텍스트입니다')

이 예제에서는 마크다운 구문을 사용하여 제목과 굵은 텍스트를 표시합니다. 이를 통해 Streamlit 애플리케이션에서 서식이 있는 텍스트를 생성할 수 있습니다.

Streamlit 다중 선택

Streamlit 다중 선택은 사용자가 목록에서 여러 옵션을 선택할 수 있는 구성 요소입니다. 데이터 필터링, 정보의 표시 제어 등에 사용할 수 있습니다. 다중 선택 구성 요소는 입력 레이블을 위한 문자열 인수와 옵션 목록을 사용하여 st.multiselect 함수를 사용하여 정의됩니다.

import streamlit as st
 
options = st.multiselect(
    '좋아하는 색상은 무엇입니까',
    ['녹색', '노랑', '빨강', '파랑'],
    ['노랑', '빨강']
)
st.write('선택한 색상:', options)

이 예제에서는 네 가지 옵션을 포함하는 '좋아하는 색상은 무엇입니까'라는 다중 선택 필드가 생성됩니다. 사용자는 여러 옵션을 선택할 수 있으며, 선택한 옵션은 화면에 표시됩니다.

Streamlit 컨테이너

Streamlit 컨테이너는 관련된 구성 요소를 그룹화하는 방법입니다. 더 복잡한 레이아웃을 만들고 구성 요소의 표시를 더 정리된 방식으로 관리하는 데 사용할 수 있습니다. 컨테이너 구성 요소는 인수를 사용하지 않는 st.container 함수를 사용하여 정의됩니다.

import streamlit as st
 
with st.container():
    st.write('이것은 컨테이너 안에 있습니다')
    st.button('클릭')

이 예제에서는 텍스트와 버튼 구성 요소가 포함된 컨테이너가 생성됩니다. 컨테이너 내부의 구성 요소는 함께 표시되므로 보다 복잡한 레이아웃을 만들고 응용 프로그램의 구성을 개선할 수 있습니다.

Streamlit 구성 요소 사용을 위한 모범 사례

Streamlit 구성 요소를 응용 프로그램에 통합할 때 최적의 성능과 사용자 경험을 보장하기 위해 특정 모범 사례를 준수하는 것이 중요합니다. 다음은 고려해야 할 몇 가지 핵심 사항입니다:

• 사용자 경험: 항상 사용자 경험을 우선시하십시오. 직관적인 방식으로 구성 요소를 구성하고 명확한 레이블과 지침을 제공하십시오. 이렇게 하면 사용성이 향상되며 각 구성 요소에 컨텍스트가 추가됩니다.

## 좋은 예: 명확한 레이블과 지침
st.markdown('### 세부 정보를 입력하세요')
name = st.text_input('이름')
email = st.text_input('이메일')

• 성능: 구성 요소의 잠재적인 성능 영향을 인식하십시오. 일부 구성 요소(예: 양식 및 테이블)은 리소스를 많이 사용할 수 있으며, 사용이 적절하지 않으면 응용 프로그램의 성능이 느려질 수 있습니다. 구성 요소를 최적화하고 적절하게 사용하여 원활하고 응답성 있는 사용자 경험을 유지하도록 노력하십시오.

## 나쁜 예: 큰 테이블
st.table(큰_데이터프레임)
 
## 좋은 예: 페이지네이션과 함께 최적화된 테이블
for i in range(0, len(큰_데이터프레임), 100):
    st.table(큰_데이터프레임[i:i+100])

• 테스트: 구성 요소를 철저히 테스트하는 것이 중요합니다. 예상대로 작동하고 사용자 입력을 정상적으로 처리해야 합니다. 이는 극단적인 경우에 대한 테스트와 오류를 적절하게 처리하는 것을 포함합니다.

## 좋은 예: 오류 처리
try:
    result = some_function(user_input)
except SomeError as e:
    st.error(f'오류가 발생했습니다: {e}')

Streamlit 구성 요소의 현실적인 응용

Streamlit 구성 요소는 상호 작용 및 사용자 참여를 향상시키는 다양한 현실적인 응용에 사용됩니다. 몇 가지 예를 살펴보겠습니다:

• 데이터 과학: Streamlit 구성 요소는 인터랙티브 대시보드와 데이터 탐색 도구를 만드는 데 자주 사용됩니다. 사용자는 슬라이더, 체크박스 및 드롭다운을 사용하여 데이터를 필터링하고 조작할 수 있으며, 테이블 및 차트를 사용하여 결과를 표시할 수 있습니다.

## 예제: 데이터 탐색 도구
selected_data = data[st.multiselect('열 선택', data.columns)]
st.line_chart(selected_data)

• 머신러닝: Streamlit 구성 요소는 인터랙티브한 모델 탐색 도구를 만드는 데 사용됩니다. 사용자는 매개 변수를 입력하고 모델을 실행하며 결과를 동일한 응용 프로그램에서 확인할 수 있습니다. 이렇게 하면 머신러닝 모델을 이해하고 해석하는 데 도움이 됩니다.

## 예제: 모델 탐색 도구
params = st.sidebar.slider('모델 매개 변수', 0, 10)
model = train_model(params)
st.write('모델 점수:', model.score(X, y))

• 웹 개발: Streamlit 구성 요소는 동적이고 인터랙티브한 웹 애플리케이션을 만드는 데 사용됩니다. 간단한 양식과 버튼부터 여러 컨테이너를 포함한 복잡한 레이아웃까지 Streamlit 구성 요소는 매력적인 웹 경험을 만드는 다양한 가능성을 제공합니다.

## 예제: 웹 애플리케이션
with st.container():
 
st.header('내 앱에 오신 것을 환영합니다!')
    if st.button('나를 클릭해보세요'):
        st.balloons()

이러한 애플리케이션에서의 핵심은 Streamlit 구성 요소를 사용하여 사용자 경험을 향상시키고 응용 프로그램을 더 상호 작용적으로 만들며 사용자가 의미 있는 방식으로 데이터와 상호 작용할 수 있도록 하는 것입니다.

Streamlit 구성 요소의 실제 응용

Streamlit 구성 요소는 다양한 실제 응용 프로그램에서 사용됩니다. 예를 들어 데이터 과학에서는 인터랙티브 대시 보드 및 데이터 탐색 도구를 만드는 데 자주 사용됩니다. 사용자는 슬라이더, 체크 박스 및 드롭 다운을 사용하여 데이터를 필터링하고 조작할 수 있으며, 테이블과 차트는 결과를 표시하는 데 사용됩니다.

• 머신 러닝에서는 Streamlit 구성 요소를 사용하여 인터랙티브한 모델 탐색 도구를 만듭니다. 사용자는 매개 변수를 입력하고 모델을 실행하며 결과를 동일한 애플리케이션에서 모두 볼 수 있습니다. 이를 통해 머신 러닝 모델을 이해하고 해석하기가 더 쉬워집니다.

• 웹 개발에서는 Streamlit 구성 요소를 사용하여 동적이고 인터랙티브한 웹 애플리케이션을 만듭니다. 단순한 폼과 버튼부터 여러 컨테이너를 갖는 복잡한 레이아웃까지, Streamlit 구성 요소는 매력적인 웹 경험을 만들기 위한 다양한 가능성을 제공합니다.

이러한 모든 응용 프로그램에서의 핵심은 Streamlit 구성 요소를 사용하여 사용자 경험을 향상시키고 응용 프로그램을 더 상호 작용적으로 만들며 사용자가 의미 있는 방식으로 데이터와 상호 작용할 수 있도록 하는 것입니다.

결론

Streamlit 구성 요소는 인터랙티브한 데이터 과학 응용 프로그램의 구성 요소입니다. 단순한 버튼 및 체크 박스부터 복잡한 폼 및 테이블까지, 동적이고 매력적인 사용자 인터페이스를 만들기 위한 다양한 가능성을 제공합니다. 이러한 구성 요소를 이해하고 효과적으로 사용함으로써 사용자가 의미 있는 방식으로 데이터와 상호 작용할 수 있는 강력한 애플리케이션을 만들 수 있습니다.

대화식 대시 보드를 만들고자 하는 데이터 과학자, 모델 탐색 도구를 구축하려는 머신 러닝 엔지니어, 동적 웹 애플리케이션을 만들고자 하는 웹 개발자이든, Streamlit 구성 요소를 사용하면 문제를 해결할 수 있습니다. 언제나 사용자 경험을 고려하고 성능에 주의하며 구성 요소를 철저히 테스트하는 것을 기억하세요. 이런 모범 사례를 염두에 두고 Streamlit 구성 요소를 숙달하는 길에 있습니다.

스트림릿 앱을 Tableau로 변환해주는 멋진 데이터 분석 및 데이터 시각화 도구인가요?

PyGWalker (opens in a new tab)는 Tableau와 비슷한 UI를 사용하여 스트림릿 앱을 쉽게 임베드할 수 있는 파이썬 라이브러리입니다.

(opens in a new tab)

자주 묻는 질문

1. 스트림릿의 단점은 무엇인가요?

스트림릿은 인터랙티브한 데이터 과학 응용 프로그램을 구축하기 위한 강력한 도구이지만, 몇 가지 제한 사항이 있습니다. 예를 들어 복잡한 다중 페이지 응용 프로그램을 만들기 위해 설계되지 않았으며, 기본으로 사용자 인증 또는 세션 관리를 지원하지 않습니다. 또한, 스트림릿은 서버 측에서 실행되기 때문에 대규모 데이터나 복잡한 계산에 대한 클라이언트 측 JavaScript 응용 프로그램보다 응답이 느릴 수 있습니다.

2. 스트림릿 앱을 어떻게 구조화해야 하나요?

스트림릿 앱은 "스크립트 실행" 개념을 중심으로 구조화됩니다. 사용자가 위젯과 상호 작용할 때 전체 스크립트가 위에서 아래로 다시 실행됩니다. 이는 코드가 간단하고 선형적으로 되어 있으며 전통적인 파이썬 스크립트와 유사합니다. 그러나 코드를 구조화하기 위해 함수와 클래스를 사용할 수도 있으며, st.cache 데코레이터를 사용하여 장기 실행 계산의 결과를 캐시하고 불필요한 다시 실행을 방지할 수도 있습니다.

3. 스트림릿 앱의 성능을 최적화하는 방법은 무엇인가요?

스트림릿 앱의 성능을 최적화하는 여러 가지 방법이 있습니다. 하나는 st.cache 데코레이터를 사용하여 장기 실행 계산의 결과를 캐시하는 것입니다. 또 다른 방법은 st.beta_columns 함수를 사용하여 여러 열을 만들고 구성 요소의 렌더링을 병렬화하는 것입니다. st.experimental_memo 함수를 사용하여 함수 호출을 메모이즈하고 불필요한 다시 계산을 피할 수도 있습니다. 마지막으로, 데이터의 크기와 계산의 복잡성에 유의하고 필요한 경우 더 강력한 서버를 사용하는 것을 고려하세요.