PythonだけでWebアプリを！Streamlit完全ガイド：基礎から応用まで徹底解説

近年、データサイエンスや機械学習の分野で、分析結果やモデルを迅速に共有するためのツールへの需要が高まっています。その中で、驚くべきシンプルさとスピードで注目を集めているのが、Pythonライブラリの「Streamlit」です。

Streamlitは、データサイエンティストやエンジニアが、HTML、CSS、JavaScriptといったWebフロントエンドの専門知識なしに、PythonスクリプトだけでリッチでインタラクティブなWebアプリケーションを作成できるオープンソースのフレームワークです。2019年の登場以来、その手軽さから急速にコミュニティを拡大し、2022年にはデータクラウド大手のSnowflake社に買収されたことで、その将来性と信頼性はさらに確固たるものとなりました。

他のフレームワークとの違いとメリット

PythonのWebフレームワークには、DjangoやFlaskといった強力な選択肢が存在します。これらは大規模で複雑なWebアプリケーションを構築できる反面、学習コストが高く、設定も複雑になりがちです。

一方、Streamlitは「シンプルさと速度」に徹底的にこだわっています。

このように、StreamlitはUIのカスタマイズ性にはある程度の制約があるものの、データサイエンス関連のタスクに特化することで、驚異的な生産性を実現しています。

主なユースケース

• データ分析ダッシュボード： PandasのDataFrameをインタラクティブなテーブルやグラフで表示し、インサイトを共有。
• 機械学習モデルのデモ： 画像認識や自然言語処理のモデルを、誰もが試せるUI付きで公開。
• 社内ツール： 簡単な入力フォームを持つ業務効率化ツールを数時間で作成。
• 教育用コンテンツ： アルゴリズムの動作を視覚的に説明する教材の作成。

Streamlitを始めるのは非常に簡単です。Pythonの環境さえあれば、数分後には最初のアプリを動かすことができます。

インストール

pipコマンド一つでインストールは完了します。ターミナルやコマンドプロンプトで以下のコマンドを実行してください。

pip install streamlit

Hello, World! – 最初のアプリ

インストールが完了したら、早速最初のアプリを作成してみましょう。好きな場所にapp.pyという名前のファイルを作成し、以下のコードを記述します。

import streamlit as st
import pandas as pd
import numpy as np
# タイトルを追加
st.title('My First Streamlit App')
# テキストを追加
st.write("Streamlitへようこそ！")
# データフレームを表示
df = pd.DataFrame({ '1列目':, '2列目':
})
st.write("簡単なデータフレーム:")
st.write(df)
# 折れ線グラフを表示
chart_data = pd.DataFrame( np.random.randn(20, 3), columns=['a', 'b', 'c'])
st.line_chart(chart_data)
# 地図を表示
map_data = pd.DataFrame( np.random.randn(100, 2) / + [35.69, 139.70], columns=['lat', 'lon'])
st.map(map_data)

コードを保存したら、ターミナルでそのファイルがあるディレクトリに移動し、以下のコマンドを実行します。

streamlit run app.py

コマンドを実行すると、自動的にWebブラウザが立ち上がり、作成したアプリケーションが表示されるはずです。タイトル、テキスト、テーブル、グラフ、地図が綺麗に表示されていることを確認してください。たったこれだけのコードで、リッチなWebアプリが完成しました。

Streamlitは、テキストやデータを表示するための多様なコマンドを用意しています。これらを使い分けることで、情報を整理し、見やすいアプリを作成できます。

基本的なテキスト表示

Markdown記法もサポートしており、柔軟なテキスト表現が可能です。

import streamlit as st
st.title('これはタイトルです')
st.header('これはヘッダーです')
st.subheader('これはサブヘッダーです')
st.text('これは通常のテキストです。')
st.markdown("""
### マークダウンが使えます
- 箇条書き1
- 箇条書き2
- [リンクも貼れます](https://streamlit.io)
**太字**や*イタリック*も可能です。
""")
# コードブロックの表示
st.code('''
def hello(): print("Hello, Streamlit!")
''', language='python')
# 数式の表示 (LaTeX)
st.latex(r'''
a + ar + a r^2 + a r^3 + \cdots + a r^{n-1} =
\sum_{k=0}^{n-1} ar^k =
a \frac{1-r^{n}}{1-r}
''')

