Building a magic mirror – Part 1 – The project

Building a magic mirror – Part 1 – The project

For this post, I thought I would share a project I’ve been working on for my family. For our family, we have a marker board in the kitchen that helps keep track of everything going on for myself, my wife and our kids. And while this is great in practice and does help. The fact that this is analog has been driving me nuts for YEARS. So I wanted to see if we could up this with a magic mirror.

Now I have a magic mirror in my office that I use to help stay focused, and I have here how I manage it via Azure Dev Ops. But I’ve never really done a post detailing how I built this mirror for those interested.

First Hardware Requirements:

In my case I’m using an old Raspberry Pi 3 that I happen to have just sitting around the office, and I’ve installed the Raspberry Pi linux OS on that device.

Outside of that, I’ve got the basics:

  • Power supply cable
  • HDMI Capable
  • Monitor
  • 64 GB Micro SD card
  • SD Card Reader

Now I have plans to hook this to a larger TV when I set it up in the kitchen, but for right now I’ve just got a standard monitor.

Goal of the Project

For me, I found this video on YouTube, and thought it was pretty great, so this is my starting point for this project.

Setting up the Raspberry PI – Out-of-the-Box

To download and install the OS, I used the Raspberry Pi image manager found here. I used the SD card reader I had in the office to format the SD card, and then install the OS.

Once that was completed, I booted up my raspberry pi, and finished the setup which involved the following (there is a wizard to help with this part):

  • Configure localization
  • Configure Wifi
  • Reset password
  • Reset Hostname
  • Download / Install Updates

Finally, one step I did to make my life easier is to enable SSH to the raspberry pi, which allows me to work on it from my laptop rather than setting up a keyboard / monitor / mouse permanently.

You do this by going to the “Settings” on the Raspberry Pi, and going to the “Interface” tab, and selecting “Enable” for “SSH”.

Now that my Raspberry Pi is running, we come to the meat of this, and that’s getting the magic mirror running:

Step 1 – Install Node.js

You need Node.JS to run everything about the magic mirror, so you can start by running these commands against your raspberry pi:

curl -sL https://deb.nodesource.com/setup_16.x | sudo -E bash -
sudo apt install -y nodejs

From there, I cloned the magic mirror repo to Raspberry Pi.

git clone https://github.com/MichMich/MagicMirror

Then enter the repo from the command prompt:

cd MagicMirror/

Then you need to install NPM to be able to work with the MagicMirror installation. This takes the longest, and the first time I ran this I actually had to use sudo to make sure it completed the install.

sudo npm install

A good recommendation from the magic mirror site is to copy the default config so you have a backup. You can do that with this command:

cp config/config.js.sample config/config.js

Finally you can start your MagicMirror with:

npm run start

Now, the next part was tricky, if you reboot your RaspberryPi, the magic mirror will not start automatically, and you need to do some more configuration to make that happen. Most documentation will tell you to use pm2, and I would agree with that, but if you try to run the commands on the most recent Raspberry Pi, you’ll find that pm2 is not installed. You can resolve that with this command:

npm install pm2 -g

Then run the following commands to configure your MagicMirror to run on startup.

pm2 startup

After running this command you will be given a command to run to enable pm2 on startup, run this command.

Then run the following:

cd ~
nano magicmirror.sh

Put the following in the magicmirror.sh file, and then hit Ctrl-X then Y

cd ~/MagicMirror
DISPLAY=:0 npm start

Finally run these commands to finish configuration

chmod +x magicmirror.sh
pm2 start magicmirror.sh

pm2 save
sudo reboot

After that you’ll see your monitor displaying the default configuration for the MagicMirror.

Next post I’ll walk you through the steps I took for configuring some of the common modules to get it working.

Leave a Reply

Your email address will not be published. Required fields are marked *