Streamlit 入門 — Python だけでウェブアプリを作る | 生成AIxPythonで始める株式分析|Python×J-Quants

Streamlit は、Python のスクリプトをそのままウェブアプリに変えてくれる ライブラリです。HTML / JS / CSS を書く必要がほとんどなく、データ分析の結果を「触れる形」で配るのに向いています。本記事は最短入門として、最小アプリ → ウィジェット → 状態管理 → レイアウトを順に扱います。

インストール

pip install streamlit

検証バージョン: Python 3.12.5 / streamlit 1.40 系

インストール後、次のコマンドで動作確認用デモが起動します(任意)。

streamlit hello

最小アプリ

app.py という名前で次のファイルを保存します。

1
import streamlit as st
2

3
st.title("はじめての Streamlit")
4
st.write("Python のスクリプトがそのままアプリになります。")

実行コマンドは python app.py ではなく streamlit run を使います。

streamlit run app.py

ブラウザが自動で開き、http://localhost:8501/ にアプリが表示されます。

主要ウィジェット

入力ウィジェットは関数として呼び出すだけで、戻り値が現在の値 になります。

1
import streamlit as st
2

3
st.header("ウィジェットの基本")
4

5
ticker = st.text_input("銘柄コード", value="7203")
6
period = st.slider("期間(日)", min_value=30, max_value=500, value=250, step=10)
7
ma = st.checkbox("移動平均を表示", value=True)
8
mode = st.radio("チャートモード", options=["折れ線", "ローソク足"])
9

10
st.write(f"銘柄: {ticker} / 期間: {period} 日 / 移動平均: {ma} / モード: {mode}")

text_input: 自由入力
slider: 数値スライダー
checkbox: True / False
radio / selectbox: 選択肢
date_input: 日付ピッカー
file_uploader: ファイルアップロード

ユーザーがウィジェットを操作するたび、Streamlit はスクリプト全体を 上から再実行 します。リアクティブに UI が更新される仕組みです。

DataFrame・グラフを表示する

pandas / matplotlib / plotly がそのまま動きます。

1
import streamlit as st
2
import numpy as np
3
import pandas as pd
4
import matplotlib.pyplot as plt
5

6
st.header("データとチャート")
7

8
# サンプルデータ
9
rng = np.random.default_rng(seed=42)
10
n = 200
11
prices = pd.Series(
12
    100 * np.exp(np.cumsum(rng.normal(0.0005, 0.015, n))),
13
    index=pd.date_range("2026-01-01", periods=n, freq="B"),
14
    name="C",
15
)
16

17
st.line_chart(prices)
18

19
st.dataframe(prices.tail(10).to_frame())
20

21
fig, ax = plt.subplots(figsize=(8, 4))
22
ax.plot(prices.index, prices.values)
23
ax.set_title("Random walk price")
24
ax.grid(alpha=0.3)
25
st.pyplot(fig)

