初心者でも簡単にPythonでWebアプリが作れる「Streamlit」を紹介

本記事は，京都大学人工知能研究会KaiRAのAdvent Calender 3日目の記事です．

Streamlitとは？

Streamlitは，Pythonでお手軽にWebアプリを作りたい！という人のためのフレームワークです．

Streamlitのドキュメントを見てもらうとわかるのですが，st.xxxxx(...)のようにコードを書くだけで色々な機能を実装できてしまうという超便利なツールです．

本記事では，

• Streamlitで何ができるのか
• Streamlitで作ったWebアプリを公開する方法（概要）

について触れ，Streamlitの便利さについて紹介していきます．

どれくらいお手軽なのか

例えば画像認識AIをWebアプリとして公開したいとき，PCのWebカメラを使ったり，ファイルのアップロードをする機能が欲しいですよね．

そんなときは，次のたった2行のコードで実装できてしまいます．

import streamlit as st
image = st.camera_input('写真を撮影します')

import streamlit as st
file_buffer = st.file_uploader('ファイルをアップロードしてください')

もちろん，引数を追加してやれば，アップロードできるファイルの種類を制限するなど簡単にカスタマイズできます．

万能な st.write()

文字を入力するには，

import streamlit as st
st.write('Hello world!')

のようにします．StreamlitではMarkdown形式が使えて，例えば

st.write('''
## 見出し2
- リスト1
- **リスト2**
''')

などと書くことができます．さらに，Latexも書けちゃいます．

st.write(r'y = \beta_0 + \beta_1 x_1 + \beta_2 x_2 + \cdots + \beta_k x_k + \epsilon')

また絵文字のショートコードも使えます．
下記サイトのShortcodesの部分を書いておけば，アプリ上では絵文字が表示されます．

# 💯
st.write(':100:')
# ✅
st.write(':white_check_mark:')

このst.write()ってやつは万能で，基本的に何でもいい感じに表示してくれます．

例えばPandasのDataFrameは，

import streamlit as st
import pandas as pd

df = pd.DataFrame({'A':[0,1,2], 'B':[0,-1,-2]})
st.write(df)

とだけ書いておけば，下画像のようにテーブル形式で表示してくれます．

辞書もいい感じに表示してくれます．

import streamlit as st
st.write({'a': 1, 'b': 2, 'c': 3})

画像，グラフなどの表示

一方，画像の表示はst.image()で実現できます．

import streamlit as st
import numpy as np

img = np.random.randint(0, 255, (300, 300, 3), dtype=np.uint8)
st.image(img)

Streamlitのすごいところの一つは，インタラクティブなグラフが簡単に描けてしまうことです．
例えば，棒グラフを書いてみましょう．

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.bar_chart(chart_data)

st.bar_chart()にDataFrameを渡すだけで，

• 拡大・縮小
• ホバーで詳細表示

などが可能なインタラクティブなグラフを作成することができてしまいました．

もちろん，棒グラフ以外にも

• area_chart
• line_chart
• scatter_chart

などいろいろあります．
matplotlib等のライブラリで作成した静的なグラフを表示させることもできます．

さらに，地図に散布図を重ねることもできて，

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

df = pd.DataFrame(
    np.random.randn(100, 2) + [35, 135],
    columns=['lat', 'lon'])
st.map(df)

と書けば，下のような図が描けます．これはめちゃくちゃ便利ですね．

スライドバー，ボタンなど

機械学習モデルのハイパーパラメータなどを，スライドバーで調整出来たら便利ですよね．
もちろん，Streamlitにはその機能が搭載されています．

lambda_1 = st.slider(r'$\lambda_1$', 0.0, 1.0, 0.5)

その他にも，

• ボタン
• チェックボックス
• トグルボタン
• ラジオボタン
• セレクトボックス
• テキスト入力
• 日付選択
• 時間選択

など，さまざまなフォームを実装できます．使い方などはドキュメントを見てください．

他にも機能がたくさんあるので，ぜひドキュメントを見てみてください．
Streamlitのドキュメントはとても見やすいので，情報も探しやすいです．

デプロイも無料でできちゃう（メモリ1GBまでなら）

上で紹介した機能はほんの一部ですが，Streamlitの便利さをわかっていただいたかと思います．

これだけでも十分なのですが，なんと無料でStreamlitのWebアプリをデプロイ（Web上に公開）できてしまうのです．

ただし無料版では，以下のような制限があります．

• メモリ：1GBまで
• 限定公開アプリ：1つまで

制限があるとはいえ，メモリ1GB以上使わないような軽いAIであればタダでアプリをデプロイできます．

デプロイまでの簡単な流れとしては，

• Streamlit Sharingのアカウント登録
• GitHubにソースコードをPush
• Streamlit Sharingに紐づける（ボタンポチポチで簡単）

と言う感じです．特に面倒なことはせずに，簡単にデプロイできてしまいます．
コードを変更したい場合も，GitHubにPushしてアプリを再起動（Reboot）するだけで変更が反映されます．

デプロイ方法の詳細については，例えばこちらの記事を参考にしてもらえればと思います．

最後に

Streamlitはとても簡単に，きれいなWebアプリが作れる＆デプロイも無料でできるという，超便利なフレームワークです．

個人で作ったAIやシステムも簡単に公開できて，みんなに触ってもらえるので，みなさんの開発モチベは爆上がり間違いなし！

ぜひ皆さんも，Streamlit使ってみてください．