データ表示の達人になる

データサイエンスの現場で頻繁に使われるPandasのDataFrameを美しく、かつインタラクティブに表示する機能はStreamlitの得意分野です。

import streamlit as st
import pandas as pd
import numpy as np
# サンプルデータフレームを作成
df = pd.DataFrame( np.random.randn(50, 20), columns=('col %d' % i for i in range(20)))
# インタラクティブなテーブル
st.subheader('st.dataframeによる表示 (インタラクティブ)')
st.dataframe(df)
# 静的なテーブル
st.subheader('st.tableによる表示 (静的)')
st.table(df.head(10)) # 先頭10行だけ表示

st.metricで重要指標をハイライト

ダッシュボードで重要な指標（KPI）を強調して表示したい場合にst.metricが役立ちます。変化量も合わせて示すことができます。

import streamlit as st
st.subheader('st.metricによるKPI表示')
col1, col2, col3 = st.columns(3)
col1.metric("気温", "25 °C", "1.2 °C")
col2.metric("風速", "9 mph", "-8%")
col3.metric("湿度", "86%", "4%", delta_color="inverse")

Streamlitの真価は、ユーザーのアクションに応じて動的に変化するインタラクティブなアプリケーションを簡単に作れる点にあります。その中心となるのが「ウィジェット」です。

ボタンとチェックボックス

import streamlit as st
# ボタン
# ボタンが押されると、その回の再実行でTrueを返す
if st.button('ここをクリック'): st.write('ボタンがクリックされました！')
# チェックボックス
# チェックが入っているとTrueを返す
if st.checkbox('データを表示する'): st.write('チェックされています。データを表示します。')

選択肢から選ばせる

ラジオボタンやセレクトボックスを使えば、複数の選択肢の中から一つまたは複数を選ばせることができます。

import streamlit as st
# ラジオボタン (単一選択)
option_radio = st.radio( '好きな果物は？', ('りんご', 'バナナ', 'オレンジ'))
st.write('あなたの選択:', option_radio)
# セレクトボックス (単一選択)
option_select = st.selectbox( 'どの交通手段を使いますか？', ('電車', 'バス', 'タクシー', '徒歩'))
st.write('あなたの選択:', option_select)
# マルチセレクト (複数選択)
options_multi = st.multiselect( '好きな色を教えてください（複数選択可）', ['緑', '黄', '赤', '青'], ['黄', '赤']) # デフォルトの選択
st.write('あなたの選択:', options_multi)

数値やテキストの入力

ユーザーから直接数値やテキストを入力してもらうためのウィジェットも豊富です。

import streamlit as st
# テキスト入力
title = st.text_input('映画のタイトル', 'ライフ・イズ・ビューティフル')
st.write('現在のタイトルは', title)
# 数値入力
age = st.number_input('年齢を入力してください', min_value=0, max_value=130, value=25, step=1)
st.write('あなたの年齢は', age, '歳です。')
# テキストエリア
txt = st.text_area('自己紹介', '''ここに自己紹介を記入してください。''', height=200)
# スライダー
x = st.slider('値を選択してください', 0.0, 100.0, 25.0)
st.write(f"選択された値: {x}")

ファイルアップロード

ユーザーにファイルをアップロードさせ、そのデータを処理することも可能です。画像処理アプリやCSV分析ツールなどで威力を発揮します。

import streamlit as st
from PIL import Image
import pandas as pd
uploaded_file = st.file_uploader("ここにファイルをアップロードしてください", type=['png', 'jpg', 'csv'])
if uploaded_file is not None: # ファイルのタイプによって処理を分岐 if uploaded_file.type == "text/csv": df = pd.read_csv(uploaded_file) st.write("アップロードされたCSVデータ:") st.dataframe(df) else: image = Image.open(uploaded_file) st.image(image, caption='アップロードされた画像', use_column_width=True)

データは視覚化することで、より多くのインサイトをもたらします。Streamlitは、主要なグラフライブラリとの連携が非常にスムーズで、ネイティブのグラフ描画機能も備えています。

Streamlitネイティブのグラフ

簡単なグラフであれば、Pandas DataFrameを渡すだけで描画できます。