st.line_chart / st.bar_chart: 1 行で書ける簡易チャート
st.dataframe: ソート・スクロール可能なテーブル
st.pyplot(fig): matplotlib の Figure を埋め込む
st.plotly_chart(fig): Plotly の Figure を埋め込む(#4-8「Plotly でインタラクティブな株価チャート」 / #12-1「Plotly 応用 — テクニカル指標を重ねたチャート」で扱う)

キャッシュ(再計算の抑制)

ウィジェット操作のたびにスクリプトが上から再実行されるため、重い処理(API 呼び出し・大量データ読み込み)はそのままだと遅くなります。@st.cache_data デコレータでキャッシュします。

1
import streamlit as st
2
import pandas as pd
3

4
@st.cache_data
5
def load_prices(path: str) -> pd.DataFrame:
6
    return pd.read_csv(path, parse_dates=["Date"])
7

8
df = load_prices("prices.csv")
9
st.write(df.head())

引数が同じ間は キャッシュ済みの結果 が返り、再計算されません。引数が変わったときだけ再実行されます。

状態を持つ — session_state

「クリックされた回数を覚える」のような状態を持たせたい場合は st.session_state を使います。

1
import streamlit as st
2

3
st.header("カウンター")
4

5
if "count" not in st.session_state:
6
    st.session_state["count"] = 0
7

8
if st.button("増やす"):
9
    st.session_state["count"] += 1
10

11
st.write(f"現在のカウント: {st.session_state['count']}")

session_state はユーザーごと(タブごと)に独立しています。データベースのような永続化は別途必要です。

レイアウト

横並び・タブ・サイドバーが用意されています。

1
import streamlit as st
2

3
# サイドバー
4
with st.sidebar:
5
    st.header("設定")
6
    ticker = st.text_input("銘柄コード", value="7203")
7

8
# 横並び
9
col1, col2 = st.columns(2)
10
with col1:
11
    st.metric("現在値", "2,925", "+25 (+0.86%)")
12
with col2:
13
    st.metric("出来高", "12.5M", "-3%")
14

15
# タブ
16
tab_chart, tab_table = st.tabs(["チャート", "テーブル"])
17
with tab_chart:
18
    st.line_chart([1, 3, 2, 5, 4])
19
with tab_table:
20
    st.write("テーブルの内容")

st.sidebar: 左サイドバー(全ページ共通の設定置き場)
st.columns(n): 横方向の n カラム
st.tabs([...]): タブ切り替え
st.expander("詳細"): 折りたたみブロック

実用例(株価ビューワーの最小形)

ここまでを組み合わせた、シンプルな株価ビューワーの骨格です。J-Quants との連携は#12-4「Streamlit で株価ビューワーを作る」で詳しく扱います。

1
"""app.py — 簡易株価ビューワー(CSV ファイル前提)"""
2
import streamlit as st
3
import pandas as pd
4

5
st.set_page_config(page_title="株価ビューワー", layout="wide")
6
st.title("株価ビューワー")
7

8
@st.cache_data
9
def load_data(path: str) -> pd.DataFrame:
10
    return pd.read_csv(path, parse_dates=["Date"])
11

12
df = load_data("prices.csv")
13

14
with st.sidebar:
15
    ticker = st.selectbox("銘柄コード", sorted(df["Code"].unique()))
16
    sma_window = st.slider("SMA 期間(日)", 5, 100, 25, step=5)
17

18
dfx = df[df["Code"] == ticker].sort_values("Date").copy()
19
dfx["sma"] = dfx["C"].rolling(sma_window).mean()
20
dfx = dfx.set_index("Date")
21

22
col1, col2 = st.columns([3, 1])
23
with col1:
24
    st.line_chart(dfx[["C", "sma"]])
25
with col2:
26
    latest = dfx.iloc[-1]
27
    st.metric("最新終値", f"{latest['C']:.0f} 円")
28
    st.metric(f"SMA({sma_window})", f"{latest['sma']:.0f} 円" if not pd.isna(latest["sma"]) else "—")
29

30
st.dataframe(dfx.tail(50))

デプロイ

ローカルで動かすぶんには streamlit run app.py だけで OK です。共有したい場合は次の選択肢があります。

方法	特徴
Streamlit Community Cloud	GitHub と連携し、無料枠あり
自前サーバー(VPS / EC2)	自由度が高いが、運用が必要
Hugging Face Spaces	機械学習のデモと相性が良い

学習・自分用ダッシュボードとしては、ローカルで localhost:8501 を開く運用で十分です。

よくあるつまずき

症状	対処
`python app.py` で動かない	必ず `streamlit run app.py` を使う
重くなる	`@st.cache_data` を使う。データ加工を関数化してキャッシュ
ウィジェットの値がリセットされる	`st.session_state` を使うか、`key=` を統一する
ブラウザが自動で開かない	URL を直接開く(`http://localhost:8501/`)

生成AI へのプロンプト例

「自分の分析コードを Streamlit 化したい」ときに依頼する例です。

次の Python スクリプト(prices.py)を Streamlit アプリに変換してください。
スクリプトの本質的な処理は変えず、ウィジェットで対話的に操作できる形に
します。

【スクリプト】
(ここに既存スクリプトを貼る)

【UI 要件】
- サイドバーで銘柄コードと期間を選ぶ
- メイン領域に終値と SMA(25, 75) のラインチャートを表示
- 表示中の銘柄の最新終値・前日比を上部にメトリクス表示
- データ読み込みは @st.cache_data でキャッシュ

【制約】
- streamlit 1.40 系の API を使う
- pandas 2.2 系
- ファイル名は app.py
- 既存の関数定義は使い回す(再実装しない)

まとめ

streamlit run app.py だけでウェブアプリが起動する
ウィジェットは関数として呼ぶだけで戻り値を取れる
重い処理は @st.cache_data でキャッシュ
状態は st.session_state、レイアウトは columns / tabs / sidebar
自分用ダッシュボードに最適。共有はローカル + Cloud デプロイで使い分け

目次