Plug this with any JS runtime (cloudflare workers, deno, bun, ...), any database (mysql, sqlite, postgre) or cloud database (d1, neon, turso, ...).
This example uses:
https://hstack.atmos4.workers.dev/
Each request is handled by hono on a cloudflare worker, fetches d1 data with drizzle and returns html that htmx injects in the page surgically.
First, create a Cloudflare account. Then:
- clone repo
npm install(or whatever package manager you prefer)- create d1 database
npx wrangler d1 create <your-db-name>copy the output and replace things in wrangler.toml.
- apply migrations to local db
npm run d1:local:apply- run the server locally
npm run dev- apply migrations to d1
npm run d1:apply- deploy
npm run deployand voila. as easy as that.
- change stuff in
db/schema.ts - then run
npm run drizzle:generate
npm run d1:local:applythis will generate a new migration and apply it. Rerun the deploy steps to ship it to production.
If you want to suppress d1 warnings, create a .env file based on .env.example
If you struggle to understand this example, the official d1 tutorial uses Hono too. It is very similar to what I have built and describes the steps to create your first d1 database very well.
The core of this stack is Hono + HTMX, hence the name. The rest of what I have used here can be replaced what something else. Examples: the bun runtime, TailwindCSS instead of Uno, no ORM, Turso instead of D1, etc.