All Episodes
Displaying 31 - 60 of 85 in total
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...
Advanced htmx: hx-headers
Every request has secret hidden headers. But what if you wanted to make your own?https://htmx.org/attributes/hx-headers/
Celebrate your little victories
When you make your life easier, that's a win.
Advanced htmx: hx-sync
Having any weird async ajax request issues? htmx got yer back 🤜 🤛
Advanced htmx: hx-push-url and hx-replace-url
Push your ajax route to the url bar! Now you've got access to the back button again... but what happens when you refresh?Work with the browser history on any htmx requ...