I have seen examples on how to mix Hugo with dynamic content, and I have already gotten some good results doing just that.
To have a more seamless experience, I was hoping that it would be possible the reuse the “Hugo engine” for generating dynamic templates?
For a basic example, let’s say we have a basic template with navbar and footer that are statically generated with Hugo, and a user dashboard that prints the name of the user. Is it possible to integrate this dynamically generated block into a staticaly generated template?
The alternative is to use the solution linked as a reference below, but it feels clunky/hacky
{{/* /layouts/dynamic/dashboard.html */}}
{{ define "dynamic_dashboard" }}
{{/* ... all blocks from here are dynamically parsed */}}
<p> Hello {{ .user.name }} </p>
{{ end }}
// Generate_dashboard.go
func render_dashboard(user User) bytes.Buffer {
templ := template.Must(template.ParseFiles("/layouts/dynamic/dashboard.html"))
// Execute the template with dynamic data
var body bytes.Buffer
err := templ.Execute(&body, struct {
user User
}{user: user})
if err != nil {
fmt.Println("error executing template: ", err)
return bytes.Buffer{}
}
return body
}
I could absolutely use JS, this is simply to study of the feasibility of leveraging the Hugo templating sweetness to do server side rendering. This way my application architecture remains similar to writing a static Hugo page, but augmented by injecting dynamic variables.
I am sorry for the confusing phrasing of my post. Also the go example is not a good illustration given that I don’t have a solution yet. Let me demystify.
I want to generate a page dynamically with my go binary when the user consults his dashboard, which contains data that is not static.
I want to inject that data using a go template to generate the dashboard from the server side. That template would reuse the existing templates from the Hugo site so the dynamic dashboard feels similar to the static pages.
I accept that Hugo is meant for static sites, and it is definitely possible to achieve the same results by other means. I was wondering if this is an interesting use case.
I will at least give an alternative to whoever might stumble onto this.
Using HTMX, you can load a block of HTML generated on the backend. This is also arguably better as the site gets delivered faster and gets completed with user data comes after being fetched
func main() {
// Serve the static website built with Hugo
http.Handle("/", http.FileServer(http.Dir("../public")))
http.HandleFunc("/dashboard-dynamic", render_dashboard)
}
func render_dashboard(w http.ResponseWriter, r *http.Request) bytes.Buffer {
templ := template.Must(template.ParseFiles("/backend/dashboard.html"))
// Execute the template with dynamic data
user := User {
Name: "Slim Shady"
}
var body bytes.Buffer
err := templ.Execute(&body, struct {
user User
}{User: user})
if err != nil {
fmt.Println("error executing template: ", err)
fmt.Fprintln(w, "<p>Internal server error -", err, "</p>")
}
fmt.Fprint(w, body.String())
}