プログラムの書き込み
前回の記事では、自身のPC上に環境を構築してｽﾀｯｸﾁｬﾝにプログラムを書き込みました。
プログラムを書き込む方法は以下の2つがあります。
・PC上に環境を構築してプログラムをビルド・書き込む方法
自身のPC上にｽﾀｯｸﾁｬﾝの動作をプログラムできる環境を構築し、プログラムをビルド→書き込みを行います。プログラムを自由に改変してｽﾀｯｸﾁｬﾝに好きな動きをさせるにはこちらをオススメします。ただし、少し手間がかかります。
・Webブラウザ経由でビルド済みのプログラムを書き込む方法
既にビルド済みのデフォルトプログラムをｽﾀｯｸﾁｬﾝに書き込みます。自身のPC上に環境を構築する必要が無く簡単に書き込める一方、自身でプログラムを改変できません。プログラミングに馴れていない方の書き込みや動作確認目的とした場合、こちらの方法をオススメします。
今回は、2つ目の『Webブラウザからお手軽にプログラムを書き込む方法』をやってみましょう。
ｽﾀｯｸﾁｬﾝをwebブラウザから書き込む
環境構築
Webブラウザから書き込むため、前回のWSL2の準備のような環境構築は不要です。
PCのGoogle ChromeまたはMicrosoft EdgeのWebブラウザさえあれば、WindowsやUbuntu系などの様々なOSから手軽に書き込めます（スマホやタブレットのブラウザは未対応です）。
webページにアクセスする
ｽﾀｯｸﾁｬﾝのweb書き込みのページにアクセスします。
中央の青いボタンにより上の選択欄で『M5Stack CoreS3』を選んでください。
Web書き込みのページ（『M5Stack CoreS3』選択状態）
ｽｯｸﾁｬﾝとPCを接続して起動する
ｽﾀｯｸﾁｬﾝを画像の通りにPCと接続して起動してください。これは前回と同じですね。
ｽﾀｯｸﾁｬﾝが繋がっているポートを選択する
青いボタンを押すとUSBポートの選択肢が出るので、ｽﾀｯｸﾁｬﾝが繋がっているポートを選択してください。
接続したUSBポートの選択
書き込み開始
『Device Dashboard』の『INSTALL STACK-CHAN』を選択すると書き込みが開始されます。
書き込み開始
書き込みと起動！
それではｽﾀｯｸﾁｬﾝにプログラムを書き込みます。
web上のボタンをクリックすると書き込みが開始され、2~3分程度で書き込みが完了します。
書き込み中
書き込み完了！
書き込みが完了すると『Installation complete!』と表示されて起動します。
ｽﾀｯｸﾁｬﾝ・・・起動！！！！
前回と同じプログラムを書き込んでいるので、起動も前回と同じですね。
まとめ
書き込みと動作確認が完了して早くもクロージングです。
今回の記事は短かったですが、それだけ手軽に書き込めるということがお分かりいただけたでしょうか。前回の記事がよく分からなかったという人も、今回のweb書き込みで無事動かせますのでｽﾀｯｸﾁｬﾝを動かしつつ少しずつ学んでいくことができます。
裏側の仕組み（おまけ）
Webブラウザだけでマイコンのプログラムが驚くほど簡単に書き込めました。 今回紹介した「Web書き込み機能」は、RT版の元となったししかわ版で実装されています。主にWebSerial APIという技術と、それを元にしたesptool.jsというライブラリで実現されています。
WebSerial API
WebSerial APIは、Webブラウザがシリアルデバイスにアクセスできるようにするための新しいAPIです。ユーザはブラウザからUSBのシリアルポートを選択して、デバイスと通信することができます。
esptool.js
esptool.jsは、ESP32と通信を行うためのJavaScriptライブラリです。このライブラリは、Python版のesptoolを基にしており、WebSerial APIを使うことでブラウザ上から直接マイコンのフラッシュ操作を行うことができます。これにより、特別なソフトウェアをインストールすることなく、簡単にプログラムの書き込みが可能になります。
Web書き込み機能によって初心者でも簡単にｽﾀｯｸﾁｬﾝが始められます！
予約受付中
現在、『ｽﾀｯｸﾁｬﾝ アールティver.』は絶賛ご予約受付中です！
ｽﾀｯｸﾁｬﾝ アールティver. 組立キット
↓ 今回の記事で触れた製品はこちらです。
ｽﾀｯｸﾁｬﾝ アールティver. （完成品版）
↓同時に組立済みの完成品版ｽﾀｯｸﾁｬﾝも発売します。
