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
NiceGUI is Nice
Search
s2terminal
October 28, 2023
Technology
0
570
NiceGUI is Nice
s2terminal
October 28, 2023
Tweet
Share
More Decks by s2terminal
See All by s2terminal
TypeScriptでJupyter
s2terminal
0
84
AIをWebアプリに実装するための便利なPythonライブラリ
s2terminal
0
560
段階的なシステムリプレースを実現するデータ同期技術
s2terminal
0
140
1年でモダンなフロントエンドに追いついた話 2019-08-22 Mix Leap Joint #26
s2terminal
0
40
20190706 BCU30 事業を変えるシステムリプレース
s2terminal
0
45
Cognitive Complexity でコードの複雑さを定量的に計測しよう
s2terminal
2
150
MySQLオンラインマイグレーションツールgh-ostで深夜メンテナンスを無くした話
s2terminal
0
50
Microsoft Azureで 女子力を生成する
s2terminal
0
56
かんたん機械学習はじめの1歩AzureMachineLearningでTweetをレコメンド
s2terminal
0
44
Other Decks in Technology
See All in Technology
Generative AI Japan 第一回生成AI実践研究会「AI駆動開発の現在地──ブレイクスルーの鍵を握るのはデータ領域」
shisyu_gaku
0
330
Unlocking the Power of AI Agents with LINE Bot MCP Server
linedevth
0
110
「Linux」という言葉が指すもの
sat
PRO
4
140
Apache Spark もくもく会
taka_aki
0
130
サラリーマンの小遣いで作るtoCサービス - Cloudflare Workersでスケールする開発戦略
shinaps
2
470
Create Ruby native extension gem with Go
sue445
0
120
普通のチームがスクラムを会得するたった一つの冴えたやり方 / the best way to scrum
okamototakuyasr2
0
110
slog.Handlerのよくある実装ミス
sakiengineer
4
450
「何となくテストする」を卒業するためにプロダクトが動く仕組みを理解しよう
kawabeaver
0
430
バイブスに「型」を!Kent Beckに学ぶ、AI時代のテスト駆動開発
amixedcolor
2
580
「全員プロダクトマネージャー」を実現する、Cursorによる仕様検討の自動運転
applism118
22
12k
COVESA VSSによる車両データモデルの標準化とAWS IoT FleetWiseの活用
osawa
1
380
Featured
See All Featured
Done Done
chrislema
185
16k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
131
19k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
580
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
61k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
How to Ace a Technical Interview
jacobian
279
23k
Balancing Empowerment & Direction
lara
3
620
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.9k
The Cult of Friendly URLs
andyhume
79
6.6k
Become a Pro
speakerdeck
PRO
29
5.5k
Context Engineering - Making Every Token Count
addyosmani
3
58
Transcript
Suzuki Shuto / Twitter @s2terminal_tech NiceGUI is Nice 1 1
Suzuki Shuto / Twitter @s2terminal_tech NiceGUI を知っていますか? Do you know
NiceGUI? 2 2
Suzuki Shuto / Twitter @s2terminal_tech NiceGUIとは • https://github.com/zauberzeug/nicegui/ • PythonだけでWebアプリをすぐ作れるフレームワーク
• StreamlitやGradioに似ている • Streamlitの特徴を述べたあと、NiceGUIとの違いを説明します ◦ Gradioについては触れないが、下記が詳しい ▪ 【Streamlitよりいいかも?】機械学習系のデモアプリ作成に最適!Gradio解説 - 学習する天然ニューラルネット https://aotamasaki.hatenablog.com/entry/gradio-explanation 3 3
Suzuki Shuto / Twitter @s2terminal_tech Streamlitの特徴 • pip installして コードを書いて
$ pythonで起動して localhost開けば Webアプリが動く • 簡単!便利! 4 4
Suzuki Shuto / Twitter @s2terminal_tech Streamlit is nice. 5 5
Suzuki Shuto / Twitter @s2terminal_tech Streamlitの弱点 • Streamlitは色々な事を”魔法”のようにやってくれるが 複雑な使い方すると、引っかかる事もある •
たとえば... ◦ 初期状態が外部から取得したデータなど常に変化する時 ◦ ボタンを押したら入力欄を増やすなど動的に定義したい時 6 6
Suzuki Shuto / Twitter @s2terminal_tech NiceGUIの特徴 • NiceGUIの使い方は Streamlitと似ている •
pip installして コード書いて起動したら Webアプリが動く • 簡単!便利! 7 7
Suzuki Shuto / Twitter @s2terminal_tech 8 画像はGitHub Star Historyより https://star-history.com/#zauberzeug/nicegui&streamlit/streamlit&gradio-app/gradio&Date
Suzuki Shuto / Twitter @s2terminal_tech NiceGUIとStreamlitの違い • NiceGUIは、より”素直に”動く ◦ 処理が意図せず実行されるような事が少ない
◦ フォームを動的に増減させる等が簡単にできる ◦ Vue(Quasar)やTailwind CSSの機能が露出しており Web開発の抽象度が比較的低くなっている 9 9
Suzuki Shuto / Twitter @s2terminal_tech NiceGUIとStreamlitの違い • 意図通り動かないStreamlitのコード 10 10
コードはNiceGUIのGitHub Issuesより引用 https://github.com/zauberzeug/nicegui/issues/1#issuecomment-847413651
Suzuki Shuto / Twitter @s2terminal_tech NiceGUIとStreamlitの違い • NiceGUIとStreamlitの使い方は似ている ◦ NiceGUIの公式サイトにも「We
like Streamlit」とある • NiceGUIには、入力のリアルタイム反映などのような Streamlitが持つ"魔法"のような機能は少なくなっている • NiceGUIはデータサイエンスや機械学習よりも より一般的なアプリケーション開発に向く 11 11
Suzuki Shuto / Twitter @s2terminal_tech まとめ Streamlit 入力をもとに自動で処理を実行し反映する →データアプリケーションが得意 Gradio
(ここでは触れてない) APIの発行やJupyter(Colab)上での実行ができる →機械学習アプリケーションが得意 NiceGUI 動的なUIフォームの定義が可能 →柔軟なアプリケーション構築が得意 12 12 • 適切に使い分けることで、より便利に!
Suzuki Shuto / Twitter @s2terminal_tech References • Streamlit ◦ https://github.com/streamlit/streamlit
• Gradio ◦ https://github.com/gradio-app/gradio • NiceGUI ◦ https://github.com/zauberzeug/nicegui/ 13