Magic Mirror Notion Integration

What we are going to achieve after reading this article:

I feel like I have been living in a hole for not having discovered the Magic Mirror software way sooner. For those who were in the same hole as me, the Magic Mirror is a simple software that allows one to create a simple and highly customizable smart mirror or even digital dashboard by using affordable products ie. raspberry pi and monitor/screen. I currently installed the software on my MacBook to first customize it before booting it up on a pi.

The setup and installation guides are very easy to follow and can be found here: https://magicmirror.builders/ . Once you have gone through the installation process you will have the basic Magic Mirror with the default module.

Once you have set up the mirror you are now ready to begin your customization journey. My current setup is:

I currently have 8 modules installed. You can explore a library of 3rd party modules here: https://github.com/MichMich/MagicMirror/wiki/3rd-party-modules

Notion Integration

Notion is a powerful productivity tool that can enable users to create highly customizable “databases” represented as lists, tables, notes, etc. Notion recently created APIs to allow users to interact with their notion accounts. This is great because you can easily write to and read from your notion account. To learn more about Notion you can access it here: https://www.notion.so/. You can explore the notion API here: https://developers.notion.com/

Having gone throught the installation setups for the Magic Mirror you can process to follow the steps below to set up a notion integration

Step 1:

Create a new mirror module by following the steps laid out in this template: https://github.com/roramirez/MagicMirror-Module-Template

You will have a basic module that makes a simple request and displays the response on the Magic Mirror.

Step 2:

Get you API key from your Notion account by visiting https://developers.notion.com/docs and follow the guide.

You can use insomnia or postman to test out fetching and posting data to the Notion API.

Step 3:

You can now add the fetch request into you module. Notion provides a javascript SDK that can be used to perform actions on the API however during my brief testing period I was unsuccessul in getting it to working withing the Magic Mirror.

I opted to use the request package instead to perform requests.

Create a separate file where all your requests will be written such as:

You can now import the connector code into the node_helper.js file and call connector.getNotionData() from with the node_helper.js file. The node_helper will the push data back to your main MMM….js file where you can update the DOM.

Step 4:

Integrating Google Assistant 😃

The current method that I used to integrate Google Assistant was to use If This Then That. Its a great service that allows various different applications and services to “communicate” to each other. Its a rather brilliantly simple concept: If This (Google Assistance Voice Command) Then That (Adds an entry to my Notion list).

Create an IFTTT account and follow the prompts to create an Applet. Select Google Assistant for the IF portion and then select the 3rd option for google command with a text ingredient. This will enable you to add text to Notion ie. the text ingredient of your command

For the THAT portion you have two options:

  1. Select Notion(beta) and grant IFTTT access to your list of choice from with Notion. Save the Applet and try adding a notion entry via Google Assistant. Below is a video tutorial:
  1. Select Webhook. Head over to Integromat and create an account. Integromat will enable you to create a webhook that you will use in the IFTTT webhook url section. Below is a video tutorial:

And that should be it 🙌🏾

Conclusion

The smart mirror is a simple project that can easily satisfy one’s DIY tech builder ich. Its highly customizable and its great fun to explore the various modules and uses cases.

I will clean up my code and possibly add it to the list of available 3rd party modules.

Go forth and build 😌

Mobile and full stack web development. Yes I try to do it all 😅