Live data from Hacker News

Useful patterns for building HTML tools

simonwillison.net

71–80 of 101 posts

Re: Useful patterns for building HTML tools

#71
I'm a big fan of using this kind of thing at work. Rather than setting up a web server or packaging something into an installer, I just pop the bundled HTML file on a shared drive.

The CDN approach works, but I don't love depending on some third-party service just so your app continues working. Instead, I like using vite with vite-plugin-singlefile. This lets you package your JS and CSS into a single HTML: https://www.npmjs.com/package/vite-plugin-singlefile

Re: Useful patterns for building HTML tools

#72
post #63

Earlier quoted context omitted.

You can use react with jsx without any build step in single html file as well.

Yeah I used it for this one via Babel from a CDN but it felt pretty crufty: https://tools.simonwillison.net/box-shadow

Yes, I guess it would start showing advantage for complex ones.

The idea is interesting, shame there is nothing for full stack like this, something like opinionated fossil-scm setup - which already has project management built in (for llm to use for its dev progress); together with backend and runtime state squashed inside single sqlite so you can create/delete them independently without a fuss.

Re: Useful patterns for building HTML tools

#73
post #68

Endlessly churning out tools with vibe coding sounds quite boring to me. The world went and changed I guess.

Building little toy projects like some of these is one of my favorite ways to learn and play. Sometimes the value isn't in the initial finished product but in the concepts it exposed and knowledge or inspiration gained from that. I guess if what you really want is only the finished product and nothing else, churning it out as quickly as possible with AI and not caring about the implementation could work for you. But…

> Building little toy projects like some of these is one of my favorite ways to learn and play.

Same here! That's why I'm having so much fun building nearly 100 of them in a year.

The difference here is that I didn't have to type out all of the code by hand.

Re: Useful patterns for building HTML tools

#74
I've been building these for years. I think its a great entrypoint for new developers and can be incredibly useful at work for solving short term inconveniences or scripts that help automate some tasks.

I have a Vue3 started template I host at https://http://vue-template.spaghet.me/ and all I have to do is curl and I'm ready to go.

Showcase:

https://timer.spaghet.me/ https://colors.spaghet.me/ https://box.spaghet.me/ https://talk.spaghet.me/ https://farming.ope.cool https://stitch.ope.cool https://draw.ope.cool https://walz.ope.cool

Re: Useful patterns for building HTML tools

#75
Makes me wish there was a cross-platform equivalent to HTML Applications [1]. They were hell to develop at the time, but being able to create single-text-file tools with a browser UI, file system and network access, and app automation via COM was amazing

[1] https://en.wikipedia.org/wiki/HTML_Application

Re: Useful patterns for building HTML tools

#76

I was also heavy on these single-file HTML tools. My problem was not being able to sync the localstorage data between PC and smartphone. I made a paid service which did that automatically. It didn't take off unfortunately, and I am keeping it on maintenance mode because it has some amount of free users that rely on it. For anyone interested, to achieve synchronization I basically just use the https://github.com/googl…

> My problem was not being able to sync the localstorage data between PC and smartphone

That's what remoteStorage is for.

https://remotestorage.org/>

Re: Useful patterns for building HTML tools

#78
I love this idea! I've also been using LLMs to build tiny utilities and automations for myself, but instead of using HTML, I'm building them as:

- Shell scripts, AppleScripts, etc. that I trigger from Alfred

- Obsidian plugins

- The occasional Emacs Lisp function

They serve a similar purpose for me as OP's HTML Tools, in the sense that they let me automate a small part of my workflow that I wouldn't otherwise have automated. If I have to choose between writing AppleScript and just doing something manually, I'll pick doing something manually 100% of the time. But if I can just ask an LLM to write the automation for me and then test it in a bunch of different scenarios, the choice becomes much easier.

After reading this post, I really want to try moving some of my automations to the web. Using HTML/JS/CSS for some of these tools will let me solve a whole different set of problems. E.g. I could more easily build automations for the non-techy folks in my family instead of just keeping them to myself.

Re: Useful patterns for building HTML tools

#79

I love this idea! I've also been using LLMs to build tiny utilities and automations for myself, but instead of using HTML, I'm building them as: - Shell scripts, AppleScripts, etc. that I trigger from Alfred - Obsidian plugins - The occasional Emacs Lisp function They serve a similar purpose for me as OP's HTML Tools, in the sense that they let me automate a small part of my workflow that I wouldn't otherwise have au…

I've written a bunch of shell scripts like this too, but I've been focusing increasingly on web tech mainly because that way the same tools work on both my laptop and my phone.

Re: Useful patterns for building HTML tools

#80

I love this idea! I've also been using LLMs to build tiny utilities and automations for myself, but instead of using HTML, I'm building them as: - Shell scripts, AppleScripts, etc. that I trigger from Alfred - Obsidian plugins - The occasional Emacs Lisp function They serve a similar purpose for me as OP's HTML Tools, in the sense that they let me automate a small part of my workflow that I wouldn't otherwise have au…

I used to dislike AppleScript but now I enjoy using it. The turning point for me was when I finally bit the bullet and read a book on the subject.

AppleScript’s human readable language lulls you in this false sense of security that you can wing it and everything will just work out. This is simply not the case, it is a very quirky language and it helps to read a book to get the right mental model.

The second thing that helped was getting AppleScript debugger from Late Night Software. They recently decided to no longer develop it and release it for free on their site. It’s worth getting if you haven’t done so already.

Post reply on HN