Personal Tracking App

Around March I setup Tailscale on my NAS to allow access to some external devices without having to make anything on my network truly public. Having this remote access opened me up to a bunch of fun projects, the first of which was a site just for me that I could use to track some of my own goals and info.

I've always been big on journaling and list making, so the original idea was going to be to track all long term goals and to have a non icloud note taking setup for myself.

All of this looks jank as hell and I've never been a good web designer (same reason I use a layout template for this site at the moment), but its fun to have and helps organize a bit.

First I setup the basic site to just track some exercise goals, and then I added tracking my read books because Goodreads never met my needs:

I immediately got a pretty serious injury so give grace to the fact that I didnt lift any more weights or meet my running goals LOL.

Book Tracking

My main complaint about Goodreads is just that it doesn't have a tag system, so to keep track of individual memories for a book I have to add it to a names shelf. For example, tracking which books I listened to an audiobook of rather than reading it directly I needed to make an audio book shelf. I *think* this might have changed since the last time I used it, but idk its also an Amazon product so ideally I reduce my use of it in general.

Now I can submit books from the home page of the app, and point a link to the book cover on goodreads or other sites. When I run the bookcase it will look like this:

I have a script that I can then run later to pull those images locally so that I don't have to point to remote links that might break over time, and the script will update the links as well to their local path. I intended to run this on a cron at some point, but today I'd still have to run it manually.

I found this repo that has a fun JS script for rendering books like theyre on a bookshelf.

I use that to render the books themselves. I added a dropdown to filter the shelves by year of reading the book, and added some tooltip support to show my book review and other meta data when hovering over a book.

Sheet music page

At the time I was playing a lot of banjo as my partner had gotten me a beautiful Tenor banjo that motivated me deeply. I was writing sheet music and tabs in a little notebook which was totally sufficient but found a fun option to add to the site:

As long as anything I want to store can be serialized/stored as text then its easy to add to my site. Vexflow offered a way for me to write sheet music/tabs in this notation that they defined (not intuitive for me but not bad, and they document enough to figure it out each time I'd want to). From the site now I can add music, and then render it on page in my ipad to more easily follow along than with my gnarly handwriting.

Misc Tracking

At this point I felt really liberated and started adding whatever I could.

I added a Manga tracking page with a counter button so that I can just increment how many chapters I've completed in each Manga

I added some personal finance goals that I could render with highcharts, a map with all the national parks that I can pin when I complete them, and some video game completion goals for Zelda and Final Fantasy (hopefully this all doesn't make me seem like too much of a geek, but I am a bit I guess)

Some of these I supported updating in the site, others I pull down my docker image, make updates and reupload. Its an awful setup and why I havent updated having gone to the Badlands, but adding any form *is* still work, so I'll do it when the motivation strikes me.

Here's a video of the whole site as it is today:

The main reason I wanted to share is that with Tailscale this is really trivial to setup and really scratched an itch for my goal tracking that no other app could finish since its purely bespoke towards my own life. This really only took an hour to setup since Unraid supports hosting docker images. All I had to do was make a JS static server that spins up with the docker image, make a setup for persisting state from all the forms (which i did like a gorilla since I'm the only user of this site), and then I was free to toss in whatever JS i wanted for things like the charting/bookshelf rendering/etc.