Day 6 的網站還是從 sample_media 讀取資料。今天要正式把它改成從資料庫查詢，這樣後續新增作品才會自動出現在頁面。
步驟 1：修改 app.py
將整份 app.py 替換成下面版本：
from flask import Flask, render_templatefrom database import get_db_connection, init_dbapp = Flask(name)# 啟動時確認資料表存在init_db()@app.route("/")def home(): connection = get_db_connection() movie_count = connection.execute(""" SELECT COUNT() FROM media WHERE media_type = 'movie' """).fetchone()[0] game_count = connection.execute(""" SELECT COUNT() FROM media WHERE media_type = 'game' """).fetchone()[0] connection.close() return render_template( "index.html", movie_count=movie_count, game_count=game_count )@app.route("/movies")def movies(): connection = get_db_connection()

步驟 2：修改 templates/index.html
將首頁替換成：

{% extends "base.html" %}

{% block title %}首頁 - My Media Library{% endblock %}

{% block content %}

<div class="hero-actions">
    <a class="button" href="{{ url_for('movies') }}">
        查看電影（{{ movie_count }}）
    </a>
    <a class="button button-secondary" href="{{ url_for('games') }}">
        查看遊戲（{{ game_count }}）
    </a>
</div>

這裡使用 COUNT(*) 計算資料筆數。首頁顯示的數字不再是手動寫死的，而是由資料庫計算出來。
步驟 3：修改 templates/collection.html
將內容替換成：

{% extends "base.html" %}

{% block title %}{{ title }} - My Media Library{% endblock %}

{% block content %}

    <p>
        {{ item["year"] or "年份未填" }}
        ·
        {{ item["genre"] or "未分類" }}
    </p>

    <p>狀態：{{ item["status"] }}</p>

    {% if item["rating"] is not none %}
        <p>我的評分：{{ item["rating"] }}/10</p>
    {% else %}
        <p>尚未評分</p>
    {% endif %}

    {% if item["notes"] %}
        <p>{{ item["notes"] }}</p>
    {% endif %}
</article>
{% else %}
<div class="card empty-state">
    <h2>還沒有收藏</h2>
    <p>新增第一部電影或第一款遊戲吧！</p>
</div>
{% endfor %}

步驟 4：測試

1. 停止原本的 Flask 伺服器。
2. 執行 python app.py。
3. 開啟首頁。
4. 確認首頁顯示電影與遊戲數量。
5. 開啟電影頁，確認顯示兩部電影。
6. 開啟遊戲頁，確認顯示 Hades。