following on from domino, i made a template that i can use whenever i want to make a new standalone web tool. i have used it for add-bitsy-audio, bitsy-muse-ui and flicksy2
the thing these tools have in common is that they exist as single standalone html pages written in plain javascript
this format is important to me as a way of making the tool legible to and remixable by other people
a single html page can be much more easily saved locally and exchanged with others
writing directly in plain (not-machine translated) javascript means the code can be modified in-situ without any special build process
however, i find this format unwieldy for prolonged development of the entire codebase
it is a lot easier to navigate the code when it's split into (somewhat) modular files
html is really noisy and i prefer to write it as .pug and then convert it to html (unlike many javascript build processes, the result looks as if it was human-written)
it is also convenient to have tools for automatically refreshing the page when you make changes, and for easily publishing the page
i have also included a configuration file that tells my editor (vscode) how to attempt to provide autocompletion for the javascript--something that makes programming much easier for me
the format and template is simple enough that i think it could probably be useful to other people who want to move beyond just editing a single html file directly in the text editor
the usage is as follows:
the "src" folder contains "index.pug" which defines the html and references all the css and javascript files to be included
the "./build.cmd" command runs a tool to generate the final html file with everything bundles
the "./watch.cmd" command runs a tool to open the browser and rebuild and refresh whenever the source files change
the "./publish.cmd" command runs a tool to upload the built page to neocities