I created this app to help me track cash transactions that I can then export as a CSV file and then import into my PTA. It works well. It can work offline. I built it to be progressively enhanced. So, no JS needed but, if you don't mind JS being used, then it will have better features and even work offline, saving any transactions for when you are online again.

https://github.com/jon49/cash

I created a little app that tracks the cash spending that I can export with a CSV file. You can host it yourself. I had no idea that my wife was using so much cash!

https://github.com/jon49/cash

I took that idea and made it actually usable.

https://github.com/jon49/htmz-be

It's amazing how much further you can go when you flip the server as the one deciding where what should be updated on the page.

This was originally conceived by datastar and nomini also implements it this way. And HTMX 4.0 will have this as a first class citizen.

HTMX and related libs work just fine as offline apps. I've been doing it with my personal apps I make for myself for a long time.

Also, morphdom/idiomorph get you a long way even when you have highly interactive pages, especially if you have to hit the back end anyways. If you don't need to hit the back end then a front end lib is fine. But even then, the simpler pattern of hypermedia-driven applications can be better.

See https://github.com/jon49/Soccer as an example of this.

There's also htmz-be, nomini.js. Depending on your complexity needs.

This exactly. React is spaghetti code with the reducers. Using API end points to fetch HTML makes it super simple to see what is going on.

fixi.js, nomini.js, data-star, htmz-be. All have smaller footprints. All work just fine, depending on your needs.

Here's an example offline-first hypermedia-driven soccer application. The match page is the most complex part of the application and I use Morphdom to just do a diff on the main section of the page. I find hypermedia-driven development to be super simple.

I find React to be really complex. What normally takes me just some HTML rendered from the back end and some interactivity on the front end can be done in just a few lines of code, but React takes 10s of lines of code for what I can write in a single line of code using vanilla js. The virtual dom causes it to make everything state. I always find it odd that people reach for that as their front end. I could understand something like Svelte, but even that is too complex for my needs. But I'm always writing CRUD apps, so there is some complexity but not that much, React just makes something that was simple, super complex.

https://github.com/jon49/Soccer

Interesting read. I haven't quite finished it all. I haven't ever needed anything like that when writing web pages with HTMX, html-form (my own), nor htmz-be (another one I wrote based off of htmz but the back end decided where the HTML will go, similar to data-star and nomini). When I write code from the back end and target the front end I can use middleware to common updates.

Here's the most complex app I've made with it. The most complex part of the app is the match page. I just use morphdom for that part of the app and it makes it super easy, I just send the whole main part of the page back and let a dom diff happen.

https://github.com/jon49/Soccer

This is a offline-first PWA app where I serve the back end from a service worker using JS template literals to stream HTML. This uses a variant of HTMZ to increase the interactivity of the app along with Morphdom for DOM diffing.