vscode＋flaskでtemplates内のhtmlが表示されない(初心者)

実現したいこと

flask_workship\use_template_control_syntax\app.pyの実行結果を正しく表示させたい
初めに、質問をするのが初めてのため伝わりにくい点がございましたら、大変申し訳ございません。

発生している問題・分からないこと

flask_workship/
├── .vscode/
│ └── settings.json # VSCode設定ファイル
├── use_template_basic/
│ ├── app.py
│ ├── templates/
│ │ ├── top.html
│ │ └── write.html
└── use_template_control_syntax/
├── app.py
├── templates/
│ ├── top.html
│ └── write.html
├── flask_env/ # 仮想環境
├── Scripts/ # 仮想環境用のスクリプト
├── Lib/ # ライブラリが格納されているディレクトリ
└── ...

フォルダの階層は上記のようになっております。
「cd use_template_control_syntax」で移動し、移動後「py app.py」をすると「use_template_basic内のapp.pyで実行したときの画面」が映されてしまいます。
また、「use_template_control_syntax内のapp.py」を右クリックし、ターミナルでpythonファイルを実行するなどをしても、同じような挙動となってしまいます。

実行の際、vscodeのターミナルでは
「
PS C:\python\python3.12\flask_workship> & c:/python/python3.12/flask_workship/flrask_env/Scripts/python.exe c:/python/python3.12/flask_workship/use_template_control_syntax/app.py

Serving Flask app 'app'
Debug mode: on

WARNING: This is a development server. Do not use it in a production deployment. Use a production WSGI server instead.

Running on http://127.x.x.x:ポート番号

Press CTRL+C to quit

Restarting with stat
Debugger is active!
Debugger PIN: 116-459-061　」

該当のソースコード

python
1下記が、use_template_control_syntax内のファイル群のソースコードです。
2
3top.html
4
5<!DOCTYPE html>
6<html lang="ja">
7<head>
8    <meta charset="UTF-8">
9    <meta name="viewport" content="width=device-width, initial-scale=1.0">
10    <title>掲示板のトップページ</title>
11</head>
12<body>
13    <header>
14        <h1>
15            <!--「login_user_name」の値に応じた条件分岐-->
16            {% if login_user_name %}
17            掲示板のトップページ - {{login_user_name}}さん
18            {% else %}
19            掲示板のトップページ - ゲストさん
20            {% endif %}
21        </h1>
22        <!--メニュー-->
23        <nav>
24            <ul>
25                <li>
26                    <!--「/」にアクセスするurlを作成-->
27                    <a href="{{url_for('index')}}">トップページ</a>
28                </li>
29                <li>
30                    <!--「write」にアクセスするurlを作成-->
31                    <a href="{{url_for('write')}}">書き込みページ</a>
32                </li>
33            </ul>
34        </nav>
35    </header>
36    <main>
37        <!--繰り返し機能を使って「message_list」を表示-->
38        {% for message in message_list %}
39        <article>
40            <p>{{message.id}} - {{message.user_name}}</p>
41            <p>{{message.contents}}</p>
42        </article>
43        {% endfor %}
44    </main>
45</body>
46</html>
47
48app.py
49
50#render_templateのインポート
51from flask import Flask,render_template
52
53app: Flask = Flask(__name__)
54
55#掲示板一つ一つのメッセージを示すクラス
56class Message:
57    #コンストラクター
58    def __init__(self,id:str,user_name:str,contents:str):
59        self.id = id
60        self.user_name = user_name
61        self.contents = contents
62
63#「/」にアクセスがあった場合のルーティング
64@app.route("/")
65def index():
66    login_user_name:str = "osamu"
67    #メッセージリストを作成
68    message_list = [
69        Message("2024005021310","osamu","朝からビールですか！楽しみです"),
70        Message("1312312455555","noriko","こちらこそ！次回はABコースで"),
71        Message("9998889989000","osamu","昨日はHBコース楽しかったです!"),
72    ]
73    #「top.html」に「login_user_name」や「message_list」を当てはめて表示
74    return render_template(
75        "top.html",login_user_name = login_user_name,message_list = message_list
76    )
77
78
79#「write」にアクセスがあった場合のルーティング
80@app.route("/write")
81def write():
82    #「write.html」の表示
83    return render_template("write.html")
84
85if __name__ == "__main__":
86    app.run(debug=True)