hx-pod
Join me while I learn HTMX and talk at you about it
Twitter: @htmxlabs
Latest episodes
May 8, 2024 • 5min
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
May 5, 2024 • 12min
Stop taking shortcuts
A case for taking the extra steps. It's a good thing
May 3, 2024 • 6min
Htmx request headers: HX-Prompt
hx-prompt="what's your favorite size turtle?"Request Headers:Hx-Prompt: small
May 2, 2024 • 5min
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!
May 1, 2024 • 4min
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 target: some_id needs to be an id, not another css selector
Apr 26, 2024 • 6min
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: search_inputHx-Trigger-Name: search
Apr 23, 2024 • 6min
Htmx request headers: Hx-Request
An example in the wild: The Laravel blade documentation:https://laravel.com/docs/11.x/blade#rendering-blade-fragments
Apr 21, 2024 • 7min
What's next on the podcast?
We're (Me're) 43 episodes in. What's next?
Apr 15, 2024 • 49min
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.com/Author of the Wordpress/Inertia Adapter:https://github.com/boxybird/inertia-wordpressAlpine/Livewire in Wordpress:https://github.com/boxybird/morph
Apr 12, 2024 • 20min
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 extensions)1. Browser & HistoryHx-push-url - set your urlHx-replace-url - replace your url, save no snapshotHx-history-elt - change snapshot from default to particular elementHx-history - prevent something from being saved in the htmx snapshot2. Customizing RequestsHx-request - set no headers or timeout on requestHx-headers - set custom headers, dynamic or static jsonHx-sync - allows you to set rules for multiple htmx requests at once3. Submitting DataHx-validate - allows you to use validation rules outside of formsHx-disabled-elt - disables a button once you’ve clicked itHx-encoding - allows you to upload files via Ajax4. Overriding HtmxHx-disable - allows you to disable htmx for user comments, posts, etcHx-disinherit - breaks inheritance chain for one or more attributes5. Fun!Hx-select-oob - lets you place element from your response wherever you want