import streamlit as st
import pandas as pd
import numpy as np
chart_data = pd.DataFrame( np.random.randn(20, 3), columns=['a', 'b', 'c']
)
st.subheader("折れ線グラフ")
st.line_chart(chart_data)
st.subheader("面グラフ")
st.area_chart(chart_data)
st.subheader("棒グラフ")
st.bar_chart(chart_data)

主要なグラフライブラリとの連携

より高度でインタラクティブなグラフを作成したい場合は、Matplotlib, Plotly, Altairといったライブラリと連携できます。

import streamlit as st
import matplotlib.pyplot as plt
import numpy as np
import plotly.figure_factory as ff
# Matplotlib
st.subheader("Matplotlib")
fig, ax = plt.subplots()
ax.scatter(np.random.rand(100), np.random.rand(100))
st.pyplot(fig)
# Plotly
st.subheader("Plotly")
# 正規分布のデータを生成
x1 = np.random.randn(200) - 2
x2 = np.random.randn(200)
hist_data = [x1, x2]
group_labels = ['Group 1', 'Group 2']
# 分布図を作成
fig = ff.create_distplot(hist_data, group_labels, bin_size=[.1, .25])
st.plotly_chart(fig, use_container_width=True)

画像・音声・動画の表示

Streamlitでは、画像、音声、動画ファイルも簡単に埋め込むことができます。

import streamlit as st
# 画像
st.image('https://streamlit.io/images/brand/streamlit-logo-primary-colormark-darktext.png', caption='Streamlit Logo')
# 音声
# audio_file = open('myaudio.ogg', 'rb')
# audio_bytes = audio_file.read()
# st.audio(audio_bytes, format='audio/ogg')
# 動画
# video_file = open('myvideo.mp4', 'rb')
# video_bytes = video_file.read()
# st.video(video_bytes)

アプリが複雑になるにつれて、情報を整理し、ユーザーが使いやすいようにレイアウトを整えることが重要になります。Streamlitは、そのための強力なツールを提供しています。

サイドバー (st.sidebar)

メインの画面からコントロール要素を分離したい場合にサイドバーが便利です。st.sidebar.を先頭につけるだけで、どんなウィジェットもサイドバーに配置できます。

import streamlit as st
# サイドバーにウィジェットを配置
add_selectbox = st.sidebar.selectbox( "どの連絡方法がお好みですか？", ("Email", "自宅電話", "携帯電話")
)
add_slider = st.sidebar.slider( "温度の範囲を選択してください", 0.0, 100.0, (25.0, 75.0)
)
st.write(f"選択された連絡方法: {add_selectbox}")
st.write(f"選択された温度範囲: {add_slider}")

カラム (st.columns)

画面を複数の列に分割して、要素を横並びに配置することができます。ダッシュボード作成などで非常に役立ちます。

import streamlit as st
col1, col2, col3 = st.columns(3)
with col1: st.header("猫") st.image("https://static.streamlit.io/examples/cat.jpg")
with col2: st.header("犬") st.image("https://static.streamlit.io/examples/dog.jpg")
with col3: st.header("フクロウ") st.image("https://static.streamlit.io/examples/owl.jpg")

タブ (st.tabs)

関連するコンテンツをタブで切り替えて表示することで、画面をすっきりと保つことができます。

import streamlit as st
import numpy as np
tab1, tab2 = st.tabs(["📈 チャート", "🗃 データ"])
with tab1: st.header("チャートを表示") chart_data = st.line_chart(np.random.randn(10, 2))
with tab2: st.header("データを表示") st.dataframe(np.random.randn(10, 2))

展開可能なセクション (st.expander)

詳細な情報や高度な設定項目など、通常は隠しておきたいコンテンツを折りたたみ式のセクション内に格納できます。

import streamlit as st
st.bar_chart({"data":})
with st.expander("詳細を見る"): st.write(""" このチャートは...についてのデータを示しており、...のような洞察が得られます。 詳細な分析結果はこちらのドキュメントを参照してください。 """)

フォーム (st.form)

複数のウィジェットの入力を一度にまとめて送信したい場合にst.formを使用します。フォーム内のウィジェットを操作してもアプリは再実行されず、st.form_submit_buttonが押されたときのみ再実行されます。これにより、ユーザー体験が向上し、不要な再計算を防ぐことができます。

