MakeCodeエディターは、
ブラウザベースで利用できる
micro:bit（マイクロビット）の開発環境のひとつです。
あらかじめ用意されたブロックを
つなぎ合わせてプログラミングすることが
できるので直感的に操作でき、
プログラムの内容も理解しやすいのが特徴。
今回は、MakeCodeエディターの基本的な使い方をまとめました。
MakeCodeエディターを開く
MakeCodeエディターのサイトにアクセスし、
ホーム画面を表示します。
ホーム画面を表示する
- ブラウザ（EdgeやGoogle Chrome、Safariなど）を起動する。
- MakeCodeエディターのサイトにアクセスする。
- MakeCodeエディターのホーム画面が表示される。
ホーム画面の見かた
マイプロジェクト
新しくプログラムを作る時、
「新しいプロジェクト」をクリックします。
新しいプロジェクトの右側には、
ブラウザに保存されているプログラムが表示されます。
さらに下の方にはチュートリアルがあります。
「読取」ボタン
パソコンに保存した.hexファイルや、
公開されたプロジェクトの共有URLから
プログラムを読み取ります。
プログラミング画面
プログラミング画面を表示する
- ホーム画面で、「新しいプロジェクト」をクリックする。
- プロジェクト名を入力し、「作成」ボタンをクリックする。
- プログラミング画面が表示される。
保存されているプログラムをクリックすると
続きからはじめることができます。
プログラミング画面の見かた
・プログラミングエリア
プログラムをつくる場所です。
・ツールボックス
プログラミングで使うブロックが
機能別に分類され、置かれています。
・シミュレーター
作ったプログラムの動きを画面上で確認する場所です。
・「ダウンロード」ボタン
プログラムをマイクロビットに転送します。
・プロジェクト名、「保存」ボタン
プログラムの名前を入力して
「保存」ボタンをクリックすると
プログラムをパソコン上に保存します。
・エディター切り替え
プログラムの表示をブロック⇔JavaScriptで切り替えます。
・「共有」ボタン
プロジェクト（プログラム）をクラウドに保存し
インターネット上に公開します。
・「ホーム」ボタン
ホーム画面へ戻ります。
プログラムを作る
ホーム画面からプログラミング画面を表示します。
最初から「最初だけ」「ずっと」のブロックが
置かれていますが、必要ない場合は消しましょう。
ブロックの消し方
または
ブロックをツールボックスへドラッグアンドドロップする。
ブロックを組み立ててプログラミング
ツールボックスから必要なブロックを
ドラッグアンドドロップで
プログラミングエリアに持ってきて
プログラムを組み立てます。
「作業を元に戻す」「元に戻した作業のやり直し」ボタン
プログラミングエリアを
１つ前の状態に戻したり、
戻したことを取り消したりします。
「エリアの拡大表示」「縮小表示」
プログラミングエリアを大きく表示したり（拡大）、
小さく表示したり（縮小）します。
エディター切り替え
エディター切り替えボタンで
プログラムの表示を
ブロックとJavaScriptで切り替えることができます。
最初はブロックが選ばれている状態です。
JavaScriptでどう書くのか知りたい場合や
JavaScriptでコーディングしたい場合以外は
とくにさわる必要はありません。
シミュレーターで確認する
マイクロビットへ転送する前に、
シミュレーターで思った通りに動くかテストしましょう。
マイクロビット画像の
Aボタン・Bボタンをクリックすると、
ボタンがおされたときの動きを確認できます。
センサーを使った場合は、
テストできるようにコントローラーが出てきます。
シミュレーターの下にあるボタンの機能
- 停止／開始
- シミュレーターを再起動する
- スローモーション
- オーディオをミュートにする／ミュートの解除
- 全画面表示にする
プログラムをマイクロビットに転送する
パソコンとマイクロビットを接続する
こちらの記事を参考にしてください。
ダウンロード
「ダウンロード」ボタンをクリックすると
プログラムがコンパイルされ、.hexファイルに変換されます。
プログラム言語をコンピュータが理解できる言語に変換することです。
.hexファイルを「MICROBIT」ドライブに保存することで
プログラムをマイクロビットに書き込むことができます。
使っているブラウザや設定によって多少手順がちがうので、
ブラウザ毎の転送の手順はこちらを参考にしてください。
Windows10専用アプリの場合、
「ダウンロード」ボタンをクリックすると、
プログラムが直接マイクロビットに書き込まれます。
プログラムの転送中は、裏の黄色いLEDが点滅します。
転送が完了すると、プログラムが自動的に実行されます。
この時、「MICROBIT」ドライブから
ファイルが消えたように見えますが正常です。
プログラムを保存する
プログラムは、Cookie（クッキー）という仕組みを使って
自動的にブラウザに保存されています。
Webサイトがブラウザを通じてユーザーのコンピュータに
データを一時的に保存させる仕組みのことです。
同じパソコン・同じブラウザを使えば、続きを作ることができますが
別のパソコンで続きを作りたい場合は不便です。
また、Cookieはずっと保存されているものではなく
ブラウザのキャッシュと一時ファイルをクリアすると消えてしまうので
プログラムはパソコン上に保存しておくことをオススメします。
プロジェクト名を入力し、
「保存」ボタンをクリックすると
パソコン上に.hexファイルを保存することができます。
「保存」で保存された.hexファイルも
「MICROBIT」ドライブへドラッグ＆ドロップすることで
マイクロビットへ転送することができます。
プログラムを共有する
「共有」ボタンをクリックすると、
プロジェクト（プログラム）はクラウドに保存されます。
- 「共有」をクリックする。
- プロジェクトの名前を入力する。
- 「プロジェクトを公開する」をクリックする。
- 共有URLが表示される。
共有URLがあれば、
ホーム画面の「読込」ボタンから
誰でもプロジェクトを見ることができます。
プログラムを読み込む
「読取」ボタンをクリックすると
パソコン上に保存した.hexファイルや
共有URLからプロジェクトを読み込むことができます。
.hexファイルを読み込む
- 「読取」をクリックする。
- 「ファイルを読む…」をクリックする。
- 「ファイル選択」をクリックし、ファイルを選択する。
- 「つづける」をクリックする。
公開されたプロジェクトを読み込む
- 「読取」ボタンをクリックする。
- 「URLからの……」をクリックする。
- 共有URLを入力し、「つづける」をクリックする。
プログラムを削除する
「歯車」ボタンをクリックして、
「プロジェクトを削除する」を選ぶと
現在表示されているプロジェクトを削除できます。
まとめ
MakeCodeエディターの使い方について紹介しました。
ホーム画面にあるチュートリアルは、
MakeCodeエディターでのプログラミングの方法や
マイクロビットの機能が一通り分かるので、
まず一通りやってみることをオススメします。
