3 ms·

Htmx users, can you please share your backend stacks and approaches? Me specifically interested in templaters for node (+ts) and your thoughts on endpoint manag

by wruza 2y ago

Htmx users, can you please share your backend stacks and approaches? Me specifically interested in templaters for node (+ts) and your thoughts on endpoint management, but all ideas are welcome I guess.

otherflavors 2y ago
perl + Template Toolkit (using the underdocumented support for the fragment pattern with EXPOSE_BLOCKS), before finding htmx we used Jemplate, which let you compile Template Toolkit templates into Javascript functions
Raticus79 2y ago
I'll be trying things out with FastAPI and Jinja templating
simonbarker87 2y ago
NestJS with Handlebars templates. I don’t love Handlebars but I have past experience with it so was the most pragmatic choice. I’m interested in trying EdgeJS as a templating alternative to HB but haven’t got round to it yet. I’ve added a NestJS error handler that looks to see if the request came from an htmx request and then serve the error response as html, if not then it sends back json since I do have json api end points as well in the back end.
pondidum 2y ago
Go: go templates and fiber for http serving. I have a mini framework for adding some structure to the templates (folder per feature: contains controller, templates, etc, and some naming conventions)
- Art9681 2y ago
  This is my stack as well and it works great.
- jjude 2y ago
  I too use go + fiber + htmx. > mini framework for adding some structure to the templates Would be good to read little more about this mini-framework
fprotthetarball 2y ago
My backend for a simple web application I'm working on is entirely in Rust. Highlights: - axum: web application framework - https://github.com/tokio-rs/axum https://github.com/tokio-rs/axum - axum-htmx: axum extractors, responders, guards for htmx - https://github.com/robertwayne/axum-htmx https://github.com/robertwayne/axum-htmx - rusqlite: SQLite bindings - https://github.com/rusqlite/rusqlite https://github.com/rusqlite/rusqlite - maud: HTML templating as a macro - https://maud.lambda.xyz https://maud.lambda.xyz The way maud lets you compose markup works very nicely with htmx. The HX-Request header lets you know if the request is coming from htmx or if it is a regular request. You either call the top-level function if it's a regular request to get the entire page rendered, or call a subset of functions to get the appropriate partial rendered if it's an htmx request. It's also nice to easily have tests for the rendered pages. My unit tests cover verification of the rendered HTML, too.
- brunoqc 2y ago
  Do you use something like cargo-watch for "hot reload"?
  - fprotthetarball 2y ago
    No, I just stop and restart when I feel like I'm in a good spot. Nothing fancy.
swlkr 2y ago
rust and ryde (my own framework on top of axum and rusqlite)
PyWoody 2y ago
Flask+SQLite+TailwindCSS. It's basically cheating. The setup is dead-simple to operate.
- jononor 2y ago
  What do you use for templating/HTML generation?
  - PyWoody 2y ago
    The default Flask Jinja2 templating engine. It can get you very far.
    - jononor 2y ago
      True, it works just fine. But doing non trivial things in a templating language never quite sat well with me. So I am trying out dominate as a way of just doing everything in Python. Jury is still out though.
wruza 2y ago
Well, as I expected, templating is the hardest part of migrating to htmx on nodejs. After reviewing few templaters/etc (handlebars, ejs, lit-html, virtual-dom) and few abstractions (html``, just ``, h()), barely anything seems too easy and too freedom-y. Arcane syntaxes, high character noise (ejs, lit, js), lack of typing (all non-`` based), trivial screw ups (virtual-dom, handlebars), experimental status (lit ssr). Sigh.
- unsupp0rted 2y ago
  This was my experience as well. No great template generator on the node side. I use PUG. I don’t like to close HTML tags. This cuts 30% of the visual bloat out of my templates.
  - michaelcampbell 2y ago
    removingspacesgotridofalotofmybloatonregulartexttoo. One man's structure is another man's "bloat", I guess.
    - unsupp0rted 2y ago
      PUG actually adds spaces: it's indentation based. What it removes is the visual bloat of closing html tags. So instead of: <div id='foo' class='bar baz'> <p>Some content</p> </div> <div id='foo2' class='bar2 baz2'> <p>More content</p> <p>Another paragraph</p> </div> In PUG you do: #foo.bar.baz p Some content #foo2.bar2.baz2 p More content p Another Paragraph Even without syntax highlighting, it's plain at a glance where markup stops and content starts in PUG. And it's easier to visually parse element IDs and chained classes this way too.
