Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Azure Mobile Services と Azure Mobile Apps

1,367 views

Published on

AZUG福島 第一回 ~ゆるく、ふわっと始める Microsoft Azure 勉強会~
https://jazug.doorkeeper.jp/events/21078

にて使用したスライドです。

サンプルソースはこちら
https://github.com/nnasaki/shimaazu

Published in: Mobile
  • Be the first to comment

Azure Mobile Services と Azure Mobile Apps

  1. 1. Azure Mobile Services と Azure Mobile Apps - JAZUG福島 - 2015/4/4 Masaki YAMAMOTO @nnasaki
  2. 2. 自己紹介 2 Masaki YAMAMOTO Twitter:@nnasaki Microsoft MVP for Microsoft Azure
  3. 3. 最近あったこと 3
  4. 4. 4 無職と紹介される https://jazug.doorkeeper.jp/events/20654
  5. 5. 5 不発のエイプリルフール http://satoyasendai.com/
  6. 6. 今日の予定 6 モバイルサービスを使ってみる モバイルサービスとは チャットアプリ開発 プッシュ送信 ユーザーの動向を知りたい Mobile Engagement モバイルサービスの今後 Mobile App となにが違うの?
  7. 7. 必要なもの • Azure サブスクリプション • Android Studio – NOT Eclipse • Genymotion – 付属のエミュレーターは遅いのでオススメできません! – 実機で行うのが一番良い – Push通知が受け取れなかったりするので注意
  8. 8. モバイルサービスとは 8 プッシュ通知 数分以内に数百万台 タグ付け(合計1億件以上) マルチプラットフォームSDK iOS、Android、Windows、HTML5 認証連携 Facebook、Twitter、Google、Active Directory バックエンド C#、 NodeJS http://azure.microsoft.com/ja-jp/services/mobile- services/
  9. 9. DEMO ポータルからアプリを即実行 9
  10. 10. モバイルサービスの仕組み 10
  11. 11. http://channel9.msdn.com/Events/de-code/2014/SV-007
  12. 12. http://channel9.msdn.com/Events/de-code/2014/SV-007 今日使うところ
  13. 13. 今日の予定 13 モバイルサービスを使ってみる モバイルサービスとは チャットアプリ開発 プッシュ送信 ユーザーの動向を知りたい Mobile Engagement モバイルサービスの今後 Mobile App となにが違うの?
  14. 14. チャットアプリの開発 14
  15. 15. Why? 何故開発する?
  16. 16. 登場人物達
  17. 17. 登場人物達 デベロッパー(私) デベロッパー ユーザー ユーザー
  18. 18. グループで会話するとき
  19. 19. デベロッパー(私) デベロッパー ユーザー ユーザー
  20. 20. _人人人人人人人人人人人人_ > 今時まさかのメール! <  ̄Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y ̄
  21. 21. デベロッパー(私) デベロッパー ユーザー ユーザー @docomo.ne.jp @gmail.com ×
  22. 22. _人人人人人人人人人人人人_ > 迷惑メールブロック! <  ̄Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y ̄
  23. 23. デベロッパー(私) デベロッパー ユーザー ユーザー @docomo.ne.jp @gmail.com × 今時ありえん。 設定変えて
  24. 24. デベロッパー(私) デベロッパー ユーザー ユーザー @docomo.ne.jp @gmail.com × え?なにそれ わからんわ
  25. 25. デベロッパー(私) デベロッパー ユーザー ユーザー @docomo.ne.jp @gmail.com × Facebook とか Line に しよう
  26. 26. デベロッパー(私) デベロッパー ユーザー ユーザー @docomo.ne.jp @gmail.com × すまんが、娑婆に出られ ないのでSNSはちょっと …
  27. 27. デベロッパー(私) デベロッパー ユーザー ユーザー @docomo.ne.jp @gmail.com × アプリ作るか…
  28. 28. とまぁ、こんな軽いノリで始めた。
  29. 29. こんな感じにします
  30. 30. Githubにプロジェクト登録 • git追加 • .gitignore更新 • githubへプッシュ • https://github.com/nnasaki/shimaazu
  31. 31. レイアウト変更 • チェックボックス消す • 発言を下に持ってくる – listViewToDo layout:weight 1
  32. 32. Doneで入力できるように • 改行を禁止にする – android:autoText="false" – android:inputType="text” • ボタンイベントを追加する – setOnEditorActionListenerを追加 – EditorInfo.IME_ACTION_DONE で判定
  33. 33. 最新のチャットを確認したい • スクロールを常に下になるように – android:stackFromBottom="true” – android:transcriptMode="alwaysScroll"
  34. 34. 名前入力欄の追加 • 画面上部に名前入力欄のラベルとテキストボックスを追 加する – ActivityにmTextNewToDoと同様に追加 – ItemにmTextと同様に追加
  35. 35. 時間を表示したい • Mobile Services がデフォルトで持っている、 __createdAt を利用する – row_list_to_do.xml に LinearLayoutを追加 – 発言者と日付を用意する – ToDoItemに__createdAtのDateを追加 – ToDoItemAdapter にgetViewで情報取得を追加
  36. 36. こんな感じになりましたね?
  37. 37. サーバースクリプト修正なし • 名前のカラムを追加したのに何故?
  38. 38. サーバースクリプト修正なし • 名前のカラムを追加したのに何故? 動的スキーマ
  39. 39. これで解決したかと思いきや…
  40. 40. _人人人人人人人人人_ > 結局届かない! <  ̄Y^Y^Y^Y^Y^Y^Y^Y ̄ ×
  41. 41. 折り返し地点
  42. 42. プッシュ通知
  43. 43. プッシュ通知 • 基本チュートリアルをなぞっていきますが日本語訳が Android Studioに対応していないので古い • 英語と日本語の両方を見ていきます – http://azure.microsoft.com/ja- jp/documentation/articles/mobile-services-javascript- backend-android-get-started-push/ – http://azure.microsoft.com/en- us/documentation/articles/mobile-services-javascript- backend-android-get-started-push/
  44. 44. プッシュ通知 • Genymotionの場合受け取れない。 – 細工をすれば可能 – http://forum.xda- developers.com/showthread.php?t=2528952 • ARM Translation Installer v1.1 • Google Apps for Android をOSのバージョンに合わせて 入れる
  45. 45. Google Cloud Messaging を有効にする • Google Cloud Console Web でプロジェクト作成 – https://console.developers.google.com/project • Google Cloud Messaging for Androidを有効にする • APIキーを発行する
  46. 46. Mobile Services にAPIキーを入力する • APIキーをGCMに設定する
  47. 47. アプリケーションにプッシュ通知を追加す る • ここらへんから日本語が古い • Android SDKからダウンロード – Google APIs – Google Play services • ビルドのバージョンを合わせる。二つのファイルを合わ せること – gradle.build – AndroidManifest.xml
  48. 48. アプリケーションにプッシュ通知を追加す る • コードを修正する – uses-permissionを追加 • アプリ名を合わせる – receiver 登録 • アプリ名を合わせる – build.gradle に play services-baseを追加 – Activity に SENDER_IDをプロジェクト番号で追加 – MobileServiceClientをstaticにする
  49. 49. アプリケーションにプッシュ通知を追加す る • MyHandlerを追加 • サーバーのInsertを修正
  50. 50. 今日の予定 50 モバイルサービスを使ってみる モバイルサービスとは チャットアプリ開発 ユーザーの動向を知りたい Mobile Engagement モバイルサービスの今後 Mobile App となにが違うの?
  51. 51. Mobile Engagement 51
  52. 52. ユーザーの使用状況を把握できる • リアルタイムに使用状況がわかる • ユーザー数など統計がとれる
  53. 53. キャンペーンが打てる • 広告やキャンペーンの通知をプッシュ配信できる • 結果を確認できる
  54. 54. その他 • クラッシュやエラー解析 • まだ出たばかりでよくわからない • プレビュー申込が必要 • とにかくスゴイ安いので使ってみてください
  55. 55. Getting Started • とりあえずポータルで作成 • チュートリアルをやってみる – http://azure.microsoft.com/ja-jp/documentation/articles/mobile- engagement-android-get-started/ – 長いので Connecting your app to the Mobile Engagement backend の部分だけ
  56. 56. アプリを配布する • DeployGateを使用する • Google Play ではなくても配布可能 • 自己署名のアプリなので設定の変更が必要
  57. 57. アプリ配布方法 • Android Studio で Generate Signed APK で APK 作成 • できあがったAPKをDeployGateにドラッグアンドドロッ プ
  58. 58. アプリインストール方法 • 共有リンクを作成する • DeployGateをインストールする • 自作したapkをインストールする
  59. 59. 適当に文字をうっててください。 目標はみんなで100行!!
  60. 60. サーバースクリプトの修正 function read(query, user, request) { // query.take(1000); // request.execute(); var countSql = "SELECT COUNT(Id) count FROM TodoItem"; mssql.query(countSql, { success: function(results) { var skipCount = results[0].count - 50 query.orderBy('__createdAt').skip(skipCount).take(50); request.execute(); } }); }
  61. 61. 今日の予定 61 モバイルサービスを使ってみる モバイルサービスとは チャットアプリ開発 ユーザーの動向を知りたい Mobile Engagement モバイルサービスの今後 Mobile App となにが違うの?
  62. 62. モバイルサービスの今後 62
  63. 63. Mobile Appとは • モバイルサービスの新バージョン • アプリ サービスの一つ • 他のアプリサービスとの連携が簡単 • 移行途中なのでモバイルサービスであった機能が無い – QuickStart の Android版 – JavaScript バックエンド • 料金体系が異なる
  64. 64. モバイルサービスなくなっちゃうの? • 今後も継続してサポートすることが宣言されている – http://azure.microsoft.com/en- us/documentation/articles/app-service-changes-existing- services/ 64
  65. 65. すぐに移行すべき? • .NET バックエンドを使っている人は移行が簡単なので、 可能であれば移行した方が良い – ただし、料金には気をつけて! • JavaScript バックエンドの人はまだ対応されていないの で様子見 65 中の人が 鋭意対応中
  66. 66. 66 料金、お高いんでしょ?
  67. 67. 67 無料から使えます http://azure.microsoft.com/ja-jp/pricing/details/mobile-services/
  68. 68. Mobile Services Notification Hubs Mobile Services Notification Hubs Windows ストア iOS Android Xamarin PhoneGap Sencha Windows Phone iOS Android HTML 5/JS クライアント 送信データ転送(Outbound data transfer) 料金について • Mobile Services、Notification Hubsはサービス料金に含まれる • 言い換えれば、http://azure.microsoft.com/ja- jp/pricing/details/data-transfers/ の料金は別途かからない Included Included Includedincluded(*1) *1) 同じリージョン内であれば、そもそも無料
  69. 69. モバイルサービスの使用条件について • 例えば、Standardレベルで500GBを超えてしまった場合、サービ スは即使用出来なくなる • 送信データが超えそうになったらユニット数を上げれば良い
  70. 70. 告知 70
  71. 71. Global Azure BOOTCAMP 2015 71
  72. 72. Global Azure BOOTCAMP 2015 • 日時 4/25(土) • 場所:東京(gloopsさん) • 学生向け – https://jazug.doorkeeper.jp/events/22795 • 一般向け – https://jazug.doorkeeper.jp/events/22782 72
  73. 73. ご清聴ありがとうございました 73

×