HTMX + Flask
BeginnerWeb AppFlask routes with HTMX: server-driven interactivity without a JavaScript build pipeline.
Published 27 September 2026
About HTMX + Flask
HTMX + Flask brings dynamic, partial page updates to a Flask application backed by PostgreSQL. Like HTMX + Django, this stack lets Flask route handlers return HTML fragments that HTMX swaps into the page, giving users an interactive experience without writing JavaScript or configuring a frontend build tool. Tailwind CSS is available as an optional styling addition. The key difference from the Supabase variant is that this stack uses self-managed PostgreSQL via SQLAlchemy, giving more control over the database schema and query patterns.
Flask's simplicity makes it the lowest-friction entry point for adding HTMX to a Python web project. You add a single <script> tag for HTMX, annotate your HTML elements with hx-* attributes, and return HTML fragments from Flask views. The template layer stays in Jinja2; the routing layer stays in Flask. There is no component tree, no state management library, no hydration step: just HTTP requests and HTML responses.
Most container platforms deploy it with a managed PostgreSQL add-on, making the stack deployable from a single git push. This is a strong choice for Python developers building internal tools, prototypes, or content-driven apps who want progressive interactivity without abandoning the simplicity of server-rendered HTML.
Key Features
- ✓HTMX partial updates replace full page reloads for searches, filters, and form submissions
- ✓Flask micro-framework gives full control over structure without enforcing conventions
- ✓SQLAlchemy ORM for PostgreSQL with explicit model definitions and Alembic migrations
- ✓Jinja2 templates for both full pages and partial HTML fragments returned to HTMX
- ✓Tailwind CSS for utility-first styling without a CSS build step
- ✓Container-platform deployment with managed PostgreSQL, deployed from git push
When to Use HTMX + Flask
- →Data entry and form-heavy internal tools with inline validation
- →Search interfaces that filter results without full page reloads
- →Prototypes and MVPs where team is Python-first
- →Apps that wrap Python scripts or data processing logic in a web UI
Pros
- HTMX adds meaningful interactivity to Flask apps without any JavaScript expertise
- Flask minimalism means you understand and own every part of the stack
- SQLAlchemy gives full SQL access for complex queries that a BaaS SDK would struggle with
- Single Python process handles both full-page and partial-update requests
Cons
- Requires assembling auth, ORM, and migrations separately, with no batteries-included defaults
- Network round-trips are visible on every interaction, so it's not suitable for real-time collaborative UIs
- SQLAlchemy + Alembic setup is more verbose than Django ORM + built-in migrations
- Harder to hand off to designers than React-based frontends
Database Options for HTMX + Flask
The standard choice: a full PostgreSQL instance on a managed host or your own server, connected from Flask via Flask-SQLAlchemy, with complete control over configuration and extensions.
Flask-SQLAlchemy connects to MySQL through the same PyMySQL or mysqlclient driver it uses for PostgreSQL, with no framework-level changes, just a different connection string. A common substitute in shared-hosting and legacy MySQL infrastructure Flask apps sometimes inherit.
These are highlighted picks. To see all the tools, check the Databases category.
Hosting Options for HTMX + Flask
A container-based platform where the whole Flask + HTMX app deploys as a persistent service, a natural fit for a gunicorn process holding a live database connection pool. No free tier: the Hobby plan starts around $5/mo in usage credit, plus usage-based billing for CPU, memory, and network. Auto-deploys on push, and has no CDN of its own.
The same persistent-service model as Railway, with a genuinely free tier for small Flask apps, built-in cron jobs, and its own CDN for static assets. Free-tier services spin down after inactivity; predictable always-on pricing starts around $7/mo.
A self-hosted VPS running the whole Flask + HTMX app yourself, at the price of managing deployment and updates. Entry-level instances start around €4-5/mo, the cheapest option here, though there's no bundled CDN.
Runs the Flask app as a container close to users across multiple regions, useful if latency to a geographically spread user base matters more than raw cost. Billing is usage-based with only a small free allowance, and there's no dedicated static-asset CDN either.
A managed VPS or App Platform deployment with predictable flat-rate pricing, starting around $4-6/mo for a basic Droplet or about $5/mo for App Platform's smallest tier. Neither bundles a CDN by default, though DigitalOcean sells one (Spaces CDN) separately if needed.
These are highlighted picks. To see all the tools, check the Hosting & Cloud category.
HTMX + Flask Add-ons
Each addition below extends this stack with a capability the base stack works fine without. None are required: include the ones your product actually needs when building this stack, and skip the rest.
Authentication Add-ons
Add authentication when the app needs user accounts — sign-up, login, and data scoped to a specific user instead of a fully open app.
The ecosystem-standard session-management extension for Flask. It handles login sessions and "remember me" cookies, but ships with no user model, password hashing, or registration flow of its own, so you're still wiring those up yourself. The default here because it's the lightest-weight, most Flask-idiomatic starting point.
These are highlighted picks. To see all the tools, check the Authentication category.
CI/CD Add-ons
Add CI/CD when you want a dedicated pipeline for running tests, linting, or multi-stage builds before a deploy goes out. Many hosting platforms already redeploy automatically on every push on their own — a CI/CD tool adds the most value on top of that by gating the deploy on a passing test suite, and matters even more when the hosting choice does not auto-deploy at all, such as a self-hosted server.
Runs the test suite and triggers deployments on every push, directly from the same GitHub repo the code already lives in, with no separate CI service to configure.
These are highlighted picks. To see all the tools, check the CI/CD Pipelines category.
Containerization Add-ons
Add containerization when you want the app packaged the same way across local development, staging, and production, or need to deploy somewhere that isn't a managed serverless platform.
These are highlighted picks. To see all the tools, check the Containerization category.
Email Add-ons
Add email when the app needs to send account verification, password reset, or notification messages.
A transactional email API for account verification, password resets, and notification emails, sent via Resend's official Python SDK from a Flask route handler, with a free tier for getting started.
The established high-volume choice, with dedicated IP addresses and deliverability tooling for apps sending at serious scale. No permanent free plan (a 60-day trial, then paid tiers), so it earns its slot when volume and deliverability matter more than upfront cost.
Payments Add-ons
Add payments when the product is ready to charge for subscriptions or one-time purchases.
Styling Add-ons
Add styling when you want a component or utility-class system to build the UI faster than hand-writing CSS from scratch.
A utility-class CSS framework: styles are composed directly in markup via class names instead of writing separate stylesheet files. The default styling choice bundled by most modern framework CLIs (create-next-app, create-vue, the SvelteKit and Astro starters all offer it), and the base layer shadcn/ui components are built on when that's loaded into the catalog in the future.
These are highlighted picks. To see all the tools, check the CSS Frameworks category.
Interactivity Add-ons
Add client-side interactivity when you want local UI state — toggles, modals, dropdowns, tabs — without a full JS framework or an extra server round trip.
Alpine.js adds lightweight, declarative client-side interactivity on top of this stack's HTMX-driven Flask pages: toggling a mobile menu, showing a modal, or switching an active tab, all without triggering a server round trip HTMX would otherwise need. It is included via a script tag, with behavior written as HTML attributes (x-data, x-show, x-on) rather than a build step, keeping the stack's zero-bundler approach intact.
These are highlighted picks. To see all the tools, check the HTML-first Frameworks category.
Analytics Add-ons
Add analytics when you want to measure traffic, track visitor behavior, or understand how people actually use the product.
An all-in-one product analytics platform: event tracking, session replay, feature flags, and A/B testing in one SDK. The richest feature set if you want more than pageviews.
The industry-standard, free analytics platform, with native Google Ads and Search Console integration. Requires a cookie consent banner in most jurisdictions (GDPR/CCPA), and all data lives on Google's infrastructure, the tradeoff the other three picks were built to avoid.
A lightweight, privacy-first analytics tool with no cookie banner required. A good fit for simple traffic metrics without PostHog's broader feature surface.
These are highlighted picks. To see all the tools, check the Web & Product Analytics category.
Frequently Asked Questions about HTMX + Flask
How does this compare to Flask + HTML Templates (without HTMX)?
The core Flask app is identical. HTMX adds partial-page swaps for specific interactions (a form that submits without a full reload, a list that filters live) without introducing a JS framework or build step. Add it once full-page reloads start feeling slow for common interactions; skip it for a mostly-static site.
How does this compare to HTMX + Django or HTMX + FastAPI?
All three pair HTMX with a different Python backend. Flask brings a minimal, unopinionated core; Django brings a built-in ORM, admin panel, and auth system; FastAPI brings async performance and automatic API docs. Pick based on which backend framework fits the rest of the project; HTMX itself works the same way on all three.
Do I need an ORM, or can I use raw SQL with Flask?
Flask has no built-in ORM, unlike Django. SQLAlchemy is the most common choice if you want one, but raw SQL via psycopg2 works too for a small app with simple queries. This is exactly the kind of decision Flask leaves up to you rather than making for you.
What's the cheapest way to run this stack?
Self-hosted PostgreSQL and skipping the paid addition tools cost nothing beyond hosting. Every hosting option here (Railway, Render, Fly.io, DigitalOcean) charges from day one for an always-on process, so expect at least about $5/mo once you're past local development.
Stacks Related to HTMX + Flask
HTMX + Django
ProjectDjango views with HTMX for dynamic UIs without a JS framework.
Flask + HTML Templates
ProjectFlask with Jinja2 templates: lightweight Python web development.
Flask + Supabase + HTMX
ProjectFlask + HTMX with Supabase: interactive Python web apps without a JavaScript framework.
HTMX + FastAPI
ProjectFastAPI routes with HTMX: server-driven interactivity in Python.
Scores
Popularity3/5
Flask is well-established, but pairing it with HTMX specifically is a smaller, if fast-growing, pattern compared to a JS framework frontend — genuinely capable for the "server-rendered but interactive" niche, not yet a mainstream default.
Learning Curve2/5
Flask's minimal core is already quick to learn, and HTMX adds only a handful of HTML attributes rather than a new templating language or build step. One of the faster paths to interactive UI without a JS framework.
Flexibility4/5
Flask imposes almost no structure, and HTMX itself just swaps HTML fragments without a state-management opinion of its own. Combine with whatever templating engine, ORM, or auth approach fits the project.
Performance3/5
HTMX's partial-page swaps avoid a full page reload for most interactions, but Flask's synchronous WSGI model and each interaction still being a server round-trip keep this from matching an async framework or a JS-framework's client-side state.
Portability3/5
Flask and HTMX are both open-source with no vendor lock-in, portable to any Python-capable host. HTMX itself adds very little coupling since it's just HTML attributes; portability otherwise depends on whichever extensions Flask has added.
Tools in the HTMX + Flask Stack
HTMX + Flask Pricing
Flask, HTMX, Tailwind CSS, Python and PostgreSQL are all open-source and free. HTMX handles interactivity server-side, so there's no separate frontend to host, just one app server and a database, around $5–20/mo on Railway, Render, Fly.io or Hetzner, plus $6–15/mo for managed Postgres if you don't self-host.
Flask, HTMX, Tailwind CSS, Python and PostgreSQL are free.
A single app server on Railway, Render, Fly.io, Hetzner or DigitalOcean; free tiers for testing.
Self-host for free, or use managed Postgres from about $6–15/mo.