TRtrentnix·Jul 30, 2025
I'll eventually make my repo public on Github, but I'm hesitant because it's still pretty half-baked. In the meantime, I'll do my best to capture the essentials. It's been a minute since I implemented it, so I apologize if I miss some details.
I use the same ViewModel structure for all renders, a struct called Content. It has a members to help with rendering and whatnot, and the data being rendered in my HTML template is stored in a Data type for the content that will be displayed:
Data any
So whether I'm rendering complex data, a form, or just a snippet of text, that's where it lives. That allows for all sorts of patterns for rendering data and re-using templates if that's what you want to do. Or you can just keep things simple.
Hat-tip to the Pagoda framework, which was used sometimes as an inspiration and other times as a guideline
Read the rest
for this (and other) patterns that I used. You can find it here: https://github.com/mikestefanello/pagoda
I also have, as part of my ViewModel, a `Notifications` slice that specifies messages to send to the user and their type:
Notifications []messages.Notification
I have a HTML layout for my full page that includes a section that CSS uses to pick up notifications and display them via a toaster message:
<div id="user-notifications" class="toaster-container">
{{ range .Notifications }}
<div class="toaster{{ if .IsSuccess }} success{{ else if .IsError }} error{{ end }}">
{{ .Message }}
</div>
{{ end }}
</div>
I managed to get it working without any need for JavaScript (other than what HTMX needs to work).
My partial renders use a layout that includes a section for the partially rendered code and my oob Notifications:
{{ block "Content" . }}
Loading content.
{{ end }}
<div id="user-notifications" class="toaster-container" hx-swap-oob="true">
{{ range .Notifications }}
<div class="toaster{{ if .IsSuccess }} success{{ else if .IsError }} error{{ end }}">
{{ .Message }}
</div>
{{ end }}
</div>
So the hx-swap-oob results in my user-notifications <div> being replaced with new notifications content, if there is any. I have a base renderer that handles injecting the layouts and injecting data into `Notifications`. As a result, my handlers can be generally oblivious that this is all happening underneath.
This model can work for updating links, updating breadcrumbs, writing messages to the console, or whatever.
I'm still scratching the surface with HTMX, but I'm convinced HTMX is perfectly appropriate and a much simpler alternative for 95% of the web dev being done today.