What do you like about HTMX? I coming from a world of plain JS usage -- no SPAs or the like. I just felt like HTMX was just a more complicated way to write what could be simple .fetch() requests.
I like that it still feels like html. I think that's it's biggest selling point.
You write:
<div id="moo" /> <form hx-put="/foo" hx-swap="outerHTML" hx-target="#moo"> <input hidden name="a" value="bar" /> <button name="b" value="thing">Send</button> </form>
<div id="moo" /> <form> <input hidden name="a" value="bar" /> <button name="b" value="thing" onclick="handleSubmit(event)" >Send</button> </form> <script> async function handleSubmit(event) { event.preventDefault(); // the form submit stuff const form = event.target.form; const formData = new FormData(form); const submitter = event.target; if (submitter && submitter.name) { formData.append(submitter.name, submitter.value); } // hx-put const response = await fetch('/foo', { method: 'PUT', body: formData, }); / hx-swap if (response.ok) { const html = await response.text(); // hx-target const target = document.getElementById('moo'); const temp = document.createElement('div'); temp.innerHTML = html; target.replaceWith(temp.firstElementChild); } } </script>
maybe check out fixi.js:
https://github.com/bigskysoftware/fixi
I like that it still feels like html. I think that's it's biggest selling point.
You write:
Compared to (ChatGPT helped me write this one, so maybe it could be shorter, but not that much shorter, I don't think?): And the former just seems, to me at least, way way *way* easier to read, especially if you're inserting those all over your code.