Streamlitを用いたWEBアプリの作成手順 – みんなのロボットサロン

概要：WEBフレームワークの１つであるStreamlitを用いたWEBアプリの作成と、をインターネット上で公開するまでの手順をご紹介します

WEBフレームワークとは、ウィキペディアによると動的なWebサイト、Webアプリケーション、Webサービスの開発をサポートするために設計されたフレームワークのことであり、Web開発で用いられる共通した作業に伴う労力を軽減できる。とあります。

StreamlitとはWEBフレームワークの１つで、他にも”Django”、”Flask”、”Bottle”などのフレームワークがありますが、Streamlitは簡単に開発、デプロイが可能・コードが直観的で分かりやすいといった特徴があります。またデータサイエンス領域のWebアプリ開発ができるなどの理由からStreamlitにフォーカスを当て話しを進めていきたいと思います。

完成形（めっちゃ、単純なアプリでごめんなさい。）

https://norihisayamada-generate-qrcode-main-6oy157.streamlit.app/

全体的な手順

１．コーディング

２．GitHub上で公開

３．CloudStreamlitで公開したレポジトリと紐づける

１. コーディング

「ChatGPTを使ってみる」で取上げたサンプルコードです

import qrcode

# QRコードに変換する文字列
data = title
qr = qrcode.QRCode(version=1, box_size=10, border=5)

# QRコードを生成する
img = qrcode.make(data)

# 生成したQRコードをファイルに保存する
img.save("example.png")

２．GithubリポジトリにWebアプリのソースコードをアップロード

作成したソースコードをGithubにアップロードしましょう（Githubの使い方は調べてみてね）。

echo “# generate-QRCode” >> README.md
git init
git add README.md
git commit -m “first commit”
git branch -M main
git remote add origin https://github.com/norihisayamada/generate-QRCode.git
git push -u origin main