【Streamlit】初めてのアプリを作成

Streamlit
この記事は約6分で読めます。

こんにちは、JS2IIUです。
StreamlitでUI部品を組み合わせたアプリを作ってみます。始めて作る方向けに丁寧に解説していきます。今回もよろしくお願いします。

1. はじめに

Pythonで簡単にWebアプリを作れるツールをご存じですか？
Streamlit（ストリームリット）は、データ分析や機械学習の結果を手軽に可視化・共有できる人気のフレームワークです。複雑なHTMLやJavaScriptを一切書かずに、PythonのコードだけでWebアプリを作成できます。

この記事では、Streamlitを初めて触る方向けに、テキスト表示・ボタン・スライダーといった基本的なUI部品を使った簡単なアプリを一緒に作っていきます。

2. 環境の準備

ステップ1：Pythonのインストール

まず、Pythonがインストールされていることを確認してください。
まだの方は、公式サイト（https://www.python.org/）から最新版をインストールしましょう。

ステップ2：仮想環境の作成（任意）

環境を汚したくない方は、Pythonの仮想環境を作成するのがおすすめです。

Bash
python -m venv venv
source venv/bin/activate  # Windowsの方は venv\Scripts\activate

ステップ3：Streamlitのインストール

以下のコマンドでStreamlitをインストールします。

Bash
pip install streamlit

インストールが完了したら、Streamlitが使える状態になります。

3. 最初のStreamlitアプリの作成

ステップ1：ファイルを作る

任意のフォルダに、以下の名前でPythonファイルを作成します。

app.py

Python
import streamlit as st

st.write("こんにちは、Streamlit！")

このコードでは、st.write()関数を使ってシンプルにテキストを表示しています。

4. ボタンの追加と動作

次に、ボタンを画面に追加して、ボタンを押したときだけ特定のメッセージを表示してみましょう。

ステップ2：コードを追記

Python
import streamlit as st

st.write("こんにちは、Streamlit！")

if st.button("クリックしてね"):
    st.write("ボタンが押されました！")

解説

  • st.button("クリックしてね")
    画面にボタンが表示されます。
  • if文の中にあるst.write(...)は、ボタンが押された時だけ実行されます。

5. スライダーの追加と値の取得

次は、スライダーで数値を選び、その値を表示する機能を追加しましょう。

ステップ3：コードを追記

Python
import streamlit as st

st.write("こんにちは、Streamlit！")

if st.button("クリックしてね"):
    st.write("ボタンが押されました！")

age = st.slider("年齢を選んでください", 0, 100, 25)
st.write("あなたの年齢は", age, "歳です。")

解説

  • st.slider()：スライダーを表示します。
  • 第1引数はスライダーのラベル
  • 0が最小値、100が最大値、25が初期値
  • st.write()でスライダーで選んだ値を表示しています。

6. アプリ全体の完成コード

ここまでの内容をすべて組み合わせた、完成版のコードがこちらです。

Python
import streamlit as st

st.title("はじめてのStreamlitアプリ")

st.write("こんにちは、Streamlitへようこそ！")

if st.button("クリックしてね"):
    st.write("ボタンが押されました！")

age = st.slider("年齢を選んでください", 0, 100, 25)
st.write("あなたの年齢は", age, "歳です。")

st.title()で大きなタイトルを表示することもできます。

7. 実行してみよう

アプリの準備ができたら、いよいよ実行です！

ステップ4：ターミナル（またはコマンドプロンプト）で以下を入力

Bash
streamlit run app.py

ブラウザが自動的に開き、作成したアプリが表示されるはずです。
もし自動で開かない場合は、表示されたURL（通常は http://localhost:8501）をコピーしてブラウザに貼り付けてください。

8. まとめと次のステップ

今回学んだこと

  • Streamlitの基本的な使い方
  • テキストの表示（st.write / st.title）
  • ボタンの表示とクリック判定（st.button）
  • スライダーでの値の取得（st.slider）

次におすすめのステップ

Streamlitには多くのUIパーツが揃っていますので、今回作ったのと同じ要領で色々と試してみてください！

  • st.text_input（テキスト入力）
  • st.selectbox（選択式メニュー）
  • st.image（画像の表示）
  • st.dataframe（データフレームの表示）

少しずつ機能を学んでいくことで、あなただけの便利なアプリが作れるようになります！

9. 参考リンク

最後に書籍のPRです。
24年9月に出版された「ハイパーモダンPython-信頼性の高いワークフローを構築するモダンテクニック」、Claudio Jolowicz著、嶋田、鈴木訳。開発環境の構築、プロジェクトの管理、テストに関して実践的な内容でとても参考になる一冊です。Poetryについても詳しく説明されています。ぜひ手に取ってみてください。

最後まで読んでいただきありがとうございます。

コメント

タイトルとURLをコピーしました