import streamlit as st
with st.form("my_form"): st.write("アンケートにご協力ください") slider_val = st.slider("評価") checkbox_val = st.checkbox("メールマガジンを購読する") # 全てのフォーム要素はここに配置します # フォームの送信ボタン submitted = st.form_submit_button("送信") if submitted: st.write("スライダー:", slider_val, "チェックボックス:", checkbox_val)
st.write("フォームの外側のテキスト")

Streamlitの挙動を理解する上で最も重要な概念の一つが「再実行モデル」です。ユーザーがウィジェットを操作するたびに、Pythonスクリプトは最初から最後まで再実行されます。これはシンプルさの源泉である一方、アプリケーションの状態を保持したり、重い処理のパフォーマンスを最適化したりするためには特別な仕組みが必要になります。

再実行をまたいで値を保持する: セッションステート (st.session_state)

通常のPython変数に値を保存しても、再実行のたびに初期化されてしまいます。ボタンのクリック回数を数えたり、ログイン状態を維持したりといった、セッションを通じて値を保持したい場合にはst.session_stateを使います。

st.session_stateは、辞書のようにキーと値でデータを保存できるオブジェクトです。

import streamlit as st
st.title('カウンターの例')
# 'count'がsession_stateに存在しない場合、0で初期化
if 'count' not in st.session_state: st.session_state.count = 0
increment = st.button('カウントアップ')
if increment: st.session_state.count += 1
st.write('カウント = ', st.session_state.count)

重い処理を高速化する: キャッシュ機能

大規模なデータセットの読み込みや、複雑な計算、機械学習モデルのロードなど、時間のかかる処理が再実行のたびに走ると、アプリの応答性が著しく低下します。これを解決するのがStreamlitのキャッシュ機能です。

Streamlitは、関数の実行結果をキャッシュ（一時保存）するための「デコレータ」を提供しています。

キャッシュの使用例

import streamlit as st
import pandas as pd
import time
# @st.cache_data: データのロードをキャッシュ
@st.cache_data
def load_data(url): # この処理は初回実行時のみ実行される time.sleep(3) # 重い処理をシミュレート df = pd.read_csv(url) return df
st.title("キャッシュ機能のデモ")
data_url = "https://raw.githubusercontent.com/streamlit/demo-data/master/uber-raw-data-sep14.csv.gz"
df = load_data(data_url)
st.write("データの読み込みが完了しました。")
st.dataframe(df.head())
# ウィジェットを操作しても、load_data関数は再実行されない
st.checkbox("チェックボックス")

このアプリを実行すると、初回ロード時には3秒間の待機が発生しますが、その後チェックボックスをオン・オフしても待機時間はなく、瞬時に表示が切り替わることが確認できます。これがキャッシュの効果です。

ローカル環境で素晴らしいアプリが完成したら、次はそれを同僚や世界中の人々と共有したくなるでしょう。Streamlitは、「Streamlit Community Cloud」という無料のホスティングサービスを提供しており、驚くほど簡単にアプリを公開できます。

デプロイに必要なもの

Streamlit Community Cloudでアプリを公開するために、主に以下の3つが必要です。

1. Streamlit Community Cloudのアカウント: GoogleまたはGitHubアカウントで簡単にサインアップできます。
2. GitHubリポジトリ: 公開したいStreamlitアプリのコードを格納したパブリックなGitHubリポジトリ。
3. requirements.txt ファイル: アプリの実行に必要なPythonライブラリを記述したファイル。

デプロイ手順の概要

基本的な流れは非常にシンプルです。

streamlit
pandas
numpy
matplotlib
plotly

このガイドでは、PythonライブラリStreamlitの基本的な概念から、ウィジェットの活用、レイアウト、状態管理、パフォーマンスチューニング、そしてデプロイまで、その魅力を包括的に解説しました。

Streamlitを使えば、データサイエンスのアイデアや機械学習モデルを、もはやJupyter Notebookの中に留めておく必要はありません。ほんの数行のコードを追加するだけで、誰もが触れるインタラクティブなWebアプリケーションへと昇華させることができるのです。この手軽さと強力さは、あなたのプロジェクトの価値を飛躍的に高める可能性を秘めています。

さあ、今日からあなたもStreamlitを使って、自分だけのデータアプリを創造し、世界と共有してみてはいかがでしょうか。