Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/rajasegar/awesome-htmx

Awesome things about htmx
https://github.com/rajasegar/awesome-htmx

List: awesome-htmx

awesome awesome-list hacktoberfest htmx

Last synced: about 2 months ago
JSON representation

Awesome things about htmx

Lists

README 

        
# Awesome Htmx [![Awesome](https://awesome.re/badge.svg)](https://github.com/sindresorhus/awesome)



An awesome list of resources about **htmx** such as articles, posts, videos, talks and more.



Hoping to keep this list updated as much as possible, any new links through PRs are appreciated.



## Contents



- [Official](#official)

- [BlogPosts](#blogposts)

- [Tools](#tools)

- [Videos](#videos)

- [Examples](#examples-by-back-end)

- [Podcasts](#podcasts)



## Official



- [Website](https://htmx.org)

- [GitHub](https://github.com/bigskysoftware/htmx)

- [Twitter](https://twitter.com/htmx_org?lang=en)

- [Discord Server](https://htmx.org/discord)

- [Examples](https://htmx.org/examples/)

- [htmx on Stack Overflow](https://stackoverflow.com/questions/tagged/htmx)



## BlogPosts



- [How to create ChatGPT with Django and HTMX in 4 minutes 🦾](https://www.photondesigner.com/articles/chatgpt-htmx-django)

- [Add instant database search with Django and HTMX 🕵️](https://www.photondesigner.com/articles/database-search-django-htmx)

- [How to add serverless functions to Django in 6 minutes (with HTMX and AWS Lambda) 🧠](https://www.photondesigner.com/articles/serverless-functions-django)

- [Add infinite scroll with Django and HTMX in 60 seconds ∞](https://www.photondesigner.com/articles/infinite-scroll-htmx-django)

- [HackerNews Post](https://news.ycombinator.com/item?id=23330881) - Htmx – high power tools for HTML.

- [Full Stack Application – HTMX + ExpressJS + Turso: A Step-by-Step Guide](https://www.fun4code.com/htmx-expressjs-a-step-by-step-guide/)

- [How to create a Django form (using HTMX) in 90 seconds 🐎](https://www.photondesigner.com/articles/submit-async-django-form-with-htmx)

- [3 steps to upload files properly with Django (and HTMX) 📁](https://www.photondesigner.com/articles/upload-files-properly-django-htmx)

- [Learning AJAX made easy - Build an app with htmx](https://dev.to/libsyz/learning-ajax-made-easy-build-an-app-with-htmx-gie)

- [How To Use Htmx in Django](https://www.mattlayman.com/blog/2021/how-to-htmx-django/)

- [HTMX With ASP.NET Core](https://khalidabuhakmeh.com/htmx-with-aspnet-core)

- [HTMX Requests with ASP.NET Core Anti-Forgery Tokens](https://khalidabuhakmeh.com/htmx-requests-with-aspnet-core-anti-forgery-tokens)

- [HTMX and ASP.NET Core Swapping Techniques](https://khalidabuhakmeh.com/htmx-and-aspnet-core-swapping-techniques)

- [Notes on HTMX](https://blog.ajbothe.com/notes-on-htmx)

- [Creating a Temperature Converter without a single line of JS](https://dev.to/rajasegar/creating-a-temperature-converter-without-a-single-line-of-js-4cp1)

- [Creating a Counter component without a single line of JS](https://dev.to/rajasegar/creating-a-counter-component-without-a-single-line-of-js-42d5)

- [Creating a Flight Booker component without a single line of JS](https://dev.to/rajasegar/creating-a-flight-booker-component-without-a-single-line-of-js-354e)

- [Creating a GitHub profile search component in htmx](https://dev.to/rajasegar/creating-a-github-profile-search-component-in-htmx-1pl5)

- [Lazy Load Form Fields In Rails With HTMX](https://dev.to/dalezak/lazy-load-form-fields-in-rails-with-htmx-pm0)

- [Handle JSON API Results in Htmx](https://dev.to/marcusatlocalhost/handle-json-api-results-in-htmx-f46)

- [Rapid Prototyping with Django, htmx, and Tailwind CSS](https://testdriven.io/blog/django-htmx-tailwind/)

- [Rapid Prototyping with Flask, htmx, and Tailwind CSS](https://testdriven.io/blog/flask-htmx-tailwind/)

- [Ajax-Enabled Checkbox and Select with Django and HTMX](https://jacklinke.com/ajax-enabled-checkbox-and-select-with-django-and-htmx)

- [Django Formsets Tutorial - Build dynamic forms with Htmx](https://justdjango.com/blog/dynamic-forms-in-django-htmx)

- [Django, HTMX and Alpine.JS: A Match Made In Heaven](https://dev.to/nicholas_moen/what-i-learned-while-using-django-with-htmx-and-alpine-js-24jg)

- [TodoMVC with Thymeleaf and HTMX](https://www.wimdeblauwe.com/blog/2021/10/04/todomvc-with-thymeleaf-and-htmx/)

- [Using Server-Sent Events with Thymeleaf and HTMX](https://www.wimdeblauwe.com/blog/2021/11/23/using-server-sent-events-with-thymeleaf-and-htmx/)

- [Thymeleaf and htmx with out of band swaps](https://www.wimdeblauwe.com/blog/2022/06/15/thymeleaf-and-htmx-with-out-of-band-swaps/)

- [Htmx authentication error handling](https://www.wimdeblauwe.com/blog/2022/10/04/htmx-authentication-error-handling/)

- [json2html](https://github.com/moappi/json2html)

- [Full stack web development in a single Java file: An intro to Javalin and htmx](https://anthonybruno.dev/2023/06/11/full-stack-development-in-a-single-java-file)

- [Hono + htmx + Cloudflare is a new stack](https://blog.yusu.ke/hono-htmx-cloudflare/)

- [Getting Started With HTMX In Laravel](https://muhammadshafeeq.com/posts/getting-started-with-htmx-in-laravel---an-overview/)

- [Table Sorting and Pagination with HTMX in Laravel](https://muhammadshafeeq.com/posts/table-sorting-and-pagination-with-htmx-in-laravel/)

- [Building a Counter App with `htmx`, `Go Fiber`, and `elem-go`](https://dev.to/chasefleming/building-a-counter-app-with-htmx-go-fiber-and-elem-go-9jd)

- [Dancing with HTMX](https://advent.perldancer.org/2023/20)



## Tools



- [Sprig](https://putyourlightson.com/plugins/sprig) - Craft CMS plugin.

- [simpleui](https://whamtet.github.io/simpleui/) - Clojure backend helpers for htmx.

- [django-htmx](https://github.com/adamchainz/django-htmx) - Django integration.

- [django-js-lib-htmx](https://github.com/nonZero/django-js-lib-htmx) - Django package containing the htmx scripts.

- [htmx-go](https://github.com/angelofallars/htmx-go) - Go integration compatible with `net/http`, prioritizing type safety.

- [htmx-rails](https://github.com/rootstrap/htmx-rails) - Rails integration.

- [htmx.net](https://github.com/khalidabuhakmeh/htmx.net) - ASP.NET Core integration (Htmx Extension Methods, TagHelpers, Htmx.Config)

- [Giraffe.Htmx](https://github.com/bit-badger/Giraffe.Htmx) - Extensions for Giraffe to support development with htmx.

- [htmx-spring-boot](https://github.com/wimdeblauwe/htmx-spring-boot) - Spring Boot support library for htmx

- [IntelliJ htmx plugin](https://plugins.jetbrains.com/plugin/20588-htmx-support)

- [codeigniter-htmx](https://github.com/michalsn/codeigniter-htmx) - CodeIgniter 4 framework integration.

- [htmx-ext-shoelace](https://github.com/benopotamus/htmx-ext-shoelace) - An extension to make Shoelace elements work seamlessly with HTMX.

- [laravel-htmx](https://github.com/mauricius/laravel-htmx) - Laravel integration for htmx.

- [Hwy](https://hwy.dev) - Remix-inspired TypeScript metaframework using HTMX instead of React.

- [DelphiMVCFramework](https://github.com/danieleteti/delphimvcframework) - DelphiMVCFramework integration support for htmx (class helper in MVCFramework.HTMX)

- [elem-go](https://github.com/chasefleming/elem-go) - A Go library for building HTML with htmx.

- [Mojolicious::Plugin::HTMX](Mojolicious::Plugin::HTMX) - An HTMX plugin for Mojolicious (a Perl web Framework)



## Videos



- [htmx in 100 seconds](https://www.youtube.com/watch?v=r-GSGH2RxJs)

- [Why learn htmx?](https://www.youtube.com/watch?v=AOzy44b2gko)

- [Rapid server side full stack web development with ViewComponents and htmx by Thomas Schuely](https://youtu.be/DPAtQU-erM4)

- [Modern frontends with Thymeleaf and htmx by Wim Deblauwe](https://www.youtube.com/watch?v=POK4Zp1oRN8)

- [DjangoCon Europe - David Guillot from Contexte - From React to htmx on a real-world SaaS product: we did it, and it's awesome!](https://www.youtube.com/watch?v=3GObi93tjZI)

- [Carson Gross — Return To Hypermedia: Solving Javascript Fatigue Using Fundamental Web Architecture](https://www.youtube.com/watch?v=LRrrxQXWdhI)

- [Dynamic Web Pages Without JavaScript? - Intro to HTMX](https://www.youtube.com/watch?v=CWSmP3LSILo)

- [htmx: Writing JavaScript to Avoid Writing JavaScript, by Carson Gross](https://www.youtube.com/watch?v=u2rjnLJ1M98)

- [Spring Boot + HTMX = Easy Full Stack](https://www.youtube.com/watch?v=38WAVRfxPxI)

- [Simple, Fast Frontends With htmx](https://www.youtube.com/watch?v=cBfz4W_KvEI)

- [Dynamic Django forms without writing any JavaScript](https://www.youtube.com/watch?v=414ONE1UbCA)

- [HAT Stack: HTMX, AlpineJS Tailwind (SeaJUG Front End Java 2021)](https://www.youtube.com/watch?v=aGgWvwb5xUE)

- [HTMX - Clean Dynamic HTML Pages Talk Python Live Stream](https://www.youtube.com/watch?v=4wjqsPtj2QY)

- [Python Bytes 219: HTMX: Dynamic and live HTML without JavaScript - Live Stream](https://www.youtube.com/watch?v=LAdksPSd6ZA)

- [Active Search UI Pattern with HTMX and FLASK](https://www.youtube.com/watch?v=lfKC5F7qzUQ&ab_channel=LuisCortes)

- [HTMX for ZERO JavaScript Drop Down Depending on other Drop Down](https://www.youtube.com/watch?v=zYs42XcpHYI)

- [Django and HTMX](https://www.youtube.com/playlist?list=PL-2EBeDYMIbRByZ8GXhcnQSuv2dog4JxY) 25 Videos

- [Try Django 3.2 - Python Web Development Tutorial Series](https://www.youtube.com/playlist?list=PLEsfXFp6DpzRMby_cSoWTFw8zaMdTEXgL) HTMX content starts in video 65

- [HTMX/hyperscript demo](https://www.youtube.com/watch?v=MQ0_yh_OhQY)

- [HTMX/hyperscript demo with Transitions](https://www.youtube.com/watch?v=cubi-UChwh8)

- [janet/joy/htmx/tailwind | Making a url shortener](https://www.youtube.com/watch?v=KM1ic4k6Has)

- [janet/joy/htmx/tailwind | Making a twitter competitor](https://www.youtube.com/watch?v=6eFw3yXasB4)



## Examples by Back-end



### ASP.net



- [htmx-with-aspnet-core](https://github.com/jerriepelser-blog/htmx-with-aspnet-core) - Htmx with asp.net core.

- [aspnet-core-htmx-example](https://github.com/mryderie/aspnet-core-htmx-example) - Demonstrates the use of htmx with ASP.NET Core Razor Pages to create a simple CRUD web application.



### Clojure

- [babashka-htmx-todoapp](https://github.com/prestancedesign/babashka-htmx-todoapp) - Quick example of a todo list application using Babashka and htmx.

- [panas.example](https://github.com/keychera/panas.example) - Implementation of all [htmx examples](https://htmx.org/examples/) using Babashka.

- [contact.app-clj](https://github.com/rmrt1n/contact.app-clj) - Clojure implementation of the contact.app from the Hypermedia Systems book



### Common Lisp



- [ccl-demo-raja](https://github.com/rajasegar/ccl-demo-raja) - A Common Lisp demo with htmx using Star wars API.

- [cl-trello-clone](https://github.com/rajasegar/cl-trello-clone) - A small Trello clone built in Common Lisp

- [cl-github-timeline](https://github.com/rajasegar/cl-github-timeline) Github timeline in Common Lisp, and [another example based on this one](https://github.com/vlcinsky/python-fastapi-github-timeline) using FastAPI.



### JavaScript



- [Example todo app with the html.js framework](https://github.com/dctanner/htmljs-todo-example) - html.js is an elegent framework for hyper speed web apps.



### Typescript

- [TodoMVC App](https://github.com/syarul/htmx-todomvc) - TodoMVC App built with `Typescript`, `JSX`, `express`, `htmx` and `_hyperscript` deployed on vercel/netlify.



### Express



- [Geo Selector in htmx](https://github.com/rajasegar/htmx-geo-selector) - A Region, Sub-Region and Country selector based on user selections.

- [todomvc-htmx](https://github.com/rajasegar/todomvc-htmx) - TodoMVC app implemented using htmx and hyperscript.

- [hx-swap-demo](https://github.com/rajasegar/hx-swap-demo) - A demo app to showcase different attribute values of hx-swap in htmx.

- [htmx-twitter-clone](https://github.com/rajasegar/htmx-twitter-clone) - A Twitter clone built using htmx.

- [super-rentals-htmx](https://github.com/rajasegar/super-rentals-htmx) - A Rentals Listing demo app built with htmx.

- [htmx-github-search](https://github.com/rajasegar/htmx-github-search) - A GitHub Profile search component built using htmx.

- [todo-htmx](https://github.com/rajasegar/todo-htmx) - A simple Todo list with Express and htmx.

- [htmx-calendar](https://github.com/rajasegar/htmx-calendar) - Calendar component in htmx.

- [htmx-tabular](https://github.com/rajasegar/htmx-tabular) - Tabular data with htmx.

- [htmbox](https://github.com/rajasegar/htmx-dropbox) - A Dropbox clone in htmx.

- [htmx-notes](https://github.com/rajasegar/htmx-notes) - A Note-taking app using Markdown inspired by React Server Components demo.



### Rust

- [TodoMVC App](https://github.com/syarul/todomvc-rust-astra-maud-htmx-_hyperscript) - TodoMVC App built with `Rust`, `Astra`, `maud`, `HTMX` and `_hyperscript`. Astra runs a small event I/O loop and maud is blazing fast, super type-safe, and easy to deploy. 



### Go



- [pagoda](https://github.com/mikestefanello/pagoda) - Rapid, easy full-stack web development starter kit in Go with HTMX support and examples.

- [Pushup](https://github.com/adhocteam/pushup) - A server-side, page-oriented web framework for the Go programming language.

- [Simple Counter App](https://github.com/chasefleming/elem-go/tree/main/examples/htmx-fiber-counter) - A simple counter app built with `htmx`, `elem-go`, and `Go Fiber`.

- [Todo App](https://github.com/chasefleming/elem-go/tree/main/examples/htmx-fiber-todo) - A todo app built with `htmx`, `elem-go`, and `Go Fiber`.

- [Realtime Todo App](https://github.com/gobijan/go-htmx-todo) - This is a Go Todo App using WebSockets, HTMX, and DOM-Morphing.

- [TodoMVC App](https://github.com/syarul/todomvc-go-templ-htmx-_hyperscript) - TodoMVC App built with `Go`, `>templ`, `htmx` and `_hyperscript`.

- [GO HTMX](https://github.com/donseba/go-htmx) - Seamless HTMX Integration for Go Applications.



### Java



- [TodoWebflux Spring Boot HTMX demo](https://github.com/dsyer/todowebflux)

- [Spring Boot HTMX integration](https://github.com/odrotbohm/spring-playground/tree/main/htmx-spring-boot)

- [Spring-Boot HTMX](https://github.com/wiverson/htmx-demo)

- [Frisson: Easy, Powerful Full Stack with Spring Boot and HTMX](https://github.com/ChangeNode/frisson)

- [java-htmx-todo](https://github.com/AussieGuy0/java-htmx-todo) - Todo app using Javalin, htmx and j2html.



### Kotlin



- [todo-hda-kt](https://github.com/corlaez/todo-hda-kt) - TodoApp as a Hypermedia Driven App with parallel browser tests

- [htmx-ktor](https://github.com/Rattlyy/htmx-ktor) - Fullstack CRUD app example made with Ktor (Backend), kotlin.html (Templates), SimpleCSS (Styling), PostgreSQL (DB), Docker (Deployment)



### Python-based (Django, FastAPI, Flask)



- [awesome-python-htmx](https://github.com/PyHAT-stack/awesome-python-htmx) - Awesome list for htmx specific to the Python ecosystem.

- [Flask HTMLX Material Kit](https://github.com/app-generator/sample-flask-htmlx-mkit) - Simple starter powered by `Flask`, `HTMLX` and `Bootstrap 5`

- [Django HTMLX Material Kit](https://github.com/app-generator/sample-django-htmlx-mkit) - Simple starter powered by `Django`, `HTMLX` and `Bootstrap 5`

- [flask-htmx-boilerplate](https://github.com/marcusschiesser/flask-htmx-boilerplate) - Boilerplate template for a Python Flask application with HTMX and Tailwind CSS

- [django-htmx example app](https://github.com/adamchainz/django-htmx/tree/main/example) - Example Django app showing a few patterns.

- [django-htmx-fun](https://github.com/guettli/django-htmx-fun) - A small Django application to advertise the fun htmx can bring you.

- [django-htmx-todo](https://github.com/jaredlockhart/django-htmx-todo)

- [django-htmx-todo-list](https://github.com/OmenApps/django-htmx-todo-list) - Expands on django-htmx-todo to add task creation, editing, and deletion using FBVs.

- [owela-club](https://github.com/adamchainz/owela-club) - Play the Namibian game of Owela against a terrible AI. Built using Django and htmx.

- [django-htmx-alpine](https://github.com/arcanemachine/django-htmx-alpine/) - Basic todo list with Django, HTMX, and Alpine. Features a [live demonstration](https://django-htmx-alpine.nicholasmoen.com/).

- [dj_pug_htmx_example](https://github.com/katsko/dj_pug_htmx_example) - HTMX, Pug, and Django experiments

- [Lexicon App](https://github.com/jgirardet/djlexique) - Lexicon app using django3.2, htmx, hyperscript.

- [htmxflask](https://github.com/cscortes/htmxflask) - All the HTMX samples redone using a flask server.

- [htmx and SSE with FastAPI](https://github.com/vlcinsky/fastapi-sse-htmx) - FastAPI based web app sending Server Sent Events to frontend app created with htmx.

- [fast-htmx](https://github.com/marty331/fasthtmx) - Fast-HTMX is a demo project of FastAPI an HTMX. The purpose of this project is to illustrate how to create a website with no JavaScript, using only HTML, CSS, and Python.

- [Flask-Sock HTMX](https://github.com/paluigi/flask-htmx) - Very short example combining HTMX with [Flask-Sock](https://flask-sock.readthedocs.io/en/latest/) for self-updating webpages with minimal dependencies.

- [django-tailwind-alpine-htmx](https://github.com/AccordBox/django-tailwind-alpine-htmx) A simple Task app built with Django, Tailwind CSS, Alpine.js and HTMX

- [flask-htmx-tailwind](https://github.com/testdrivenio/flask-htmx-tailwind) - Rapid Prototyping with Flask, htmx, and Tailwind CSS



### Ruby



- [sinatara-htmx](https://github.com/johnthethird/sinatra-htmx) - Example of a Sinatra app using HTMX for implementing an interactive search

- [pokebutt-htmx](https://github.com/beechnut/pokebutt-htmx) - Pokebutt clone using htmx.

- [htmx-todo-app](https://github.com/libsyz/htmx-to-do-app) - A little to-do app and a short demo of htmx built with Sinatra.



### PHP



- [codeigniter-htmx-demo](https://github.com/michalsn/codeigniter-htmx-demo) - A CodeIgniter 4 examples include inline and modal edits, events, searching, pagination, and sorting.

- [laravel-htmx-todolist](https://github.com/gabrielrbarbosa/laravel-htmx-todolist) - Laravel Todo List app demo for laravel-htmx

- [laravel-htmx-crud](https://github.com/hmshafeeq/larvel-htmx-crud) Laravel contacts CRUD app, made reactive with HTMX.



### Delphi



- [dmvcframework-todo-app](https://github.com/danieleteti/delphi-dmvcframework-htmx-todo) - DelphiMVCFramework to-do app with HTMX and mustache templates



### Zig



- [zig-htmx](https://github.com/hendriknielaender/zig-htmx) - Example chat app written in zig + htmx (websockets).



### Other



- [declswiplweb](https://github.com/Anniepoo/declswiplweb) - End to end declarative web programming with no JS using htmx and SWI-Prolog.

- [htmx-modal-example](https://github.com/benpate/htmx-modal-example) - An experiment to work design modal dialogs in HTMX.

- [quarkus-htmx-todos](https://github.com/derkoe/quarkus-htmx-todos) - Todo App in Quarkus with htmx.



## Podcasts



- [Python Bytes: HTMX - Dynamic and live HTML without JavaScript](https://pythonbytes.fm/episodes/show/219/htmx-dynamic-and-live-html-without-javascript) - Podcast about HTMX in the Python news.

- [Talk Python: HTMX - Clean, Dynamic HTML Pages](https://talkpython.fm/episodes/show/321/htmx-clean-dynamic-html-pages)

- [Dynamic HTML with htmx](https://devmode.fm/episodes/dynamic-html-with-htmx) - Devmode.fm episode about htmx.

- [htmX](https://www.listennotes.com/podcasts/programmers-quickie/htmx-AwxIkj8mcQf/) - Podcast about htmx in Programmers quickie.

- [Less JavaScript more HTMX](https://changelog.com/jsparty/171) - JSParty Episode about htmx with Carson.

- [JavaScript right in HTML?](https://podcast.htmlallthethings.com/e/javascript-right-in-html-htmx-w-carson/) - HTMLallthethings episode with Carson.

- [Django Chat: htmx - Carson Gross](https://djangochat.com/episodes/htmx-carson-gross)

- [HTML All The Things - HTMX, Hyperscript, and More!](https://www.htmlallthethings.com/blog-posts/htmx-hyperscript-and-more)

- [.NET Rocks! - htmx with Carson Gross](https://www.dotnetrocks.com/?show=1749) - An overview of htmx, and a discussion from a .NET perspective