Be prepared to hit the Wall

<form hx-post="/update/foo"> …</form>

Step1: You choose the tool

  • Use social networks to get new ideas.
  • Be patient, and create a list or a spreadsheet to get an overview.

Step2: You use the new tool

Step3: You hit the wall

Step4: You reproduce it

<tr>
<td>2</td><td>two</td>
</tr>
<div id="sum" hx-swap-oob="true">MAGIC</div>
  • Reproducible examples are very helpful and you can create them for free with Stackoverflow and mocky.io

Step5: You dig into it

Uncaught TypeError:eltOrSelector.querySelectorAll is not a function
at findAll (htmx.js:295)
at handleOutOfBandSwaps (htmx.js:501)
at selectAndSwap (htmx.js:712)
at doSwap (htmx.js:2284)
at handleAjaxResponse (htmx.js:2358)
at XMLHttpRequest.xhr.onload (htmx.js:2163)

Step6: You solve it

<tr>
<td>2</td><td>two</td>
</tr>
<tr id=”sum” hx-swap-oob=”true”>
<td>MAGIC</td>
</tr>
  • devtools are great. Even if you dislike JavaScript, it is easy to use. You can set breakpoints for the debugger and evaluate snippets on the console. It is like an IDE integrated into your browser.
  • Taking breaks helps.
  • “HTML fragments over the wire” is cool, but you need to ensure that your HTML fragments are parsable by your library.

Step7: You proceed

  • Pioneering is fun, but you should learn to help yourself if you get strange errors.
  • Starting from scratch feels like flying, even if you hit the wall from time to time.
  • htmx is cool, and I will use it in new projects.
  • Like the skateboard in the above image: If you hit the wall, have fun and ride it.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
djangsters

djangsters

djangsters are human-friendly IT professionals, who develop web applications, tailored to the individual needs of their customers. https://www.djangsters.de