Python＋FlaskでWebアプリを作る手順まとめ

プログラミング

Webアプリを自分で作ってみたいけれど、「何から始めたらいいかわからない」とお悩みではありませんか？
そんな方におすすめなのが、PythonとFlaskを使ったシンプルなWebアプリ作成です。

Pythonは初心者にも理解しやすく、Flaskは軽量で学びやすいフレームワークです。
この記事では、Webアプリを作るために必要な手順を丁寧に解説します。

コード付きで手順をまとめていますので、誰でもすぐに動くアプリを作ることが可能です！

PythonとFlaskとは何かを解説

FlaskはWebアプリに最適な理由

結論：PythonとFlaskを使えば、少ないコードでWebアプリが作れます。

理由：

  • Pythonは読みやすい
  • Flaskは軽量かつ自由度が高い
  • 初心者にも扱いやすい

たとえば、次のような特徴があります：

  • 1ファイルでアプリ構築が可能
  • 学習コストが低い
  • 機能を後から拡張しやすい

このため、Flaskは学習にも実用にもぴったりな選択肢です。

Flaskの開発環境を準備する

Python・Flaskのインストール

以下の手順で開発環境を整えましょう。

1
2
3
4
5
6
7
8
9
10
# Pythonをインストール（公式サイトより）
 
<a rel="noopener" href="https://www.python.org/" title="Welcome to Python.org" class="blogcard-wrap external-blogcard-wrap a-wrap cf" target="_blank"><div class="blogcard external-blogcard eb-left cf"><div class="blogcard-label external-blogcard-label"><span class="fa"></span></div><figure class="blogcard-thumbnail external-blogcard-thumbnail"><img decoding="async" src="https://www.python.org/static/opengraph-icon-200x200.png" alt="" class="blogcard-thumb-image external-blogcard-thumb-image" width="160" height="90"></figure><div class="blogcard-content external-blogcard-content"><div class="blogcard-title external-blogcard-title">Welcome to Python.org</div><div class="blogcard-snippet external-blogcard-snippet">The official home of the Python Programming Language</div></div><div class="blogcard-footer external-blogcard-footer cf"><div class="blogcard-site external-blogcard-site"><div class="blogcard-favicon external-blogcard-favicon"><img decoding="async" src="https://www.google.com/s2/favicons?domain=https://www.python.org/" alt="" class="blogcard-favicon-image external-blogcard-favicon-image" width="16" height="16"></div><div class="blogcard-domain external-blogcard-domain">www.python.org</div></div></div></div></a>
 
# 仮想環境の作成
python -m venv venv
source venv/bin/activate  # Windowsなら venv\Scripts\activate
 
# Flaskのインストール
pip install flask

仮想環境を利用することで、他のプロジェクトに影響を与えません。

Webアプリの構成を設計する

最小構成のディレクトリ

1
2
3
4
myapp/
├── app.py
└── templates/
    └── index.html

最初はファイルを少なくして、動作を確かめながら進めましょう。

Flaskで基本のルーティングを作る

「Hello, World!」を表示するコード

1
2
3
4
5
6
7
8
9
10
from flask import Flask
 
app = Flask(__name__)
 
@app.route("/")
def hello():
    return "Hello, World!"
 
if __name__ == "__main__":
    app.run(debug=True)

ブラウザで http://localhost:5000 にアクセスすれば表示されます。

HTMLテンプレートを組み込む

Jinja2で動的なページを表示

1
2
3
4
5
6
7
from flask import Flask, render_template
 
app = Flask(__name__)
 
@app.route("/")
def index():
    return render_template("index.html")
1
2
3
4
5
6
7
8
&lt;!-- templates/index.html -->
&lt;!DOCTYPE html>
&lt;html>
&lt;head>&lt;title>Flask App&lt;/title>&lt;/head>
&lt;body>
  &lt;h1>Flask Webアプリへようこそ&lt;/h1>
&lt;/body>
&lt;/html>

これで、静的HTMLも読み込めるようになります。

フォームの入力を受け取る方法

POST送信の受け取り

1
2
3
4
5
6
from flask import request
 
@app.route("/submit", methods=["POST"])
def submit():
    name = request.form.get("name")
    return f"{name}さん、送信ありがとうございます！"

フォームの入力を処理し、動的に応答を表示できます。

よくあるエラーとその解決策

  • ModuleNotFoundError: No module named 'flask'
    → Flaskのインストールが必要です。pip install flask を忘れずに。
  • jinja2.exceptions.TemplateNotFound
    → templates フォルダ内にHTMLを置いているか確認してください。

完成形コード（app.py）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
from flask import Flask, render_template, request
 
app = Flask(__name__)
 
@app.route("/")
def index():
    return render_template("index.html")
 
@app.route("/submit", methods=["POST"])
def submit():
    name = request.form.get("name")
    return f"{name}さん、送信ありがとうございます！"
 
if __name__ == "__main__":
    app.run(debug=True)

まとめ：Python＋Flaskは最強の入門環境

  • Python＋FlaskでWebアプリが作れる
  • 初心者にもわかりやすい構文
  • フォームやHTMLも簡単に連携可能
  • 環境構築もシンプル

まずは「Hello, World!」を表示するところから始めましょう。
次は、データベース連携やログイン機能にも挑戦してみてください！

タイトルとURLをコピーしました