MonacaEducationデモンストレーション

タグ
スライド概要

profile-image

岡本 雄樹

@monaca

作者について:

アシアル情報教育研究所・所長の岡本雄樹です。

スライド一覧
シェア

※このスライドは限定公開です。一般公開されていないためご注意ください

埋め込む

作成日

2021-06-10 15:50:32

各ページのテキスト

1. Monaca Education デモンストレーション アシアル情報教育研究所 岡本 雄樹 https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. 1

2. 献本のご依頼・ありがとうございます https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. 2

3. Monacaとは

4. Monacaとは スマホやタブレットアプリが作れます https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. 4

5. Monacaの特徴 ブラウザだけで動作するクラウドIDE(統合開発環境) メニューバー (さまざまな機能を呼び出せます) コードエディター (ファイルの編集を行います) プロジェクトパネル (ファイルの管理などを行 います) デバッグパネル (エラー情報などを表示します) https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. ライブプレビュー (動作確認を行います) 5

6. Monacaの特徴 作品が手元のスマホやタブレットで動き出す! 端末のセンサーを活用でき、中学技術の計測と制御にも最適 QRコードの読み込みにも対応 https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. 6

7. 【デモ】Monacaでブロック崩し体験

8. 教育版公式サイト URL にアクセス https://edu.monaca.io/ https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. 8

9. Monaca のアカウント登録 https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. 9

10. プラン選択 https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. 10

11. ダッシュボード • 開発中のアプリはプロジェクト単位で管理します • 新しいプロジェクトを作ると一覧に並びます https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. 11

12. 新しいプロジェクトを作る • 今回は「ブロック崩し」を選択して作ってみましょう • プロジェクト名は自由に設定できます https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. 12

13. プロジェクトを開く • 一覧からプロジェクトを選択して下さい • 「クラウドIDEで開く」を選択して下さい TIPS 無限ループなどで開けなくなったプ ロジェクトはセーフモードで開けます。 https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. 13

14. MonacaIDE(統合開発環境) • ファイル管理・編集・動作確認などを行えます メニューバー エディター プロジェクトパネル デバッグパネル プレビュー https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. 14

15. フォルダとファイルを開く プロジェクトパネルのファイルツリーを操作して下さい フォルダの▶を クリック ファイルを ダブルクリック https://edu.monaca.io/ エディタ側の タブが開きます Copyright © Asial Corporation. All Right Reserved. 15

16. プログラムの変更(玉の数を増やす) • ブロック崩しプログラムの本体は「main.js」ファイルです • プロジェクトパネルのファイルツリーからmain.jsを探して「ダブ ルクリック」して下さい • 5行目の変数SETTINGS_BALL_NUMを1000に「修正」して 下さい • main.jsの変更を「保存」して下さい。 • プレビュー上の玉の数が増えれば成功です https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. 16

17. 玉が増えれば成功 「保存」はボタンかショートカットキー(Ctrl + s) https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. 17

18. ご不明点がございましたらこちらまで 電話 :03-3868-0670 メール:[email protected] https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. 18