AngularJS x Chrome Apps (2014.08.23 #gdgkobe event)

AngularJS x Chrome Apps (2014.08.23 #gdgkobe event)

• 1.
  Tada Satoshi 2014.08.23AngularJS勉強会#2 by GDGKobe
• 2.
  ただ さとし Twitter: @pinmarch_t Facebookアプリ開発の本 書いたりしてました(数年前) Bioinformatics関係の仕事しています (Perl, R, RStudio, etc.) 日常(業務)ではjQuery使ってます
• 3.
  AngularJSってデータバインド以外にも、 ルーティングの機能があるのは大きい！ (前回の勉強会での感想) サーバーに依存せず画面遷移ができる サーバー立てるの、めんどくさいなあ
• 4.
  AngularJSってデータバインド以外にも、 ルーティングの機能があるのは大きい！ (前回の勉強会での感想) サーバーに依存せず画面遷移ができる サーバー立てるの、めんどくさいなあ python -m SimpleHTTPServer 8080 とか、打つの？
• 5.
  AngularJSってデータバインド以外にも、 ルーティングの機能があるのは大きい！ (前回の勉強会での感想) サーバーに依存せず画面遷移ができる サーバー立てるの、めんどくさいなあ あ、Chrome AppsでHTMLアプリできる
• 6.
  ChromeアプリとChrome拡張 (Extension) Chromeアプリ Chrome拡張
• 7.
  Chrome Web Storeからインストール Chrome Dev Editor
• 8.
  Chromeアプリ = InstallableWeb Apps Hosted Apps ▪外部のWebサイトにジャンプさせる ▪“Backgroundページ”を生成可能 ▪“Background scripts”を実行可能 = ウィンドウタイプができる ▪Chrome APIsを利用可能 Packaged Apps ▪Offline = ローカルでWebアプリを機能させる Extension ▪ツールバーやアドレスバーに追加機能を与える Chrome Web Storeで公開、課金が可能
• 9.
  AngularJSを活かせるのはPackaged Apps こんな感じ
• 10.
  開発中Chromeアプリのインストール (Chromeへの追加のしかた) 1.デベロッパーモードにチェック 2. パッケージ化されていない拡張機能を読み込む でフォルダを選択
• 11.
  Chrome Appsに必要なファイル manifest.json– 起動する際の設定 manifest_version は2 必要に応じて permissions を追加 アプリ一覧に出すアイコン画像(128x128)を指定 app.launch.local_path に最初の画面を指定 * Hosted Apps だと app.launch.web_url を指定
• 12.
  Google Chart APIsを使ってみ…ようとしたhttp://bouil.github.io/angular-google-chart/#/fat
• 13.
  Google Chart ToolsDirective Moduleを表示 https://github.com/pinmarch/sample.chrome.apps/tree/2014-08-23-gdgkobe 時刻を表示するController ルーティングでビューを切り替え ng-view
• 14.
  AngularJSはローカル環境でも便利 ローカル(オレオレ)環境ならChrome Apps 管理コンソールとかならChrome Web Store に公開してもいい Chrome Apps 使っていきませんか
• 15.
  APIの名前空間 chrome.* (ex.chrome.alarms) https://developer.chrome.com/apps/api_index Stable APIs alarms, app.runtime, app.window, commands, contextMenus, events, filesystem, gcm, i18n, identity, idle, mediaGalleries, notifications, permissions, power, pushMessaging, runtime, serial, socket, sockets.tcp, sockets.tcpServer, sockets.udp, storage, syncFileSystem, system.cpu, system.display, system.memory, system.network, system.storage, tts, types, usb Beta APIs accessibilityFeatures, bluetooth, bluetoothLowEnergy, bluetoothSocket Dev APIs audio, copresence, hid, location, wallpaper Experimental APIs