私たちの Telegramコミュニティ 最近、次のような質問が出されました。 PythonをHTMLとCSSにリンクして、実際のウェブサイトを作成するにはどうすればよいですか?
答えは簡単です。 Flask、最も人気のあるマイクロフレームワークの1つ。この記事は、Pythonを使用してサイトを作成するための最初のステップです。インストールから起動まで、すべての説明と例を使用します。

🐍 Flaskを選ぶ理由
Flaskは、Webアプリケーションを作成するためのミニマリストフレームワークです。その利点は次のとおりです。
✅ 簡単なスタート
✅ シンプルなアーキテクチャ
✅ HTMLテンプレートのサポート(Jinja2)
✅ 柔軟性 — プロジェクトの構築方法を自分で決める
⚙️ 何をインストールする必要がありますか?
開始する前に、Python 3.7 以降がインストールされていることを確認してください。
pip install flaskインストールの確認:
python -c "import flask; print(flask.__version__)"📁 プロジェクトの構造
my_website/
├── app.py
├── templates/
│ └── index.html
└── static/
└── style.csstemplates — HTMLの場合、 static — CSS、JS、および画像用。
🧠 ステップ1:Flaskアプリケーション(app.py)
from flask import Flask, render_template
app = Flask(__name__)
@app.route("/")
def home():
return render_template("index.html")
if __name__ == "__main__":
app.run(debug=True)🖼ステップ2:HTMLテンプレート(templates/index.html)
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Мой сайт на Flask</title>
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
</head>
<body>
<h1>Привет из Flask!</h1>
<p>Это наш первый сайт на Python с HTML и CSS 🐍</p>
</body>
</html>🎨ステップ3:CSSスタイル(static/style.css)
body {
font-family: 'Segoe UI', sans-serif;
background-color: #f5f5f5;
color: #333;
text-align: center;
margin-top: 80px;
}
h1 {
color: #0077cc;
font-size: 36px;
}
p {
font-size: 20px;
color: #555;
}🚀 プロジェクトを開始するにはどうすればよいですか?
ターミナルを開き、プロジェクトフォルダに移動します。
cd my_websiteサーバーを起動します。
python app.pyブラウザに移動します。 http://127.0.0.1:5000
🔍 どのように関連しているのでしょうか?
コンポーネント | 何をするか |
|---|---|
Flask | ユーザーからのリクエストを受け付ける |
HTMLテンプレート | ブラウザにページを返します |
CSS | スタイルを与える |
Python | ロジック、ルート、データを管理します |
🧱 改善できる点は何ですか?
➕ さらにルートを追加
🧾 テンプレートにデータを送信する
📄 Bootstrap または Tailwind を接続する
🗃 フォームとデータベース操作を追加する
👀ミニライフハック
@app.route("/hello/<name>")
def hello(name):
return f"<h2>Hello, {name}!</h2>"これで、/hello/Кодикに切り替えると、🖐の挨拶が表示されます
もっと練習したいですか? コディックアプリ Python、HTML、その他のテクノロジーのコースがあります。タスクを実行し、ミニプロジェクトを実行し、他の開発者と通信します 私たちのTelegramコミュニティ。
💬フォーム、データベース、またはホスティングのデプロイメントの続きが必要な場合は、コメントに書いてください!
