Learn HTMX by creating a couple of small projects with a Node.js and Express backend, including a contacts search, temperature converter, mock weather app with polling and form validation component. We will learn about the common HTMX attributes like hx-get, hx-post, hx-swap, etc.
Final Code:
https://github.com/bradtraversy/htmx-crash-course
Alpine Crash Course:
Check out my courses:
https://traversymedia.com
Social Media:
Github – https://github.com/bradtraversy
Twitter – https://twitter.com/traversymedia
Instagram – https://www.instagram.com/traversymedia
Facebook – https://www.facebook.com/traversymedia
Linkedin – https://www.linkedin.com/in/bradtraversy
Timestamps:
0:00 – Intro
3:42 – Node.js/Express Server Setup
9:23 – Simple request with hx-get & hx-trigger
11:12 – hx-swap
11:58 – Route to get a list of users
16:04 – hx-target
17:00 – hx-confirm
17:30 – Get users from jsonplaceholder
18:40 – hx-indicator
21:06 – hx-vals
23:27 – Temperature converter with hx-post
29:44 – Polling
33:23 – Mock weather app with polling
36:44 – Contacts search widget
39:50 – Backend route for search
47:08 – Inline form validation
50:12 – Backend route for validation
56:01 – Wrap up
source
