Hacker News Reader

Comment by laex | Hacker News Reader

Can HTMX be used with static site generators, such as Hugo, to create interactive documentation websites?

I think that unpoly(https://unpoly.com/) would be easier for that use case. htmx generally expects succesive http requests to only return the fragment of html that will be swapped into the target, not the entire page. So you generally want something server side that can check the request and either return the full page (either for a first hit or disabled javascript) or return just a fragment (an htmx request).

Unpoly has similar goals to htmx, but by default works with full page responses, swapping only the identified content in the page.

Unpoly is great. I used it a few years ago for reimplementing the UI of an application built with a traditional MVC framework and I was impressed with the results. Nobody could tell it was not React/vue/etc from the outside and the frontend code was quite simple and minimal.

You're correct that it's the general expectation, but it is possible to select certain elements from the response using `hx-select` [1], so it is possible, just not particularly efficient...

[1] https://htmx.org/attributes/hx-select/

Technically feasible? Absolutely. You can already create interactive documentation just with client side JS in your Hugo generated site. And HTMX is just a client-side JS system for building that sort of JS-required interactivity in HTML alone without directly touching JavaScript. That said, I don't think the tooling to make this simple to get started with in Hugo is there yet. Though you could certainly build it.

Why does documentation need any JavaScript at all beyond opening the hamburger menu?

Why does it even need a hamburger menu?

Because you need to hide nav on mobile, since accessibility requirements from google and other web crawlers will require it to fill the much of the page, or your site won't be indexed.

You don't need JavaScript for a hamburger menu, I am doing it with pure HTML. Hint: the <details> tag.

Hint: that’s bad for accessibility.

Hint: there's nothing inherently inaccessible about the <details> tag, it all depends on how you use it.

No need for javascript for the hamburger menu, it is doable with CSS checkbox, see for example the hamburger menu on https://lanyon.getpoole.com/ .

Or another example, the teddit reddit-frontend has collapseable threads with the summary/details tags, also works without javascript.

The CSS checkbox method is considered bad for accessibility. They’re adding a popover attribute to use for no JS menus instead.

Reply on news.ycombinator.com