Live data from Hacker News

Htmx in a Nutshell

htmx.org

121–130 of 414 posts

Re: Htmx in a Nutshell

#121
post #75

I'm confused about what value this adds. The introductory example is certainly not helpful, as it takes an ` Blog ` and turns into 7 lines of markup to accomplish the same thing. (And then it says a bunch of things that are arguably not desirable, like "any element can now trigger requests".) Like: what's the point of using this over HTML5+js? I've spent 15 minutes reading the website and I still don't understand why…

The great thing about HTMX is it fits really nicely with templated server-rendered frameworks like Django.

You can have a page with a list of items. The page is one template, and it includes a sub-template which is just the items. Then you have a separate view for "get list fragment" which just returns the updated/sorted/filtered , rendered with that same sub-template. If you toggle the ordering, or filter the list, HTMX will automatically call the fragment renderer and replace just the items, without reloading the page.

See this example: https://github.com/adamchainz/django-htmx/blob/8054f049f53f0...

This approach solves the common interactivity use-cases requiring JS in a server-rendered app, without having to write any JS, and without having to build a REST API. Instead you just render HTML, which your framework is excellent at.

Re: Htmx in a Nutshell

#122
post #107

Earlier quoted context omitted.

https://htmx.org/examples

I've looked at a few of those and I still don't understand. Also, hilariously, several of them are already broken. (Like the table one that's not updating.) EDIT: Sorry, nevermind. The Bulk Edit example does work, I think it either does not like Safari, or something failed to load before, but it works in Chrome.

which table one? all of them seem to work for me.

Re: Htmx in a Nutshell

#123
post #98

I don't love the idea of implementing common app state logic via attributes. It probably works a lot better than I'm assuming, but it feels hacky to me. Like it can't solve every problem you'd actually encounter when making a complex app, so eventually you'll need to fall back to using javascript, and possibly a framework or three...on top of htmx. But it does seem like this would be fun to play around with using PHP…

I'm using htmx for my SaaS web app. It has a lot of spreadsheets. User can filter, sort, highlight with color, etc. It's for PPC managers, they work a lot with spreadsheets. So I'm making a specialized version of that. First two weeks was tough, but after I adapted and found htmx idiomatic recipes to common tasks, it is crazy productive. I can show, if you are curious hit me at twitter @alexblearns.

PS. I just believe people have to try it, because it's so much easier to do web apps this way.

Re: Htmx in a Nutshell

#124
post #52

"The best thing we can do today to JavaScript is to retire it." - Douglas Crockford, creator of JSON

We already did in favor of TypeScript.

Typescript is a bandaid.

We need improved DOM access for web assembly, followed by a new icon in the URL bar that indicates you're on a "legacy" site if it's using javascript (my vote is for a cute snail emoji)

Re: Htmx in a Nutshell

#125
post #3

I am burnt out (but recovering!) with web dev and htmx is what I am using for my project. Django, DRF, Postgres, tailwind and HTMX. I am so tired of all the front end frameworks and all the complexity that gets added. At some point I think you need it and you get returns from it but hearing more people in the industry recognize and talk about how JS everything isn't always the answer gives me hope. I like what HTMX h…

But HTMX is a JS library. Anything done with it is basically done with JS.

I'd say it's not about what can be done, it's about how it's defined. HTMX is a abstraction layer on top of an existing abstractions that you still have to know, because it's defined in terms of those abstractions.

So when you write something like `hx-trigger="click" hx-put="/api/my"` you're actually actively thinking of an `addEventListener("click", ...)`, `this.innerHTML` assignment and `fetch("/api/my", { method: "PUT" }))`. Can't use HTMX without knowing the underlying principles and primitives.

And then you still have to do JS because how else you're supposed to handle `htmx:responseError` and stuff. And maybe I'm wrong but it feels risky because the logic could end up all around the place and not in a single nice function/code block.

So, basically, it's a nice DSL providing a bunch of shortcuts, but it doesn't magically alleviate knowing any underlying principles and nuances of JS and DOM. Again, it's even defined in terms of those systems (`hx-swap="outerHTML"` being a very clear indicator example).

Re: Htmx in a Nutshell

#126
We're migrating our apps from Vue.js to HTMX, and it has been a great experience. The size of our codebase has consistently gone down as we move things to HTMX, and it feels like the level of complexity goes down as well.

I highly recommend using HTMX.

Re: Htmx in a Nutshell

#127
"When a user clicks on this link, issue an HTTP GET request to '/blog' and load the response content into the browser window"

Why do you want that?

Sounds a bit like the hacky stuff PHP did in the first half of the 00s.

Re: Htmx in a Nutshell

#128
I work on a collection of React applications at work and it is OK but at night I am building a workflow engine that trains a text classification model and automates its activities based on that model.

It is almost the kind of web application that I built in 2001 but I find it a lot easier to write today than I did back then thanks to my own maturity and numerous refinements to the web platform. The backend is written in Python and uses aiohttp without any "framework" other than some very basic stuff I write myself.

I worked for a company that had built something similar (that one was named "Themis", this one is named "Nemesis") that had parts written in Python, Scala and Typescript and we faced the problem of having to update three codebases whenever we made some change, having to deal with three kinds of "dependency hell", etc. It is all the more acute for an R&D project where adding a new task or model should be a day's work.

With very little Javascript I am getting performance close to a desktop application when my server is on localhost, it helps that I am paging out small screenfuls of data. I have to admit that a library like Htmx could be a big help for this kind of application but I've yet to really wrap my head around fitting it into my application.

Re: Htmx in a Nutshell

#129
post #3

I am burnt out (but recovering!) with web dev and htmx is what I am using for my project. Django, DRF, Postgres, tailwind and HTMX. I am so tired of all the front end frameworks and all the complexity that gets added. At some point I think you need it and you get returns from it but hearing more people in the industry recognize and talk about how JS everything isn't always the answer gives me hope. I like what HTMX h…

If you are burned out because of tooling, but trying to recover, I do recommend throwing out tailwind and just use pure CSS for your styling. Modern CSS is plenty fun, there is no need for an external framework to do a complex layout. CSS grid is the simplest way to do layout even if you include CSS frameworks. Custom properties (CSS variables) are more powerful then reusable styles from frameworks.

The final peace of the puzzle is getting component scoped styles, which you can do by packaging your components into a web component and using the shadow DOM. CSS custom properties actually penetrate the shadow boundaries so it is a nice catch-all. If web components scare you (which is reasonable, they are scary) then there are other systems (as simple as class naming conventions) which you can use to reach component scoped styles without tailwind.

Re: Htmx in a Nutshell

#130
post #107

Earlier quoted context omitted.

https://htmx.org/examples

I've looked at a few of those and I still don't understand. Also, hilariously, several of them are already broken. (Like the table one that's not updating.) EDIT: Sorry, nevermind. The Bulk Edit example does work, I think it either does not like Safari, or something failed to load before, but it works in Chrome.

no problem

if you can, try to give the idea some time: it's a bit different than other approaches, but it's at least an interesting alternative to other front end libraries, even if it isn't right for everything

Post reply on HN