FastHTML快速入门:服务器渲染超媒体应用的利器

项目简介

FastHTML是一个Python库,它将Starlette、Uvicorn、HTMX和fastcore的FT "FastTags"融合在一起,用于创建服务器渲染的超媒体应用程序。FastHTML类本身继承自Starlette,并增加了基于装饰器的路由、Beforeware、自动将FT渲染为HTML等功能。

写作FastHTML应用时需记住的事项

  • FastHTML的部分API灵感来源于FastAPI,但它兼容FastAPI语法,也不是用于创建API服务的。
  • FastHTML支持Pico CSS和fastlite sqlite库,但使用这两者都是可选的;可以直接使用sqlalchemy,或者通过fastsql库使用。此外,还支持Surreal和css-scope-inline库,但这两者也是可选的。
  • FastHTML兼容JS原生Web组件和任何原生JS库,但不支持React、Vue或Svelte。
  • 使用serve()来运行uvicorn(不需要if __name__ == "__main__",因为它是自动的)。
  • 当响应需要标题时,使用Titled;注意,它已经将子元素包裹在Container中,并已包含元标题和H1元素。

开发者快速入门指南

安装

bash 复制代码
pip install python-fasthtml

最小应用示例

一个最小的FastHTML应用程序如下所示:
main.py

python 复制代码
from fasthtml.common import *
app, rt = fast_app()
@rt("/")
def get():
    return Titled("FastHTML", P("让我们开始吧!"))
serve()

第1行:我们导入了快速开发所需的内容!为了方便起见,FastHTML精心挑选的一些函数和其他Python对象被引入到我们的全局命名空间中。

第3行:我们使用fast_app()实用函数实例化一个FastHTML应用程序。这为我们提供了许多非常有用的默认设置,我们将在教程后面利用它们。

第5行:我们使用rt()装饰器告诉FastHTML,当用户在浏览器中访问/时应该返回什么。

第6行:我们通过定义一个名为get()的视图函数,将此路由连接到HTTP GET请求。

第7行:一个由Python函数调用组成的树,返回编写一个格式正确的网页所需的所有HTML。你很快就会看到这种方法的强大之处。

第9行:serve()实用程序使用名为uvicorn的库配置并运行FastHTML。

运行代码:

bash 复制代码
python main.py

终端将显示如下内容:

bash 复制代码
INFO:     Uvicorn运行在http://0.0.0.0:5001(按CTRL+C退出)
INFO:     使用WatchFiles启动了重载器进程[58058]
INFO:     启动了服务器进程[58060]
INFO:     等待应用程序启动。
INFO:     应用程序启动完成。

打开浏览器,访问127.0.0.1:5001确认FastHTML正在运行。

注意

尽管一些代码审查工具和开发者可能会对通配符导入表示担忧,但在这里它是经过设计的,并且非常安全。FastHTML非常谨慎地导出fasthtml.common中的对象。如果你觉得不舒服,可以单独导入你需要的对象,尽管这样做会使代码更加冗长且不易阅读。

如果你想了解更多关于FastHTML如何处理导入的信息,我们在这里进行了介绍:为什么使用导入

最小图表应用示例

Script函数允许你包含JavaScript。你可以使用Python生成JS或JSON的部分内容,如下所示:

python 复制代码
import json
from fasthtml.common import * 
app, rt = fast_app(hdrs=(Script(src="https://cdn.plot.ly/plotly-2.32.0.min.js"),))
data = json.dumps({
    "data": [{"x": [1, 2, 3, 4],"type": "scatter"},
            {"x": [1, 2, 3, 4],"y": [16, 5, 11, 9],"type": "scatter"}],
    "title": "FastHTML中的Plotly图表",
    "description": "这是一个演示仪表板",
    "type": "scatter"
})
@rt("/")
def get():
  return Titled("图表演示", Div(id="myDiv"),
    Script(f"var data = {data}; Plotly.newPlot('myDiv', data);"))
serve()

以上就是FastHTML的快速入门指南,希望对你有所帮助!

相关推荐
正经教主3 小时前
【问题】解决docker的方式安装n8n,找不到docker.n8n.io/n8nio/n8n:latest镜像的问题
运维·docker·容器·n8n
唯独失去了从容3 小时前
WebRTC服务器Coturn服务器中的通信协议
运维·服务器·webrtc
joker_zsl4 小时前
docker的安装和简单使用(ubuntu环境)
运维·docker·容器
Run1.5 小时前
深入解析 Linux 中动静态库的加载机制:从原理到实践
linux·运维·服务器
VI8664956I265 小时前
全链路自动化AIGC内容工厂:构建企业级智能内容生产系统
运维·自动化·aigc
码农hbk6 小时前
linux ptrace 图文详解(七) gdb、strace跟踪系统调用
linux·服务器
264玫瑰资源库6 小时前
斗鱼娱乐电玩平台源码搭建实录
运维·服务器·游戏·娱乐
hotlinhao6 小时前
ThinkPHP6模型中多组条件逻辑或Or查询的使用
linux·服务器·数据库
Jogging-Snail6 小时前
从零开始掌握Linux数据流:管道与重定向完全指南
linux·运维·管道·重定向·linux 数据流·管道原理
niuTaylor7 小时前
Linux驱动开发快速上手指南:从理论到实战
linux·运维·开发语言·驱动开发·c#