一覧へ | 授業のページ | 復習 | 探究ノート

予習 | 高校の情報学探究 Streamlit で Web アプリを作る | 第1回

アプリの実行と編集

授業の前に 10 分。読んで、少しやって、予想を一つ選ぶ。書いたものはこの端末に残る

10分 | ひとりで、端末で
01授業に持っていく問い

自分の端末やスマートフォンで開くページの中には、何かを入れると、何かが返ってくるものがある。郵便番号を入れると住所が出る。金額と人数を入れると一人ぶんが出る。生まれた年を入れると年齢が出る。どれも、入れる欄と、返ってくる場所が一組になっている。 こういうページは、特別な人だけが作れるものだろうか。この単元では、Python を数十行書くだけで、同じ形のものを作り、最後には他の人の端末から開けるところまで行く。第1回は、まず自分の端末で動かすところまで進む。使うのは 5 行だけだ。 その 5 行を動かしたとき、画面に何がどう出るかを、動かす前に言い当てられるだろうか。Python を書いてきた人なら、たぶん半分は当たる。残り半分で、たいてい引っかかるところがある。

02見ておく言葉
Streamlit
Python を数十行書くと、入力すると結果が返るページになる道具。HTML も CSS も書かない
app.py
書いたプログラムを保存するファイルの名前。これを動かすと、ページになる
pip install
道具を自分の端末に一度だけ入れる命令。入れるのは最初の 1 回だけ
streamlit run
保存した app.py を動かす命令。打つとブラウザが開く
st.title / st.write
画面に出す命令。title は大きな見出し、write は何でも出す

pip install と streamlit run は、ふだんのアプリの画面ではなく、文字の命令を打ち込む専用の画面に打つ。Windows なら「コマンド プロンプト」、Mac なら「ターミナル」という名前で、アプリの一覧から探せる。打ったら、そのつど Enter を押す

その画面が学校の端末で開けないことや、pip install が通らないことはよくある。そのときは授業で別のやり方を出すので、動かせなくても心配しなくてよい。「何を入れると何が返るか」の設計は紙でも書けるので、予習はここまでで足りる

03やってみる

自分が使ったことのあるページやアプリの中から、「何かを入れると、何かが返ってくる」ものを 3 つ思い出す。それぞれについて、入れるものと返るものを一組で書く。

04予想
次の 5 行を動かすと、画面に何が出るか。import streamlit as st / st.title("こんにちは") / st.write("これは、わたしの最初のアプリです") / st.write(3 + 4) / st.caption("いちばん下に、小さい字で出る")

答えは授業で確かめる。選んだものはこの端末に残り、復習のページにも出る

授業のページへ
書いたものの残り方

このページに書いたものは、いま使っているこの端末の、このブラウザの中にだけ残ります。サーバには送られません。次に同じ端末で開けば、書いたものはそのまま出ます。

別の端末で開くと見えません。学校の端末と家の端末は別ものとして扱われます。ブラウザの履歴やサイトデータを消したときも、一緒に消えます。残しておきたいものは、下の「書いたものをコピー」で自分のノートや提出先に貼ってください。