✨ はじめに
こんにちは、Lucyです。
私はHTMLとCSSは扱えるのですが、PythonやFlaskはまったくの初心者でした。
今回は「音声ファイルを提出するWebアプリ」を作ってみたいと思い立ち、Flaskにチャレンジしました。
最初はエラーの連続で戸惑いましたが、最終的に動いたときの感動はひとしおでした。この記事ではその体験をシェアします。
⚙️ ステップ0：環境構築（Mac＋VS Code）
Macを使い、エディタにはVisual Studio Code（VS Code）を使用しました。以下のような手順で環境を整えます。
python3 -m venv venv
source venv/bin/activate
pip install flask
最初に pytho3 とタイプミスして「command not found」と言われたのも、今では良い思い出です。
仮想環境を作るのは初めてだったので、ここだけでちょっと緊張しました。
🚀 ステップ1：Flaskで最小アプリを作成
Flaskの基本構造を学びながら、app.py を作成して “Hello, world!” を表示させるところからスタートしました。
ですが、ターミナルで if if if> という謎の表示に悩まされました。
実はこれは「Pythonの対話モード」に迷い込んでいた状態で、Ctrl + D や exit() で抜けることができました。
このつまずきは、初心者ならではのリアル体験だと思います。
🎤 ステップ2：録音ファイルアップロード機能の実装
今回の目標は、生徒が録音した音声ファイルを提出し、先生が添削できる仕組みを作ること。
Flaskの request.files を使って、音声ファイルを保存する機能を作りました。
また、テンプレート用に templates フォルダを作り、upload.html を配置しました。
静的ファイル保存用には static/uploads フォルダを作成し、ファイルが保存されるように設定しました。
📁 Macユーザー向けの注意点
Finder上では「新しいファイルを作成」ができません。
私はここで少し混乱しましたが、VS Codeで「右クリック → 新しいファイル作成」が一番確実でした。
🌟 ステップ3：アプリを実行してみる
準備が整ったら python app.py を実行。
ターミナルに Running on http://127.0.0.1:5000/ と表示されたときはとても感動しました。
ブラウザでこのURLを開くと、アップロード画面が表示され、実際に音声ファイルを選んでアップロードできました！
保存先にちゃんとファイルが入っているのを確認したとき、本当に「作れたんだ！」という達成感がありました。
📖 Pythonをもっと学びたい人へ（アフィリエイト）
今回の開発はほぼ独学でしたが、やっぱり「ここ誰かに聞きたい！」と思う場面が多かったです。
そんなときに役立つ学習サービスもご紹介しておきます。
-
TechAcademyのPythonコース：マンツーマンのサポートつきで短期間にしっかり学びたい方向け
-
Schoo(スクー)：ライブ配信＆動画見放題で気軽に学びたい方向け
🌈 おわりに
今回は、Python初心者の私がFlaskを使って音声アップロードアプリを作るまでの体験を書きました。
小さなつまずきがたくさんあって、悩むことも多かったけれど、動いたときの感動はそれ以上でした。
「初心者だけど挑戦してみたい」「エラーにめげそうだけど一歩ずつ進みたい」
そんな方に、この記事が少しでも励みになればうれしいです。
完璧じゃなくていい、動いたら100点！
最後まで読んでくださり、ありがとうございました。