All Episodes
Displaying 61 - 90 of 120 in total
Htmx response headers: HX-Reselect
{ "HX-Reselect": "#one-div-inside-html" }
Is optimistic UI the "final boss" of htmx? (and livewire, unpoly, liveview, hotwire, etc)
This episode explores what an optimistic ui might look like in htmx. Also: is it what we want to do? Is it even possible? Or is it incompatible with the idea of having...
Htmx response headers: HX-Retarget
{ "HX-Retarget": "#my-special-target" }
Htmx response headers: HX-Reswap
Override your "hx-swap=" attribute. Correct your hx-swap mistake! Do it now!!!
Htmx response headers: HX-Refresh
{ "HX-Refresh": "true" }
Htmx response headers: HX-Push-Url and HX-Replace-Url
Decide from your server side what url the user sees!https://htmx.org/headers/hx-push-url
A conversation with Tom from Reddit: Building production apps using htmx
Speaking with a prolific developer who recently switched from React to htmx
Htmx response headers: HX-Location and HX-Redirect
Redirect your users to a new page from your back-end server in SPA-mode (no refresh for them)https://htmx.org/headers/hx-location/
Htmx request headers: HX-History-Restore-Request
This header is to make sure your system loads the full page when 1) You are suing hx-push-url to work with the url bar2) Users click the back button.3) The full page c...
Htmx request headers: Hx-Current-URL
The htmx request header that tells youEXACTLY where the user is making the request fromThe full url string with all ids and params
Stop taking shortcuts
A case for taking the extra steps. It's a good thing
Htmx request headers: HX-Prompt
hx-prompt="what's your favorite size turtle?"Request Headers:Hx-Prompt: small
Htmx request headers: Hx-Boosted
How can your server tell if its a regular link click or an hx-boost SPA-mode link click??I'll tell you everything about it in these 5 minutes!
Htmx request headers: Hx-Target
Let's your server know what the id is of the hx-target!You need 2 things to send this request header:1. Use the attribute: hx-target="some_id"2. Use a DOM id as the ta...
Htmx request headers: Hx-Trigger and Hx-Trigger-Name
You can use these headers to conditionally branch your response based on *which element* the request was triggered fromexample of format:Request Headers:Hx-Trigger: se...
Htmx request headers: Hx-Request
An example in the wild: The Laravel blade documentation:https://laravel.com/docs/11.x/blade#rendering-blade-fragments
What's next on the podcast?
We're (Me're) 43 episodes in. What's next?
Wordpress and htmx: A conversation with developer Andrew Rhyand
We talk integrating htmx with Wordpress!Andrew Rhyand https://andrewrhyand.com/Mentioned links:HTMX movies demo: (very slick & educational)https://htmx.andrewrhyand.co...
Advanced htmx: Season 2 recap, grouping the 13 advanced attributes
Advanced htmx: Recap & grouping each of the 13 advanced attributes we went over this "season" This means we have now gone through every attribute! (not counting extens...
Advanced htmx: hx-disinherit
Reddit thread with an example:https://www.reddit.com/r/htmx/comments/1bukz76/hxselect_reset/
Advanced htmx: hx-history-elt
What if you wanted a part of your site to persist even using the back and forward on your browser?Here is the reddit thread I mention in the episode, with an example:h...
Advanced htmx: hx-disabled-elt
This one might actually be essential, not just an advanced attribute. Keeps you and your users from accidentally submitting things multiple times.
Advanced htmx: hx-encoding
An amazingly simple file uploading form *with a progress bar* using htmx: Upload
Advanced htmx: hx-select-oob
What if you could "select" snippets out of your response and send them to anywhere on the page ("out-of-band") of the target?that's hx-select-oob Server traffic cop: h...
The css zen garden was a beautiful lie
Let's talk big ideas like Locality of Behavior vs. Separation of Concerns by relentlessly attacking one of the best websites ever created
Advanced htmx: hx-request
Set the outer layer of settings of your request with THESE THREE OPTIONS
Advanced htmx: hx-disable
Question: Do you want your users in the comment section to write htmx that runs on your site?If the answer is yes, please ignore this episode.
Advanced htmx: hx-history
What if you don't want your page kept into the browser history local storage?
What is htmx good for?
This is a somewhat open thought process looking at the question I see online: what is htmx good for?Mentioned in the episode: the htmx movies example from Andrew Rhyan...
Advanced htmx: hx-validate
Your browser has built in types and validation on inputs in a form. But what happens when you use inputs without a form??Note: I accidentally posted an incomplete epis...