emseetech 2y ago
Go with fasttemplate. Most people prefer templ but I don't like logic in templates, I just want to parse values. I keep different states in different template files. Each template file is a portion of a full page which makes it easy to create an endpoint that pulls the partial with the latest values. HTMX can then hit that endpoint to load or refresh values. Endpoints are usually domain/page/partial so if I'm on a configuration page at example.com/config then the endpoint for the privacy settings partial would be example.com/config/privacy Going directly there in a browser would get a 404 because I check for the HX-Request header. Endpoint handlers return a processed template with the current state. I use those functions to both compose the full page on the backend, and to build the output for the partial endpoint. I don't automatically expose all partials. I add endpoints as I need them. This is probably more idiomatically Go than anything to do with htmx.
amanzi 2y ago
Django user here. HTMX fits in perfectly with the Django templating system. A fairly common approach is to use the same view but check for the HTMX header and then return a template file with the specific bit of HTML being swapped. There's also work in the Django space to be able to return parts of a template based on the request, which will suit HTMX perfectly too.
- magnusstaberg 2y ago
  We use Django with https://htpy.dev/ https://htpy.dev/ as templating system.
- jmatthewp 2y ago
  [dead]
jsnelgro 2y ago
Htmx + Kotlin with ktor and the html dsl was really fun to play with on a personal project. Static typing, autocomplete and a full-fledged programming language available to use in your html markup is a game changer. I was structuring my endpoints as pairs of "data" and "render", where the render endpoint just reused the function for the date endpoint.
SwiftyBug 2y ago
Go + Templ + htmx Templ is great when you need to separate reusable components.
wry_discontent 2y ago
I usually use Clojure, Huff for html templating, and whatever DB libs. Pretty much whatever is in Biff[1] is what I want to use. [1] https://biffweb.com/ https://biffweb.com/

by wruza 2y ago

otherflavors 2y ago

perl + Template Toolkit (using the underdocumented support for the fragment pattern with EXPOSE_BLOCKS), before finding htmx we used Jemplate, which let you compile Template Toolkit templates into Javascript functions

Raticus79 2y ago

I'll be trying things out with FastAPI and Jinja templating

simonbarker87 2y ago

NestJS with Handlebars templates. I don’t love Handlebars but I have past experience with it so was the most pragmatic choice. I’m interested in trying EdgeJS as a templating alternative to HB but haven’t got round to it yet. I’ve added a NestJS error handler that looks to see if the request came from an htmx request and then serve the error response as html, if not then it sends back json since I do have json api end points as well in the back end.

pondidum 2y ago

Go: go templates and fiber for http serving. I have a mini framework for adding some structure to the templates (folder per feature: contains controller, templates, etc, and some naming conventions)

Art9681 2y ago
This is my stack as well and it works great.
jjude 2y ago
I too use go + fiber + htmx. > mini framework for adding some structure to the templates Would be good to read little more about this mini-framework

fprotthetarball 2y ago

My backend for a simple web application I'm working on is entirely in Rust. Highlights: - axum: web application framework - https://github.com/tokio-rs/axum https://github.com/tokio-rs/axum - axum-htmx: axum extractors, responders, guards for htmx - https://github.com/robertwayne/axum-htmx https://github.com/robertwayne/axum-htmx - rusqlite: SQLite bindings - https://github.com/rusqlite/rusqlite https://github.com/rusqlite/rusqlite - maud: HTML templating as a macro - https://maud.lambda.xyz https://maud.lambda.xyz The way maud lets you compose markup works very nicely with htmx. The HX-Request header lets you know if the request is coming from htmx or if it is a regular request. You either call the top-level function if it's a regular request to get the entire page rendered, or call a subset of functions to get the appropriate partial rendered if it's an htmx request. It's also nice to easily have tests for the rendered pages. My unit tests cover verification of the rendered HTML, too.

