Zenn
🙆‍♀️

【Streamlit】サクッとアプリ開発

2025/04/02に公開
Python
Web
Streamlit
フレームワーク
tech

Streamlit

概要

  • PythonのWeb UI フレームワーク
    • フロントエンド（HTML/CSS/Javascript）の知識０でもフロントエンド開発が可能。
    • 他ライブラリとの互換性が高い（特に機械学習、データサイエンス領域）
      • 例）PyTorch, TensorFlow, pandas, ...

環境構築

  • インストール
pip3 install streamlit
  • バージョン確認
streamlit --version

デモアプリの起動

  • 公式が公開しているサンプルを起動する。
  • 実装コードも記載されているため、実装の参考にもできる。
デモアプリ
  • 起動コマンド
streamlit hello
  • デモアプリ（Top画面）
  • デモアプリ（マッピングデモ）

やってみる

Part1：まずは hello world
app.py
import streamlit as st

st.write("hello world")
  • 起動コマンド
streamlit run app.py
  • 起動画面
Part2：ラジオボタンとカレンダー
app.py
import streamlit as st

# ラジオボタン
radio = st.radio(
    "ラジオボタン",
    options = [
        ":rainbow[ボタン１]", 
        "***ボタン２***",
        "ボタン３ :movie_camera:"
    ],
    captions=[
        "ボタン１のキャプション",
        "ボタン２のキャプション",
        "ボタン３のキャプション",
    ],
)

if radio == ":rainbow[ボタン１]":
    st.write("ボタン１が選択されています")
else:
    st.write("ボタン１が選択されていません")
print(radio)

# 日付入力
date = st.date_input(
    "日付入力",
    value =None
    )
st.write("選択された日付:", date)
  • 起動画面（1）
  • 起動画面（2）
Part3: セッション管理

streamlitのコンポーネントは、アプリケーション状態を保持しない(= Stateless)なため、状態を保持する必要がある際は、session_stateを使用する。

app.py
import streamlit as st


if 'clicked' not in st.session_state:
    st.session_state.clicked = False

def click_button():
    if st.session_state.clicked == False:
        st.session_state.clicked = True
    else:
        st.session_state.clicked = False

st.button(
    'Click me',
    on_click=click_button,
    )

if st.session_state.clicked:
    st.write('ボタンがクリックされました！')

  • 起動画面（ボタンクリック前）

  • 起動画面（ボタンクリック後）

Tips

  • プレイグラウンド
    • ブラウザ上（=環境構築不要）でStreamlitの挙動を確認できる。
  • チートシート
    • カテゴリ別にコンポーネントがまとめられている。（ありがたい）

著者

  • キャリア：エンジニア２年目
  • 言語：Python, TypeScript（React）

Discussion