Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Streamlitで簡単webGUI
Search
さらだ
June 06, 2021
Programming
0
53
Streamlitで簡単webGUI
Dentoo.LT #25
発表資料
さらだ
June 06, 2021
Tweet
Share
Other Decks in Programming
See All in Programming
PHPで始める振る舞い駆動開発(Behaviour-Driven Development)
ohmori_yusuke
2
250
ふつうの技術スタックでアート作品を作ってみる
akira888
0
360
エラーって何種類あるの?
kajitack
5
340
AIエージェントはこう育てる - GitHub Copilot Agentとチームの共進化サイクル
koboriakira
0
490
関数型まつりレポート for JuliaTokai #22
antimon2
0
160
すべてのコンテキストを、 ユーザー価値に変える
applism118
3
1.1k
Systèmes distribués, pour le meilleur et pour le pire - BreizhCamp 2025 - Conférence
slecache
0
120
都市をデータで見るってこういうこと PLATEAU属性情報入門
nokonoko1203
1
590
データの民主化を支える、透明性のあるデータ利活用への挑戦 2025-06-25 Database Engineering Meetup#7
y_ken
0
340
Team operations that are not burdened by SRE
kazatohiei
1
290
PHPでWebSocketサーバーを実装しよう2025
kubotak
0
260
なぜ「共通化」を考え、失敗を繰り返すのか
rinchoku
1
630
Featured
See All Featured
The Language of Interfaces
destraynor
158
25k
Art, The Web, and Tiny UX
lynnandtonic
299
21k
Statistics for Hackers
jakevdp
799
220k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
138
34k
We Have a Design System, Now What?
morganepeng
53
7.7k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
8
680
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
A Modern Web Designer's Workflow
chriscoyier
694
190k
Scaling GitHub
holman
459
140k
Adopting Sorbet at Scale
ufuk
77
9.4k
Making the Leap to Tech Lead
cromwellryan
134
9.4k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.8k
Transcript
Streamlitで簡単webGUI さらだ Dentoo.LT #25 1
自己紹介 • いわゆるI科のM1 • アイカツ!3rdシーズン視聴中 • 研究室大好き 2
突然ですが これらのロゴを見たことある・知っ てる人いますか? 正解です! 僕が挑戦しては挫折した WEBバックエンドフレームワークたちです 3
なんで挫折したの? • 課題やらで忙しくなった • なんか動かなくなって諦めた • 必要じゃなくなった 4
突然ですが(2) これらのロゴを見たことある・知っ てる人いますか? 正解です! 最も有名なWEBフロントエンドフレームワークたちです 5
フロントエンドもバックエンドも勉 強したくないけど、それっぽい WEBアプリを作りたいよ。。。。 そんなあなたにおススメなのが 6
Streamlitとは? 1. Pythonのライブラリ 2. 美しいWEBアプリケーション 3. 機械学習・データサイエンティスト 7
インストール pip install streamlit 普通にインストールします 8
これから説明すること 1. サンプルの実行 2. 文字列を表示 3. pandasのDataFrameを表示 4. Matplotlibのグラフを表示 5.
ドロップダウンリストの利用 6. チェックリストの利用 7. markdownによる文字列の表示 9
サンプルを実行 streamlit hello を実行して表示されたリンク をクリック! 10
文字列を表示 streamlit run sample00.py # sample00.py import streamlit as st
st.write("電!気!通!信!大!学!🤔🤔🤔") st.write("U!E!C!🖖🖖🖖") 11
12
pandasのDataFrameを表示 streamlit run sample01.py # sample01.py import streamlit as st
import pandas as pd df = pd.DataFrame([["UEC","電気通信大学"], ["MIT", "マサチューセッツ工科大学"]]) st.table(df) 13
14
これから説明すること 1. サンプルの実行 2. 文字列を表示 3. pandasのDataFrameを表示 4. Matplotlibのグラフを表示 5.
ドロップダウンリストの利用 6. チェックリストの利用 7. markdownによる文字列の表示 15
Matplotlibのグラフを表示 streamlit run sample02.py # sample02.py import streamlit as st
import matplotlib.pyplot as plt fig = plt.figure() plt.plot([1,2,3,4],[8,6,7,5]) st.pyplot(fig) 16
17
ドロップダウンリストの利用 streamlit run sample03.py # sample03.py import streamlit as st
option = st.selectbox("select your university", ["UEC", "電気通信大 学", "多摩のMIT"]) st.write(f"You selected: {option}") 18
19
チェックリストの利用 streamlit run sample04.py # sample04.py import streamlit as st
check1 = st.checkbox("選択肢1") check2 = st.checkbox("選択肢2") check3 = st.checkbox("選択肢3") if check1: st.write("you checked 1") if check2: st.write("you checked 2") if check3: st.write("you checked 3") 20
21
markdownによる文字列の表示 streamlit run sample05.py 22 # sample05.py import streamlit as
st ''' # これはH1タグです ###### これはH6タグです *イタリック体* **太字** ~~打ち消し~~ > 引用
23
他 • ダークモードにも標準で対応 • ログイン関連の処理・DBの操作関連の処理は実装されていない 24
まとめ • 表・グラフを簡単に表示できる • ドロップダウンリスト・チェックリストを簡単に利用できる • テキストにmarkdownを利用できる • ダークモードにも対応 •
ログイン関連・DB関連の処理は苦手 25
ご清聴ありがとうございました 今回使用したソースコードは https://github.com/arima0714/Dentoo.LT-25 に挙げてます なんか作りたいけど、道具を使えないせいで何も作れない人 が一人でも減ってほしいです。 26 該当コードへの QRコード