お家で作れるIoT『Smart Mirror』

『Smart Mirror』をRaspberryPIにオープンソースのMagicMirror²を用いて制作しました。

1-1．設定準備

設定に必要なものは以下のとおり。

●インターネット環境（家のWifi環境を利用）
●RaspberryPI
●キーボード
●マウス
●設定用のモニタ

まずは、システムの基盤となる「RaspberryPI」を準備します。
初めてRaspberryPIを使用するので、初心者向けのキットをアマゾンで購入。別途、マウス、キーボード、モニタが必要だったため、家にあるものを利用しました。
＜購入した商品＞

LABISTS Raspberry Pi 4 4B-64GB（技適マーク入）MicroSDHCカード64G/Raspbianシステムプリインストール/カードリーダ /5.1V/3A Type-C スイッチ付電源/MicroHDMI-to-HDMIケーブルライン/三つヒートシンク/簡単に取り付けケース/日本語取扱説明書/２４ヶ月保証

1‐2．RaspberryPIのセットアップ

①組み立て
②インストール・初期設定

1‐3．Smart Mirror向けのソフトウェアの導入

今回、自作のSmart Mirrorの作成にあたり、Smart Mirrorのプラットフォームであるオープンソースの『MagicMirror²』を利用します。

MagicMirror²の設定は、以下の公式サイトに従い実施することで簡単できました。

Installation & Usage | MagicMirror族 Documentation

はじめは、色々なブログやYoutubeを参考にしましたが、上手くいかず…
なぜだ！！っと思いましたが理由は、↓こちらでした。トホホ

2020年の初めに、MagicMirror²のコアリポジトリから自動インストーラを削除し、コミュニティが管理する別のリポジトリに移動することが決定されました。

やはり、公式サイトの確認は必須ですね。
それでは、手順を見ていきます。
（コピペでできるはず）

①最新版のNode.jsをダウンロードしてインストールする

curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -

sudo apt install -y nodejs

②リポジトリをクローンしてマスターブランチを確認する

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

③MagicMirrorディレクトリの移動する

cd MagicMirror/

④アプリケーションのインストール
インストールにかなり時間がかかります。

npm install

⑤サンプル用のコンフィグファイルをコピー
この設定ファイルを修正することで、オリジナルのスマートミラーを構築できます。

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

⑥アプリケーションの実行
実行できれば、完成間近！！

npm start

1‐4．Magic Mirrorのチューニング

Magic Mirrorには様々のモジュールが提供されています。
モジュールを利用することで、自分好みのSmart Mirrorを作成できます。

Introduction | MagicMirror族 Documentation

以下のステップにて、東京の天気を表示させました。

①事前準備（ロケーション情報を取得）
設定ファイルにロケーション（東京など）情報を追記する必要があります。そのため、事前に以下の情報を取得しメモしておきます。

OpenWeatherMapからlocation、locationID、appidの情報を取得。

Members

上記サイトにより、都市を検索した際のURL末尾の番号がlocationIDのようです。東京の場合は以下のとおり”1850144”

https://openweathermap.org/city/1850144

また、APIは以下のサイト参考にAPIキーを取得しました。

OpenWeatherMapで天気予報を取得するまでの方法

②設定ファイルを編集（location、locationID、appidを編集）

vi MagicMirror/config/config.js

modules: [
	{
		module: "currentweather",
		position: "top_right",	// This can be any of the regions.
									// Best results in left or right regions.
		config: {
			// See 'Configuration options' for more information.
			location: "Amsterdam,Netherlands",
			locationID: "", //Location ID from http://bulk.openweathermap.org/sample/city.list.json.gz
			appid: "abcde12345abcde12345abcde12345ab" //openweathermap.org API key.
		}
	}
]

他のモジュールを利用したチューニングは別のnoteで整理する予定です。