如何使用 templ 在 Go 中编写 HTML 用户界面?

简介templ[1] 是一个在 Go 中编写 html 用户界面的语言 。使用 templ,我们可以创建可呈现 HTML 片段的组件,并将它们组合起来创建屏幕、页面、文档或应用程序 。
安装我们可以通过以下两种方式来安装 templ:
go 安装首先,我们需要安装 Go 1.20 或更高版本 。然后 , 在命令行中运行以下命令:
go install Github.com/a-h/templ/cmd/templ@latest二进制安装我们也可以从 GitHub 的发布页[2] 下载并安装二进制文件 。
创建简单的模板组件让我们来创建一个简单的 templ 组件 。
首先 , 我们需要创建一个新的 Go 项目 。在命令行中执行以下命令:
mkdir templDemocd templDemogo mod init然后,我们创建一个包含组件的 hello.templ 文件 。组件是一个函数,它包含 templ 元素、标记以及 if、switch 和 for 表达式 。
package mAIntempl hello(name string) { <div>Hello, { name }</div>}接下来 , 我们执行 templ generate 命令生成 Go 代码 。命令的输出如下:
Processing path: templDemoGenerated code for "templDemo\hello.templ" in 2.2127msGenerated code for 1 templates with 0 errors in 2.7429mstempl 会生成一个名为 hello_templ.go 的文件,其中包含生成的 Go 代码 。这个文件中包含一个名为 hello 的函数,它接受一个名为 name 的参数,并返回一个可渲染 HTML 的 templ.Component 。
func hello(name string) templ.Component {// ...}接下来,我们编写一个程序将组件渲染到 stdout 。创建一个名为 main.go 的文件 。
package mainimport ( "context" "os")func main() { component := hello("Tim") component.Render(context.Background(), os.Stdout)}最后 , 我们执行以下命令来运行程序 。程序会将组件的 HTML 输出到 stdout 。
go run main.go输出结果如下:
<div>Hello, Tim</div>我们可以将任何实现 io.Writer 接口的类型传递给组件的渲染函数,而不仅仅是将 os.Stdout 传递进去 。这意味着我们可以将输出写入文件、bytes.Buffer 或 HTTP 响应中 。
通过这种方式,我们可以使用 templ 生成 HTML 文件,并将其作为静态内容托管在 S3 存储桶、google Cloud Storage 中,或者将其用于生成 HTML 文件,然后通过转换流程转换为 PDF 或通过电子邮件发送 。
运行第一个模板应用程序让我们更新之前的应用程序,通过 HTTP 提供 HTML 页面,而不是将其写入终端 。
首先,我们需要更新 main.go 文件 。我们可以使用 templ.Handler 函数将 templ 组件作为标准的 HTTP 处理器 。
package mainimport ( "fmt" ".NET/http" "github.com/a-h/templ")func main() { component := hello("Tim")http.Handle("/", templ.Handler(component)) fmt.Println("Listening on :3000") http.ListenAndServe(":3000", nil)}运行程序后 , 我们可以在浏览器中访问相应的页面:

如何使用 templ 在 Go 中编写 HTML 用户界面?

文章插图
图片
结束语现在 , 我们已经介绍了如何使用 templ 在 Go 中编写 HTML 用户界面 。templ 是一个成熟的工具 , 可以帮助我们快速构建 web 应用 。
参考资料[1]templ: https://github.com/a-h/templ
[2]GitHub 的发布页: https://github.com/a-h/templ/releases/tag/v0.2.476

【如何使用 templ 在 Go 中编写 HTML 用户界面?】


    推荐阅读