Python FastHTML 入門教學：用純 Python 打造互動網頁，真的能取代 Flask 嗎？

FastHTML 是什麼？為什麼突然爆紅？

如果你跟我一樣，寫 Python 寫了好幾年，每次需要做網頁就得切換到 JavaScript 的世界，那你一定能理解 FastHTML 出現時的那種興奮感。簡單來說，FastHTML 是一個讓你用純 Python 寫互動網頁的框架，底層整合了 HTMX 和 Starlette，讓你不用寫一行 JS 就能做出動態更新的 UI。

它的核心理念很清楚：Python 開發者不應該被迫學前端框架才能做出像樣的網頁應用。這個想法其實不新，但 FastHTML 的實作方式確實讓人眼前一亮。

FastHTML vs Flask：到底差在哪？

先說結論：FastHTML 不是要「取代」Flask，而是提供了一個完全不同的開發思路。Flask 是傳統的 MVC 框架，你寫路由、寫模板、前後端分離。FastHTML 則是把 HTML 直接用 Python 物件表示，搭配 HTMX 做局部更新。

舉個例子，Flask 裡你可能這樣寫：

@app.route('/hello')
def hello():
    return render_template('hello.html', name='World')

在 FastHTML 裡，同樣的事情變成：

@app.get('/hello')
def hello():
    return Titled('Hello', P('Hello, World!'))

看到差別了嗎？不需要模板檔案，HTML 結構直接用 Python 函式表達。對於小型專案和 Prototype 來說，這真的省了不少時間。

HTMX 整合：不寫 JS 也能做互動

FastHTML 最強大的地方在於它跟 HTMX 的深度整合。HTMX 讓你透過 HTML 屬性就能發送 AJAX 請求、做局部頁面更新，完全不需要 JavaScript。

比如你想做一個「點擊按鈕載入更多」的功能，在 FastHTML 裡大概長這樣：

@app.get('/load-more')
def load_more(page: int = 1):
    items = get_items(page)
    return Ul(*[Li(item.name) for item in items])

前端按鈕加上 hx-get="/load-more?page=2" 和 hx-target="#item-list"，就完成了。老實說，第一次看到這個操作的時候，我是真的驚艷到。不過話說回來，如果你的專案需要複雜的前端互動（比如拖拉排序、即時協作），HTMX 的能力還是有限的。

實戰：用 FastHTML 做一個待辦事項 App

來動手做一個簡單的 CRUD 應用吧。首先安裝：

pip install python-fasthtml

建立主程式 main.py：

from fasthtml.common import *

app, rt, todos, Todo = fast_app(
    'data/todos.db',
    todo=dict(id=int, title=str, done=bool, pk='id')
)

@rt('/')
def get():
    items = [Li(
        A(t.title, href=f'/todo/{t.id}'),
        ' ✓' if t.done else ''
    ) for t in todos()]
    form = Form(
        Input(name='title', placeholder='新增待辦事項...'),
        Button('新增'),
        method='post'
    )
    return Titled('待辦事項', Ul(*items), form)

@rt('/')
def post(todo: Todo):
    todos.insert(todo)
    return RedirectResponse('/', status_code=303)

serve()

跑起來只要 python main.py，一個有資料庫的待辦事項 App 就完成了。這個開發速度，說實話比 Flask 快了不止一點點。如果你對 Python 資料驗證有興趣，推薦看看 Pydantic v2 資料驗證教學，搭配 FastHTML 使用效果更好。

跟 FastAPI、Streamlit 比一比

很多人會問：「FastHTML 跟 FastAPI 差在哪？」答案是定位完全不同：

• FastAPI：專注在 API 開發，適合前後端分離架構，搭配 React/Vue 使用
• Streamlit：主打資料科學展示，適合做 dashboard，但客製化能力有限（想了解更多可以參考 Streamlit 資料儀表板教學）
• FastHTML：全端 Python 開發，適合中小型 Web App，原型製作特別快
• Flask：萬用型框架，生態系成熟，但需要搭配模板引擎

我個人的看法是：如果你是 Python 開發者，想快速做一個內部工具或 MVP，FastHTML 現在已經是一個很值得考慮的選項。但如果是大型商業專案，Flask 或 FastAPI 的生態系和社群支援還是更穩。

FastHTML 的優缺點誠實分析

優點

• 開發速度極快，特別適合 Prototype
• 不需要寫 JavaScript，Python 開發者超友善
• 內建 SQLite 整合，小專案不用額外設定資料庫
• HTMX 整合讓互動功能實作很直覺

缺點

• 社群還在成長階段，遇到問題可能找不到解答
• 不適合需要複雜前端邏輯的專案
• HTML-in-Python 的寫法不是所有人都喜歡
• 效能測試數據還不夠多

什麼時候該用 FastHTML？

根據我這幾個月的使用經驗，FastHTML 最適合這些場景：

• 內部工具：公司內部的管理後台、資料查詢介面
• MVP / Prototype：快速驗證想法，不用花時間搞前端
• CLI 工具的 Web 版：如果你已經有 Python CLI 工具，想加一個 Web 介面
• 教學用途：教 Python 學生做網頁開發，比 Flask 更容易上手

結語：FastHTML 值得學嗎？

如果你問我 FastHTML 現在能不能完全取代 Flask，我的答案是還不行。Flask 的生態系太成熟了，各種套件、教學資源、部署方案都很完整。但 FastHTML 代表了一個很有趣的方向——讓 Python 開發者用最熟悉的語言做全端開發。

我建議你至少花一個下午試玩一下。特別是如果你常常需要快速做 Prototype 或內部工具，FastHTML 可能會成為你的新武器。Python 的 Web 開發生態正在變得越來越多元，而這絕對是一件好事。