brunoqc 2y ago
Do you use something like cargo-watch for "hot reload"?
- fprotthetarball 2y ago
  No, I just stop and restart when I feel like I'm in a good spot. Nothing fancy.

swlkr 2y ago

rust and ryde (my own framework on top of axum and rusqlite)

PyWoody 2y ago

Flask+SQLite+TailwindCSS. It's basically cheating. The setup is dead-simple to operate.

jononor 2y ago
What do you use for templating/HTML generation?
- PyWoody 2y ago
  The default Flask Jinja2 templating engine. It can get you very far.
  - jononor 2y ago
    True, it works just fine. But doing non trivial things in a templating language never quite sat well with me. So I am trying out dominate as a way of just doing everything in Python. Jury is still out though.

wruza 2y ago

Well, as I expected, templating is the hardest part of migrating to htmx on nodejs. After reviewing few templaters/etc (handlebars, ejs, lit-html, virtual-dom) and few abstractions (html``, just ``, h()), barely anything seems too easy and too freedom-y. Arcane syntaxes, high character noise (ejs, lit, js), lack of typing (all non-`` based), trivial screw ups (virtual-dom, handlebars), experimental status (lit ssr). Sigh.

unsupp0rted 2y ago
This was my experience as well. No great template generator on the node side. I use PUG. I don’t like to close HTML tags. This cuts 30% of the visual bloat out of my templates.
- michaelcampbell 2y ago
  removingspacesgotridofalotofmybloatonregulartexttoo. One man's structure is another man's "bloat", I guess.
  - unsupp0rted 2y ago
    PUG actually adds spaces: it's indentation based. What it removes is the visual bloat of closing html tags. So instead of: <div id='foo' class='bar baz'> <p>Some content</p> </div> <div id='foo2' class='bar2 baz2'> <p>More content</p> <p>Another paragraph</p> </div> In PUG you do: #foo.bar.baz p Some content #foo2.bar2.baz2 p More content p Another Paragraph Even without syntax highlighting, it's plain at a glance where markup stops and content starts in PUG. And it's easier to visually parse element IDs and chained classes this way too.

emseetech 2y ago

Go with fasttemplate. Most people prefer templ but I don't like logic in templates, I just want to parse values. I keep different states in different template files. Each template file is a portion of a full page which makes it easy to create an endpoint that pulls the partial with the latest values. HTMX can then hit that endpoint to load or refresh values. Endpoints are usually domain/page/partial so if I'm on a configuration page at example.com/config then the endpoint for the privacy settings partial would be example.com/config/privacy Going directly there in a browser would get a 404 because I check for the HX-Request header. Endpoint handlers return a processed template with the current state. I use those functions to both compose the full page on the backend, and to build the output for the partial endpoint. I don't automatically expose all partials. I add endpoints as I need them. This is probably more idiomatically Go than anything to do with htmx.

amanzi 2y ago

Django user here. HTMX fits in perfectly with the Django templating system. A fairly common approach is to use the same view but check for the HTMX header and then return a template file with the specific bit of HTML being swapped. There's also work in the Django space to be able to return parts of a template based on the request, which will suit HTMX perfectly too.

magnusstaberg 2y ago
We use Django with https://htpy.dev/ https://htpy.dev/ as templating system.
jmatthewp 2y ago
[dead]

jsnelgro 2y ago

Htmx + Kotlin with ktor and the html dsl was really fun to play with on a personal project. Static typing, autocomplete and a full-fledged programming language available to use in your html markup is a game changer. I was structuring my endpoints as pairs of "data" and "render", where the render endpoint just reused the function for the date endpoint.

SwiftyBug 2y ago

Go + Templ + htmx Templ is great when you need to separate reusable components.

wry_discontent 2y ago

I usually use Clojure, Huff for html templating, and whatever DB libs. Pretty much whatever is in Biff[1] is what I want to use. [1] https://biffweb.com/ https://biffweb.com/