0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Python Streamlitで始めるインタラクティブWebアプリ開発入門

Posted at

1. はじめに:Streamlitとは何か

データサイエンスや機械学習の現場で、Pythonだけで手軽にWebアプリやダッシュボードを作りたい――そんなニーズに応えるのがStreamlitです。Streamlitは、複雑なWeb開発の知識がなくても、シンプルなPythonスクリプトを書く感覚でインタラクティブなアプリを構築できるオープンソースのフレームワークです。リアルタイムでコードの変更が反映され、データの可視化やユーザーインタラクションも直感的に実装できるのが大きな魅力です。

import streamlit as st

st.title("はじめてのStreamlitアプリ")
st.write("StreamlitでWebアプリ開発を始めましょう!")

2. Streamlitのインストールと起動

Streamlitはpipコマンドで簡単にインストールできます。インストール後は、Pythonファイルを作成し、streamlit run ファイル名.pyで開発サーバーが立ち上がります。ブラウザで自動的にアプリが表示されるため、初心者でもすぐに開発を始められます。

pip install streamlit
streamlit run app.py

3. タイトル・見出し・テキストの表示

Streamlitでは、タイトルや見出し、テキストの表示もシンプルな関数で実現できます。st.titlest.headerst.textなどを使い分けることで、見やすいレイアウトを簡単に作成できます。

import streamlit as st

st.title("Streamlit入門")
st.header("見出し(Header)")
st.subheader("サブ見出し(Subheader)")
st.text("これは通常のテキストです。")

4. Markdownでリッチな表現

StreamlitはMarkdown記法に対応しているため、太字やリスト、リンクなどリッチなテキスト表現が可能です。ドキュメントや説明文、動的な内容の出力にも便利です。

import streamlit as st

st.markdown("""
# Markdown見出し
**太字**や*イタリック*、[リンク](https://streamlit.io)も使えます。
- 箇条書き1
- 箇条書き2
""")

5. ユーザー入力:テキストボックスとスライダー

ユーザーからの入力を受け付けるウィジェットも豊富です。テキストボックスやスライダーを使えば、ユーザーの操作に応じてアプリの挙動を変化させることができます。

import streamlit as st

name = st.text_input("お名前を入力してください")
age = st.slider("年齢を選択してください", 0, 100, 25)
st.write(f"こんにちは、{name}さん({age}歳)!")

6. ボタン・チェックボックス・ラジオボタン

Streamlitは様々なインタラクティブウィジェットを備えています。ボタンやチェックボックス、ラジオボタンを使うことで、ユーザーの選択やアクションに応じた処理が簡単に実装できます。

import streamlit as st

if st.button("クリックして挨拶"):
    st.success("こんにちは!")

agree = st.checkbox("利用規約に同意する")
if agree:
    st.info("同意ありがとうございます。")

color = st.radio("好きな色を選んでください", ["", "", ""])
st.write(f"あなたの好きな色は {color} です。")

7. データフレームと表の表示

PandasのDataFrameやリストをそのまま表として表示できるのもStreamlitの強みです。データ分析の結果をインタラクティブに共有したいときに非常に便利です。

import streamlit as st
import pandas as pd

df = pd.DataFrame({
    "名前": ["田中", "佐藤", "鈴木"],
    "年齢": [28, 34, 22]
})
st.dataframe(df)

8. グラフとデータビジュアライゼーション

StreamlitはMatplotlibやPlotly、Altairなどのグラフライブラリと連携できます。st.line_chartst.bar_chartなどの関数もあり、簡単にデータの可視化が行えます。

import streamlit as st
import numpy as np
import pandas as pd

chart_data = pd.DataFrame(
    np.random.randn(20, 3),
    columns=["A", "B", "C"]
)
st.line_chart(chart_data)

9. 画像やメディアの表示

画像ファイルや動画、音声ファイルもStreamlitで手軽に表示できます。データ分析の結果や機械学習モデルの出力イメージを共有する際に役立ちます。

import streamlit as st
from PIL import Image

image = Image.open("sample.jpg")
st.image(image, caption="サンプル画像", use_column_width=True)

10. ファイルアップロードとダウンロード

ユーザーがファイルをアップロードしたり、アプリからファイルをダウンロードできる機能も標準装備。データの受け渡しや結果のエクスポートがスムーズに行えます。

import streamlit as st

uploaded_file = st.file_uploader("ファイルをアップロードしてください")
if uploaded_file is not None:
    st.write("ファイル名:", uploaded_file.name)
    st.download_button("ダウンロード", uploaded_file, file_name=uploaded_file.name)

11. サイドバーによるレイアウト拡張

サイドバーを活用することで、メイン画面をすっきりさせつつ、設定やナビゲーションを提供できます。大規模なアプリやダッシュボードに最適です。

import streamlit as st

st.sidebar.title("サイドバー")
option = st.sidebar.selectbox("メニューを選択", ["トップ", "設定", "ヘルプ"])
st.write(f"選択されたメニュー: {option}")

12. セッション状態とキャッシュ

Streamlitではセッション状態やキャッシュ機能を活用し、ユーザーごとのデータ管理や処理の高速化も可能です。st.session_state@st.cache_dataデコレータで実現できます。

import streamlit as st

if "count" not in st.session_state:
    st.session_state.count = 0

if st.button("カウントアップ"):
    st.session_state.count += 1

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

13. 複数ページ・アプリの拡張

Streamlitは複数ページ構成のアプリもサポートしています。pagesディレクトリにPythonファイルを追加するだけで、ページ切り替えが自動で行えます。大規模なアプリにも柔軟に対応できます。

# ディレクトリ構成例
# app.py
# pages/
#   page1.py
#   page2.py

14. まとめとデプロイ

Streamlitは、Pythonエンジニアが短時間でインタラクティブなWebアプリを構築できる強力なツールです。データ可視化、ユーザー入力、ファイル操作など多彩な機能を備え、開発から共有・デプロイまでを一気通貫でサポートします。アプリはHerokuやStreamlit Community Cloud、AWSなどに簡単にデプロイ可能です。ぜひ一度Streamlitで自分だけのWebアプリを作ってみてください。

# HerokuやStreamlit Cloudなどでのデプロイ例
streamlit run app.py

Streamlitのシンプルさと拡張性を活かして、あなたのアイデアをすぐに形にしましょう。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?