Windows篇：VSCodeでTOPPERS/ASP3アプリの開発環境を整備する

# TL;DR

- リアルタイムでマルチタスクなTOPPERSカーネル！を使って，組込みアプリを開発したい
- Visual Studio Codeにてナウでヤングな開発環境を整えたい！
- ThingsだけじゃなくてInternet ofつまりIoTじゃね？？
- そんなあなたに，[こんなセミナー](https://algyan.connpass.com/event/136354/)ぜひどうぞ！！
    - 環境構築で分からないところがあれば，どしどしコメントください．

<font color="red">07/02追記：[デバッガ環境](#デバッガ環境)に追記しました</font>

# はじめに

「[TOPPERS](http://toppers.jp/)」ってご存知ですか？
組込み技術者の純粋なこだわりと「匠のワザ」を結晶させた，オープンソースの由緒ある和製リアルタイムOSです．

CUIベースのクロス開発が一般的（というかワタシの好み^^）なのですが，そこはやっぱりIDEを使ってエレガントに開発を進めたいところ．
ということで本記事では，Visual Studio Codeによる開発環境の構築方法を説明します．

# ターゲット

- マイコンボード：[GR-PEACH-FULL](https://www.core.co.jp/product/m2m/gr-peach/index.html#full)
- [TOPPERS/ASP3カーネル 3.2.0](http://toppers.jp/asp3-e-download.html)
- ホストPC環境：Windows 10 Professional
    - 管理者権限が必要です
    - USBポート１口が必要です
    - ディスク容量は１GBくらい使います

なおVisual Studio Codeの良いトコロはmulti platform supportかなと思います．ということで，macやUbuntuユーザの方は下記をご参照ください．

- [Mac篇：VSCodeでTOPPERS/ASP3アプリの開発環境を整備する](https://qiita.com/takasehideki/items/f897e6e063ceb05a9f35)
- [Ubuntu篇：VSCodeでTOPPERS/ASP3アプリの開発環境を整備する](https://qiita.com/takasehideki/items/6119d50dbd8e0a34d64d)


# クロス開発環境の準備

いろいろありますぅ

## MSYS2の準備

MSYS2（Minimal SYStem2）は，Windows上で動くUnixシェル環境です．ターミナルはminttyでシェルはbashが設定されています．パッケージマネージャとしてpacmanを採用しています．MSYS2さえ導入すれば，それだけでUnix風のコマンドライン環境が揃います．
まぁ要するに，Cygwinの使い勝手が良いやつだと思ってください．

### インストール

[公式ページ](https://www.msys2.org)から，x86_64向けインストーラをダウンロードしてください．
下記画面の赤枠からです．（本記事執筆時点での最新版は20190524です）

[<img width="836" alt="msys2.jpg" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/240349/8ea4a2d0-dc7d-78e5-ec1c-c2e8ad74c6fc.jpeg">](https://www.msys2.org)

インストール時の設定はすべてデフォルトのままでOKです．
（「インストール フォルダー」は`C:\msys64`のままにしてください）

最後の画面では「今すぐ MSYS2 64bit を実行します。」のチェックを入れたまま，完了します．

![msys.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/240349/adc2c0f9-e7cc-276c-e073-ca9e5223f018.jpeg)

### pacmanパッケージ更新

MSYS2のターミナル上で下記を実行します．

```shell
$ pacman -Syu
$ pacman -Su
```

下記のようなエラーが表示されることがありますが，このときはMSYS2をいったん閉じて再起動して，また上記のコマンドを実行してください．

```
警告: terminate MSYS2 without returning to shell and check for updates again
警告: for example close your terminal window instead of calling exit
```

![pacmanerror.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/240349/3a6f753c-3100-d4a3-ec8a-e96fb6f5c81e.jpeg)

MSYS2を再起動して更新のコマンドを実行（大事なことなので二度言いました^^;

### makeとRubyのインストール

TOPPERSカーネルのビルドの際には`make`と`ruby`を使用します．
MSYS2上で下記を実行してインストールしましょう．

```shell
$ pacman -S make ruby
```

![pacman.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/240349/289243f4-0db8-314c-9e1d-98589e2531db.jpeg)

これでMSYS2の準備は完了です．

## クロスコンパイラ

ターゲットのマイコンボードであるGR-PEACHのためのコンパイラとして`arm-none-eabi-gcc`を使います．

今回は下記バージョンのものを使用します．

- [arm-none-eabi Version 6-2017-q2-update](https://developer.arm.com/tools-and-software/open-source-software/developer-tools/gnu-toolchain/gnu-rm/downloads/6-2017-q2-update)

Windows 10に対応するものは`-win32-sha2.exe`です．
下記画面の赤枠で示すように，どちらかからインストーラをダウンロードしてください．

[<img width="1302" alt="armnone-win.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/240349/1bd216cf-396b-3142-7034-2c92d9e255d4.png">](https://developer.arm.com/tools-and-software/open-source-software/developer-tools/gnu-toolchain/gnu-rm/downloads/6-2017-q2-update)

インストール時の設定はすべてデフォルトのままでOKです[^1]．
（「インストール先 フォルダ」は`C:\Program Files (x86)\GNU ARM Embedded\6 2017-q2-update`のままにしてください）
[^1]: 最後の`Add path to environment variable`もチェック無しでOKです）

## デバッガ環境

Visual Studio Codeと連携させるデバッガとしてOpenOCDを使います．
今回は下記バージョンのものを導入します．

- [OpenOCD 0.10.0-12-20190422](https://github.com/gnu-mcu-eclipse/openocd/releases/tag/v0.10.0-12-20190422)

下記画面の赤枠に示したように，`-win64.zip`をダウンロードしてください．

[<img width="1103" alt="openocd-win.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/240349/6efb0907-1043-affc-8501-ee57ea5f51a7.png">](https://github.com/gnu-mcu-eclipse/openocd/releases/tag/v0.10.0-12-20190422)

ダウンロードしたものを解凍し，下記のように`GNU MCU Eclipse`のフォルダを丸ごと`C:\Program Files`に配置してください．管理者権限が必要です．

![openocd.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/240349/608659c1-17ca-c939-df60-e2c0bc375caa.jpeg)


次に下記をダウンロードしてきて，

- https://raw.githubusercontent.com/takasehideki/asp3_gr_peach_vscode/master/asp3/target/gr_peach_gcc/renesas_rza1h_swd.cfg

`C:\Program Files\GNU MCU Eclipse\OpenOCD\0.10.0-12-20190422-2015\scripts\target` にコピーしてください．

![copy.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/240349/bbc863e3-c6b5-52e8-d7b4-c24fce18264c.jpeg)


## シリアル通信ドライバ

GR-PEACHのUSBポートをシリアルポートとして認識させるためのドライバをインストールします．
Windows向けのドライバは，以下のURLからダウンロードして実行してください．

- https://developer.mbed.org/handbook/Windows-serial-configuration

## シリアル通信ターミナル

GR-PEACHとのシリアル通信のためのターミナルエミュレータを導入します．

[TeraTerm](https://ja.osdn.net/projects/ttssh2/releases/)が使いやすくてオススメです．
お好みありましたら他のものでも構いません．

# Visual Studio Codeの準備

ようやっと本題ですぅ
そのくせ本題なのに短い，，，

## 本体のインストール

下記からダウンロードできます．

- https://code.visualstudio.com

すでにインストール済みの方は最新版にしましょう．本記事執筆時点では1.35.1です．

## 拡張機能のインストール

拡張機能は，左下にある歯車の上から３つめ「Extensions」（日本語化パッケージをすでに導入済みの方は「拡張機能」）から選べます．

![vscodeex.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/240349/751b85f6-483f-cdc9-62f1-be8fb45325d7.jpeg)

**「C/C++」**は必須でインストールしてください．

**「C++ Intellisense」**も入れておくと便利です．
日本語化したい方は**「Japanese Language Pack for Visual Studio Code」**もインストールすると良いでしょう．インストール後はVS Codeの再起動が必要です．
こんな感じになります．

![vscodeext.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/240349/fde8ceb6-cfbc-a8ed-7014-1afc9e533032.jpeg)

~~まぁ漢は黙ってVimですよねぇ！？？~~

ここまでの環境構築の手引きで分からないところがあれば，どしどしコメントください．


# さてRun!!

別記事にしました．下記をご参照ください．

- [VSCodeでTOPPERS/ASP3アプリをビルド＆実行する
](https://qiita.com/takasehideki/items/fa0a1a6567a22f469515)

特に下記で案内のIoTあるじゃんのハンズオンセミナーに参加したい！方は，[アプリのビルド](https://qiita.com/takasehideki/items/fa0a1a6567a22f469515#%E3%82%A2%E3%83%97%E3%83%AA%E3%81%AE%E3%83%93%E3%83%AB%E3%83%89)まで出来ることを確認してください．GR-PEACHお持ちの方は最後までできます．

# ハンズオンセミナー開催！

せっかく開発環境を整えたんだから使ってみたい！
ThingsだけじゃなくてInternet ofつまりIoTじゃね？？

そんなあなたに，こんなセミナーのご紹介です．

- [PinKitプレゼント付き！TOPPERSカーネル＋Azure IoT 体験ハンズオン@横浜](https://algyan.connpass.com/event/136354/)
    - 2019/07/27(土)　13:30 〜 18:00
    - 会場：情報科学専門学校６F


[![banner.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/240349/2de2a1a6-e6d1-622b-6bd4-06c70975fc3f.jpeg)](https://algyan.connpass.com/event/136354/)

TOPPERSとAzure IoT Hubを体験しよう！
しかもなんとPinKit(GR-PEARCH+センサーボード)をプレゼント！！

TOPPERSプロジェクトの運営委員として活躍する技術者と，Microsoftの専門家をお招きして，デバイスからクラウドまで一気通貫！のTOPPERS＋Azureアプリの開発を実際に学ぶことができます．
ぜひぜひどうぞです！！

# 開発コンテスト開催！

そして開発したIoTなシステム，ぜひともお披露目しませんか！？？

[![toppers](http://toppers.jp/imgs/logo.gif)](http://toppers.jp/contest.html)

TOPPERSプロジェクトでは「[活用アイデア・アプリケーション開発コンテスト](http://toppers.jp/contest.html)」を開催しています！
TOPPERSプロジェクトの開発成果物を活用するアイデア，もしくは開発成果物を用いたアプリケーションを募集します．
上記ハンズオンセミナーで学んだ知識を使って，IoT作品を開発して応募しませんか？

募集期間は9月1日までです． 
こちらもぜひどうぞ！！



# 参考ページ

- [MSYS2で快適なターミナル生活](https://qiita.com/Ted-HM/items/4f2feb9fdacb6c72083c)
- [MSYS2 +α - 構築手順・備忘録](https://qiita.com/yuukiyouki/items/a84c14240429e453428b)
- [VSCodeでTOPPERSのコードをgdbデバッグする](https://qiita.com/mitsu48/items/5c6fec6064af6c4a2c4e)