[JavaScript, Mobile] How to Deploy and Debug AngularJS on the Android Device

原文はこちら。
https://blogs.oracle.com/geertjan/entry/how_to_deploy_angularjs_to

---

新しいAndroid、Android 4 (Ice Cream Sandwich) を購入し、（エミュレータではなく）実際のAndroidデバイスにNetBeans IDEからAngularJSアプリケーションをChrome Browserにデプロイし、デバイス上でアプリケーションをデバッグして整えました。つまり、エミュレータではなくAndroid自身のChromeブラウザで実施した、ということです。

Introducing Android 4.0
http://www.android.com/about/ice-cream-sandwich/

NetBeans IDEのHTML/JavaScript/CSSアプリケーションを右クリックして実行します。ツールバーでドロップダウンし、USBでコンピュータとつながっているAndroidデバイスのChromeブラウザにデプロイしたいアプリケーションを指定します。USBデバッグのスイッチをONにしておきましょう。もしくは、プロジェクトプロパティダイアログを使ってプロジェクト毎に実施しましょう。これで必要な作業は終了です。NetBeans IDEがアプリケーションをAndroidデバイスのChromeブラウザにデプロイします。デバイスであれエミュレータであれ、たった1クリックだけです。Androidデバイス上のアプリケーションはエミュレータのアプリケーションを見るよりもずっと素敵だと申し上げなければなりません。さらに、ずっと高速でもあります。Genymotionよりも高速でさえあります。

YouTube: Dream Team = Genymotion, Cordova, and NetBeans IDE
https://blogs.oracle.com/geertjan/entry/youtube_dream_team_genymotion_cordova

こちらがデバイスにデプロイしたアプリケーションです（もちろんAngularJSです。AngularJSはHTML/JavaScript/CSSの将来像であると思わずにはいられないのです。本当にすばらしい）。新しいNetBeansプラグインとして統合されているDroid@Screenを使っているため見ることができます。ここでご覧頂いているように、NetBeans IDEに直接組み込まれるように仕上げました。

Droid@Screen
http://droid-at-screen.ribomation.com/Droid@Screen - plugin detail
http://plugins.netbeans.org/plugin/51818/?show=true

Droid@Screen （上図はNetBeans IDEにプラグインとして組み込まれたもの、下図は別のアプリケーションとしての図）はAndroidデバイスに接続すると、（例えば、コンファレンスで）モノをグループに見せる時に、手に持っているデバイス上に出ているものを手軽に見せることができます。

ここでも、エミュレータをご覧にただいるわけではないことにご注意下さい。そうではなく、Androidデバイス上で見ているものの1対1の投影をご覧頂いているのです。つまり、物理的宇宙で質量と存在感を持つ、同じ実際のデバイスです。現実の世界で購入したものです。

そして、すぐ一つ上のスクリーンショットで、Droid@Screenでご覧頂けるように、Androidデバイスで描画されている、ブラウザのDOMウィンドウの特定のアイテム上にマウスがあることがわかります。非常にクールです。マウスを上下に動かすと、IDEにライブでDOMが表示され、現在選択されている項目が手の中のAndroidデバイスの背後にあるIDEで見ることができます。また、Androidにデプロイされたアプリケーションを見たり、色などをIDEで調整したり、すぐにAndroid上で変更を確認したりできます。それは、IDEに保存した内容で、IDEからAndroid上のブラウザを更新させるからです。

続いて上図では、JavaScript、つまり作成したAngularJSのコードをステップ実行できる様子をご覧頂いていますが、このようにAndroidで起こっている描画をDroid@Screenを目で見て確認できます。コンファレンスやプレゼンテーションでは、実際のAndroidデバイス上に描画されるものを表示する目的でご覧になることでしょう。
ここまでご覧いただいた内容は全て今すぐ始めることができます。しかも無料です。NetBeans IDE 7.4をダウンロードしインストールしていれば、ね。

NetBeans IDE 7.4 ダウンロード
https://netbeans.org/downloads/

この内容の詳細を含めて、来週のアムステルダムで開催されるDroidConで披露する予定です。この件については操縦にYouTubeに動画もUpする予定です。

DroidCon NL 2013
http://www.droidcon.nl/