MonacaEducationデモンストレーション

124 Views

June 10, 21

スライド概要

profile-image

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

関連スライド

各ページのテキスト
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 メール:education@asial.co.jp https://edu.monaca.io/ Copyright © Asial Corporation. All Right Reserved. 18