M5StackをArduino IDEで使えるようにする

# はじめに
今までは、Arduino UNOやMEGAなどのプロトタイピング用ボードを使って、色々なセンサーを操作して遊んだりしていましたが、今回は、色々なセンサーを簡単に接続して遊べるM5Stackを使って、センサーの値を表示したいと思いました。
その際、UIFlowを使ったビジュアルプログラミングではなく、慣れているArduino IDEを使って、プログラミングが出来ると良いかな、ということで、Arduino IDEを使ってM5Stackを操作するための、準備とHello Worldを表示するところまでを解説したいと思います。

# 環境
- Arduino IDE
- Windows10 Home
- [M5Stack M5Go](https://www.switch-science.com/catalog/7363/)


# 準備
M5Stack をArduino IDEでプログラミングするための準備をします。
## USBドライバーとArduino IDEをインストール
1. M5StackをWindowsに認識させるために、USBドライバーをインストール
[Arduino IDE Development](https://docs.m5stack.com/en/arduino/arduino_development) から、**CP2104 Driver（USBドライバー）** をダウンロードして、インストールします。
1. M5Stackにプログラムを書き込むために、Arduino IDEをインストール
![arduino00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/49845/b63a60fa-4e58-4229-763c-1e5f39ff047a.png)
**Arduino IDE** は、`Microsoft Store` からインストールできます。
## ポートの確認
上記ドライバーとソフトをインストール後、ポートの確認を行います。
Arduino IDEからM5Stackにプログラムを書き込むためには、M5StackがどのUSBに接続されているかをArduino IDEに教えてあげる必要があります。Windowsの場合、USBの名前は**COM1**,**COM2** といったような、ポート番号で割り振られていますので、まずは、M5StackをパソコンにUSBケーブルで接続して番号を調べます。
デスクトップ上で、`Windowsキー` ＋ `Xキー` を押すと出てくるメニューから、**デバイスマネージャー** を選択します。
![port_com3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/49845/901da782-6a67-e1aa-e707-4e1e5f491e94.png)
**デバイスマネージャー**で`ポート(COMとLPT)`の項目を広げると、先ほどインストールしたUSBドライバの名前 `Silicon labs CP210x USB to Uart Bridge(COM3)` が表示されています。これがM5Stackに接続されているUSBとなりますので、この最後の **COM3** を覚えておきます。僕のパソコンでは **COM3** でしたが、使用するパソコンで、この数字は変わってきます。
## Arduino IDE の設定
### M5Stackを認識させる（ボードマネージャ）

Arduino IDE を起動し、メニューから、
`ファイル` > `環境設定` を選択します。
![arduino03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/49845/94d565bc-44bf-b865-d1a4-3aa9574d70cf.png)
`追加のボードマネージャのURL` に `https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/arduino/package_m5stack_index.json` を追記します。
`OK` を押して、画面に戻り、メニューから、
`ツール` > `ボード` > `ボードマネージャ...` を選択します。
![arduino04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/49845/f914d935-2aac-396c-be80-a18317df5ba1.png)
**M5Stack** で検索をかけて、表示されたパッケージを**インストール** します。
インストール後、再度メニューから、
`ツール` > `ボード` と選択していくと、`M5Stack Arduino` が追加されています。
![arduino05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/49845/80987c57-6b43-fa5d-a04e-09e15eafe652.png)
**M5Stack Arduino** から、M5Stack Go用の、`M5Stack Core ESP32` を選択します。
再度、メニューから `ツール` を選択すると、M5Stack Go用のセッティングにツール内の情報が変更されています。
![arduino06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/49845/346acfbc-7e66-c712-1bc4-179ffa4146d5.png)
最後に、`ツール` > `シリアルポート` から、先ほど確認したポートを選択します。今回は**COM3**を選択します。

これで、準備は完了です。
# Hello World
準備ができたら、まずは**Hello World**を作りましょう。
といっても、**M5Stack** のパッケージをインストールしたタイミングで、サンプルスケッチも同時にインストールされていますので、このサンプルの中の**Hello World**を実行してみましょう。
![arduino07_helloworld.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/49845/41b7e7ea-b15d-be30-824d-759e02239529.png)
メニューから、`ファイル` > `スケッチ例` > `M5Stack` > `Basics` > `HelloWorld` を選択します。
![arduino08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/49845/6c9699ca-8411-4e1b-f0a6-54860606a6a1.png)
画面左上あたりの矢印の`マイコンボードに書き込む`ボタンを押すと、M5Stackにプログラムが書き込まれます。
ボードへの書き込みが完了したら、M5Stackの画面上に**Hello World**と表示されていれば、成功です。これで、色々なセンサーを接続して遊べる準備が完了です。
# 参考URL
- [M5Stack事始め（Hello World!!）](https://note.com/rasen/n/n83680dd38573)
- [Arduino IDEの設定 (M5Stackシリーズ)](https://qiita.com/penguinprogrammer/items/774d4b719464e41cdcf3)
- [Arduino IDE Development](https://docs.m5stack.com/en/arduino/arduino_development)