Navigating the magic mirror sample code

Browsing through the sample code of the smart mirror software.

Advertisements

In order to set up the interface of our smart mirror we will use the fine work done by Michael Teeuw on his website : https://magicmirror.builders.

On this website Michael provides a free of charge electron application for you to install and run on the computer of your choice (in our case, our Raspberry Pi).

In order to browse through the code made available on this site, I would like to put it locally on my desktop machine.

All of the code is made available through github on this URL : https://github.com/MichMich/MagicMirror

GitHub is a free web based repository for version control, collaboration and bug tracking.  A lot of companies use it, and it is very popular with online communities wanting to share code among everyone who is interested.

Feel free to browse to it.  You can see all of the code and resource files.  The disadvantage here is that you don’t have a clear overview.  However, you can download all of the code to your local desktop using the GitHub client.  On Linux, GitHub files can be downloaded using the command line interface.  We’ll get to that when we start integrating with the Raspberry Pi.

I own a Mac, so I’ll be downloading a more convenient client application to download the data to my local computer.  You can download it at this URL : https://desktop.github.com

Just install GitHub desktop.  You will need to make your own account on GitHub.  It’s absolutely free, and you will be able to save your own version of the magic mirror later on into your very own GitHub repository.

In order to get the code locally, just log into the GitHub website, and go to the URL with the magic mirror code mentioned above.  In that interface you can choose to download the code using GitHub Desktop.

clone-or-download

You’ll need to create a new folder in your GitHub home folder on your computer in order to save the code, but after doing so, you can see the repository in your GitHub desktop application.

github-code

The best way to view the code is using a code editor.  There are a lot out there, but for javascript there is a very popular one called atom.io.  It’s so popular that you’re even able to open the code from your GitHub Desktop application when right-clicking on the repository.

atom-open

You can download atom at this website : https://atom.io

As usual, this editor is also free of charge.  It’s a great editor that’s fully customisable in a every thinkable way.  I might be coming back to this in one of my future posts. Let’s see where it brings me…

atom-interface

Ps: atom itself is also created using electron, the same framework that is used to build the smart mirror interface.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s