Running goals on my TRMNL

Last month, I saw Ferruccio with a TRMNL and it picqued my interest because I'd been thinking about putting some things that I always wanted top of mind right in front of me. For example, my running goals that I track using the Strava widget on my phone.

After some initial skepticism about the inability to "remix" existing plugins and the device not being future proof (in case they shut it down), I decided to get one when I looked at their docs and saw that I could point it to my own server if need be.

I've had it for a week now and I really like it! It's nice to have it refresh with things that matter to me, and to be able to glance at them every now and then.

After setting up some of the default plugins, I realized that I was missing my running goals. So I asked about it in the chat and they told me that a Strava plugin was on their roadmap. But since I didn't want to wait, I built a custom plugin for myself!

I reused some code that I use to update my now page with my last run from Strava. I just needed to update it to only get activities from the current week so that I could add up the kilometres and get my weekly progress. The yearly progress was neatly available as a ytd_run_totals field returned by the client.get_athlete_stats() method provided by the stravalib library.

After getting the progress numbers, the only thing left to do was to display them nicely on the TRMNL using their design system. It's very tailwind -esque and really nice to work with.

Since they don't have a native progress bar component yet, I had to create some progress bar divs and update their width percentage with some plain old javascript.

Et voila !

I've detailed the steps to set up running goals as a custom plugin on the TRMNL in this GitHub repo in case you're interested.

As you can see from the image, I didn't manage to hit my running goals this year, but next year will be better ✨