Welcome to my productivity dashboard project! This repo contains the code for the display I run on a Raspberry Pi 4 + monitor setup mounted above my desk. The dashboard is built using javascript with scss for styling, along with webpack for bundling.
It’s inspired by the idea of a magic mirror, and is designed to cultivate a focused environment with a clock, calendar, and todos in a distraction-free layout.
-
Displays a fullscreen dashboard in Chromium on Raspbian
-
Shows calendar events, clock, and tasks at a glance
-
Keeps me focused and on top of upcoming events
I also have a Sense HAT temperature monitor running on the same Pi, which changes the LED color based on CPU temperature, to make sure I don't overheat by accident since I don't have a fan or cooling system :)
Check out resources.md for some of the tutorials, tools, and references I used while building this.
This was my first hardware + software project, and I wanted to share it for anyone who’s been curious about exploring hardware but felt intimidated (like I was!).
If you're into web dev and want to dip into hardware, I’d definitely recommend something like this; it helped me get more confident with hardware and inspired me to check it out more!
Live demo: https://108charlotte.github.io/magic-mirror/ (Note: requires Google sign-in to show your calendar and may show an “unverified app” warning — it’s safe, but if you still don't want to bypass it you can just close out of the popup that opens and the dashboard will work just fine without the calendar!)
I’d love ideas for features, layout improvements, or general feedback, and I’m also open to contributors!