Pi Not Pie: Building my Bedroom Digital Dashboard
Backstory
I’ve been interested in coding since ~13y.o. I still have memories of fascinating over front-end web development art projects to randomly generate objects and make them motion across the screen.
But weirdly, I never fell into the Raspberry Pi void 🤷🏼♂️
Any coding/engineering hobbyist or Smart Home enthusiast will know the ring of that word: Raspberry Pi. The circuitry isn’t quite edible, but the thought of a Pi still makes you salivate at the endless realm of DIY projects and quirky little automated trinkets you can place around your home.
I never had a family member or teacher who advocated for Pis, and I never really found the need to get one as I was perfectly content with my VMs and what not.
But that all changed one day.
I suddenly found myself in the market for a Smart Calendar, to hang up in my bedroom - so I could glance at the weather, time, what I had on currently/during the week, as I completely depend on my Apple Calendar to organize my life.
Seeing the prices of the Smart Calendars in the market - I found myself thinking “There’s no way it’s that hard to hook up your digital calendar’s APIs and just have a nice little front-end show up on a monitor or something”. Curiosity turned to spite, as I felt ripped off by the commercial options available.
Research
Through my research, I initially stumbled upon two popular options:
Dakboard
Magic Mirror
Dakboard was definitely easier to just plug-and-go, but once again, this luxury of easy configuration came at a cost - some annoying subscription to their SaaS even though you were hosting it on your own computing/monitor. Once again - spite.
So I turned to the MagicMirror - open source, lots of community modules, relatively easy setup with quite a bit of customization out-the-box. Yes, it’s kindaaa meant for a smart mirror (in a bathroom etc.) but it provided the exact functionality I needed for just a plain old monitor.
Dev
I tried installing and running the native Raspberry Pi OS on my M3 Pro Mac, but I ran into issue after issue with my virtualization. Eventually, I gave up and went “Kali is also Debian, potato potáto” and so I spun up my Kali box (with default creds of course) and began there.
The MagicMirror docs instructed the classic use of npm and git to clone the MagicMirror repo to your local host/VM and all required dependencies. Easy.
The default MagicMirror modules kicked off in my Electron instance and went fullscreen.
Default config looked similar to this
My main requirement was to have a big calendar of my week, starting Monday, showing all my events and emphasizing the current day and current event(s). It of course had to be colour-coded to match my Apple Calendar closely.
I found that the 3rd party module MMM-CalendarExt3 had an aesthetic that would work better than the default calendar module provided by MagicMirror, so I followed the config instructions on the Ext3 Github page…
Increased the frequencies of Calendar refresh to about once every 5 mins
Plugged in my Public iCloud Calendar APIs
Tweaked the module config to display as needed
Dug into the CSS to custom color code the events exactly as they would appear in my Apple Calendar
I then included the default time and weather modules in the top left, followed by the default newsfeed module to aggregate interesting cybersecurity/world news RSS feeds into a rotation on my digital dashboard.
Finally, after some further ‘shopping’ for 3rd party modules (I just got carried away at this point), I found an NBA live scoreboard module that would keep me up to speed during a slow Work From Home day ;) MMM-NBA
Moment of truth
So I ordered what I thought I needed
Hardware List
Raspberry Pi 3A+ (Wi-Fi, HDMI, USB for I/O, Micro-USB Power)
Micro-USB to UK Plug Power
HDMI cord
Black case for the Pi
But plugging it in I could only see a flashing red light on the board. Some quick Google searches - turns out it needs the OS pre-loaded on an SD card.
Moment of truth v2
So I bought a 16GB SD Card off Amazon with Raspberry Pi OS preloaded. It actually didn’t boot properly for some reason, so I ended up just reimaging the SD Card using Raspberry Pi Imager to give it a clean version of the RP OS and then it finally booted :)
But I couldn’t connect to the network properly for some reason
Moment of truth v3
It turns out there were issues being caused by NetworkManager daemon. I had to disable this from tampering with the DNS Resolvers in use and then set the DNS Resolvers to be Google’s public DNS Resolvers out of laziness
So finally ping google.com was returning ICMP responses (DNS resolution was working), now to quickly grab my code repo from Github…
I couldn’t use my Yubi key to provide required MFA (USB-C only) and password-based authentication alone is disabled by Github now. I tried issuing an access token, but it was way too long to type manually.
Moment of truth v4
Out of frustration, I simply enabled SSH daemon on the Pi and used SCP to copy the local code from my Mac over my LAN to my Pi.
Eventually installed npm, pulled the MagicMirror code and replaced with my custom CSS and JS config. And wallah! It worked!
Happily ever after?
Despite my lengthy attempt to run MagicMirror on bootup using rc.local (and trying to debug it for over like an hour), I ended up using Autostart thanks to a helpful MM blog post.
I’m still having issues here and their with network connectivity / NetworkManager daemon, causing modules to error transiently, but the PoC does indeed work!
Down the line I plan to get a dedicated wall-mounted monitor dedicated to my bedroom dashboard, but wanted to just get it working using my main monitor.
I also experimented with using a Smart Plug which boots the Pi 7AM on my Work-from-home days, and shuts off the Pi at 10PM every night in case I manually turn it on. Works pretty well. Definitely potential to automate based on my Apple Calendar in future, but this is fine for now.
Final result (so far at least)
