FastHTML

创建 HTML 应用最快、最强大的方式

欢迎来到 FastHTML 官方文档。

FastHTML 是一个全新的下一代 Web 框架，用于以最少、最紧凑的代码构建快速、可扩展的 Web 应用程序。它旨在

FastHTML 应用就是 Python 代码，因此您可以利用 Python 语言和生态系统的全部能力来使用 FastHTML。FastHTML 的功能与 HTML 和 HTTP 一一对应，但允许使用良好的软件工程实践对其进行封装——因此您需要理解这些基础知识才能充分利用此库。要了解其工作原理和原因，请先阅读这篇文章：fastht.ml/about。

安装

由于 fasthtml 是一个 Python 库，您可以使用以下命令安装它

pip install python-fasthtml

在不久的将来，我们希望添加同样可以通过 pip 安装的组件库。

用法

对于一个最简单的应用，请创建一个名为 “main.py” 的文件，内容如下

main.py
from fasthtml.common import *

app,rt = fast_app()

@rt('/')
def get(): return Div(P('Hello World!'), hx_get="/change")

serve()

使用 python main.py 运行该应用会打印出您正在运行的应用的链接：https://:5001。在浏览器中访问该链接，您应该会看到一个带有文本 “Hello World!” 的页面。恭喜，您刚刚创建了您的第一个 FastHTML 应用！

得益于 HTMX，添加交互性出奇地简单。修改文件以添加此函数

main.py
@rt('/change')
def get(): return P('Nice to be here!')

您现在有了一个带可点击元素的页面，点击后文本会发生变化。当点击此链接时，服务器将响应一个“HTML 片段”——即一小段 HTML，它将被插入到现有页面中。在这种情况下，返回的元素将替换原始的 P 元素（因为这是 HTMX 的默认行为），替换为第二个路由返回的新版本。

这种“基于超媒体”的 Web 开发方法是构建 Web 应用程序的强大方式。

从 AI 获取帮助

因为 FastHTML 比大多数大语言模型 (LLM)更新，像 Cursor、ChatGPT、Claude 和 Copilot 这样的 AI 系统不会给出关于它的有用答案。为了解决这个问题，我们提供了一份 LLM 友好的指南，教它们如何使用 FastHTML。要使用它，请将此链接添加给您的 AI 助手使用

此示例的格式基于 Anthropic 推荐用于 Claude Projects 的格式。这种方法效果非常好，我们甚至发现 Claude 能够提供比我们自己的文档更好的信息！例如，请阅读这份带注释的 Claude 聊天记录，其中包含一些很棒的入门信息，完全是基于使用上述文本文件作为上下文的项目生成的。

如果您使用 Cursor，请键入 @doc 然后选择“添加新文档”，并使用上面的 /llms-ctx.txt 链接。该上下文文件是根据我们的 llms.txt（我们提议的提供 AI 友好信息的标准）自动生成的——您可以根据需要生成适合其他模型的备用版本。

后续步骤

从官方资源开始，了解更多关于 FastHTML 的信息

  • 关于：了解 FastHTML 背后的核心思想
  • 文档：通过示例学习如何编写 FastHTML 代码
  • 惯用法应用：带有大量注释的源代码，引导您完成一个完整的应用程序，包括自定义身份验证、JS 库连接和数据库使用。

我们还有一个 1 小时的介绍视频

FastHTML 的功能非常广泛且在不断增长，并非所有功能和模式都已被记录下来。请准备好投入时间研究和修改源代码，例如 FastHTML 主仓库的 notebook 和官方 FastHTML 示例仓库

然后探索虽小但不断增长的 FastHTML 第三方生态系统，包括教程、notebook、库和组件

最后，加入 FastHTML 社区，提问、分享您的作品并向他人学习