tl;dr: Clone the repo and run npm install. This should be enough, but this is my first time developing with NPM, so who knows. You'll also need to comment out the line <base href="/rescue/"> in index.html.
Details: the main complexity in development comes from this app using Tailwind CSS, which is a utility-based CSS framework that acts as a post-CSS processor. You'll notice in the HTML that most elements have a lot of inline classes. These are Tailwind utility classes that style everything consistently without me having to write a ton of CSS.
In index.html, you'll need to comment out the line <base href="/rescue/">. This, I believe, is due to Github Pages: when deployed, everything is relative to tusharc.dev/rescue, but locally, everything is just relative to the repo root. So, for instance, the relative links in css/tailwind.css will be broken if this isn't set correctly. (I'm still not totally sure if this is correct.)
Finally if you make changes to the HTML files, the page will automatically reload with the refreshed styles if you're using something like live-server (which I am). You don't have to do this; you can use python -m http.server if you want. Note that if you make changes to Tailwind config or utilities (i.e., anything in tailwind.config.js), you'll need to rebuild the generated Tailwind CSS file using npm run build.
This is a static site deployed via Github Pages, hosted at tusharc.dev/rescue (where tusharc.dev is my normal Github Pages site hosted in the tuchandra.github.io repo).
For deployment, we want to strip out the unnecessary Tailwind classes (see docs). We have to build the CSS for production using npm run prod, which uses (under the hood) PurgeCSS to get rid of unused classes.
This app would not be possible without:
- zaksabeast/gist, which made me realize that this project was possible
- mid-kid/pmdrtdx_password, which is all the Python code we use to decode and encode passwords
- Mozilla's Pyodide, which lets us use Python compiled to WASM and run it in the browser
- Tailwind CSS, which singlehandedly cured my fear of and disdain for CSS