Empfohlen
Weitere ähnliche Inhalte
Was ist angesagt?
Was ist angesagt? (20)
Ähnlich wie Visual Studio App Centerを公式サンプルアプリから学ぼうiOS(swift),Android(java)
Ähnlich wie Visual Studio App Centerを公式サンプルアプリから学ぼうiOS(swift),Android(java) (20)
Mehr von Shinya Nakajima
Mehr von Shinya Nakajima (17)
Kürzlich hochgeladen
Kürzlich hochgeladen (10)
Visual Studio App Centerを公式サンプルアプリから学ぼうiOS(swift),Android(java)
- 1. Visual Studio App Centerを 公式サンプルアプリから学ぼう iOS(Swift), Android(Java) 2018/01/20 JXUGC #24 春の App Center 祭り なかしょ（中島進也）
- 2. Profile • 名前：なかしょ（中島 進也） • Twitter：@nakasho_dev • ブログ：なかしょの技術日誌 http://nakasho-dev.hatenablog.jp/ • 最近の興味 TDD、アジャイル開発、Xamarin、Chatbot、Tizen • 主な参加コミュニティ JXUG、.NETラボ、Cogbot ※本資料は私個人の意見であり、所属企業・部門見解を代表するもの ではありません。 2
- 5. サンプルアプリを通じて分かること • SDKの組み込み方 • ビルド方法 • テストの方法 • 配信方法（ad-hoc配布、iTunesConnect配布） • クラッシュログの取得方法 • イベントログの残し方 • Push通知の方法 5https://github.com/Microsoft/appcenter-sampleapp-ios-swift
- 6. サンプルアプリの流れ 6 Getting Started Build Test Distribute Crashes Analytics Push
- 7. Getting Started • GitHubのアカウントを作成し以下のリポジトリをフォーク • https://github.com/Microsoft/appcenter-sampleapp-ios-swift • フォークしたリポジトリをローカルにClone • 例：git clone https://github.com/nakasho-dev/appcenter-sampleapp-ios-swift.git 7https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/getting-started ここをクリック
- 8. Getting Started • AppCenterにサインイン • https://appcenter.ms/create-account • 以下のアカウントが使用可能 • GitHub • Microsoft • Facebook • Google 8https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/getting-started
- 9. Getting Started • 新規アプリを登録 • Add New ⇒ Add New App • OSはiOSを選択 • PlatformはObjective-C/Swiftを選択 • 作成後ポータル画面に遷移 9https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/getting-started ポータル画面では最初 にやるべきことが書い てある
- 10. Getting Started - CocoaPodsの使用 10https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/getting-started Cloneしたプロジェクトの ディレクトリに移動し、以下を実施 １．Podfileの初期化 $ pod init ２．Podfileに以下を記述 pod 'AppCenter’ pod 'AppCenter/Push' ３．指定したライブラリを適用 pod install CocoaPodsを入れていなかったら以下のコマンドでインストール $ sudo gem install cocoapods サンプルアプリではPodfile を作成済み $pod installのみでOK Carthageに 対応していません
- 11. Getting Started - App Secretの置換 11https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/getting-started ポータル画面では表示されているApp SecretをAppDelegate.swift内にある <APP SECRET HERE>と置換する サンプルアプリでは以下 の宣言も追加されている import AppCenterPush サンプルアプリでは以下 も追加されている MSPush.self 公開リポジトリで管理するのであれば AppSecretは埋め込むのは厳禁
- 12. Getting Started – 証明書の準備 • Apple Developer Programの証明書を準備すると以下が可能となる。 • Test • Destribute • Push • 証明書なしでできること • Build（ XCTest 含む） • Clashes • Analytics 12https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/getting-started
- 15. Build – GitHubとの連携 • 自分が編集したソースをGitHubへPush $ git add . $ git commit –m ‘App Secret を変更’ $ git push • アプリポータル画面からビルドを選択してGitHubを選択 15https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/build
- 16. Build – GitHubとの連携 • GitHubへのログインをおこない、対象のリポジトリを選択 16https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/build
- 17. Build – GitHubとの連携 • ブランチの一覧が表示されるのでmasterを選択 17https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/build
- 18. Build – ビルド設定（１／２） • Project/Workspace • Shared Scheme • XCode version • Build Script • 固定名のファイルを含めることで有効となる • Build frequency • Pushごとにビルドするか否か • Automatically increment build number • ビルドごとにビルド番号を増加させるか否か • Run XCTest tests • ビルド時にXCTestをおこなうか否か 18https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/build
- 19. Build – ビルド設定（２／２） • Environment variables • 環境変数を設定しビルドに反映できる • リポジトリに含められないものはここで管 理すべき • Sign builds • ビルド時に署名を付与するか否か • Test on a real device • 実機テストを実施するか否か • Distribute builds • ビルドを配信するか否か • Advanced • ビルドステータスバッジの有無 19https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/build
- 20. Build – Sign builds 署名設定 • プロビジョニングプロファイルとp12ファイルを登録することで 証明書の署名が可能となる 20https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/build プロビジョニングプロファイルやp12ファ イルが正常でないと以下のような警告が出 て登録できない
- 21. Build – ビルド状態表示 21https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/build • 設定後、ビルドを走らせると以下のようにビルド状態を表示 Downloadボタンから以下 がダウンロード可能 ・Build ・Symbols ・logs
- 23. Test – ローカル端末で準備 • AppCenterCLIのインストール $ npm install -g appcenter-cli • AppCenterにログイン $ appcenter login • プロジェクトフォルダに移動し てderivedDataPathを削除 $ rm -rf ddp • テスト用フォルダを作成 $ xcrun xcodebuild build-for-testing - configuration Debug -workspace sampleapp- ios-swift.xcworkspace -sdk iphoneos -scheme sampleapp-ios-swift -derivedDataPath ddp 23https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/test Node.js6.3以上の環境で以下を実行 Loginコマンドでブラウザが開くので AppCenterにログインして上記のコー ドをコピーし、端末に貼り付ける このパラメータで指定したパス(ddp)が重要
- 24. Test – 端末の選択 • 以下を選択 • 機種 • OS 24https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/test 今回は iPhone7 Plus iOS 11.2.2 を 選択
- 25. Test – 設定 • 以下を選択 • Test Series • システム言語 • Test framework 25https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/test 今回のサンプルアプリではXCUITest 用のテストが用意されているので、 それを選択する。
- 26. Test – 実行 • プロジェクトのフォルダで 画面上に出ているテストコ マンドを実行する。 • 「pathToXCUItestBuildFol der」を 「 ddp/Build/Products/De bug-iphoneos」に置換して 実行する。 26https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/test
- 28. Test – テスト結果 28https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/test ぐぬぬぬ CocoaPodsの失敗が影響 かも？ クリックで詳細ログが表示さ れる
- 29. Test – テスト結果詳細 29https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/test 端末情報の詳細が表示 ログ詳細が表示
- 32. Distribute • iOSの配信方法は３つ グループ配信 App Centerによる配信 Ad-Hoc証明書が必要 登録したユーザにメールで通知 iTunesConnectによる配信 Production証明書が必要 TestFlight用の配信 AppStore用の配信 Intune Company Portal用の配信 32https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/distribute
- 39. Distribute – ストア配信 39https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/distribute iTuneConnectを選 択 Publish to TestFlight をクリック
- 40. Distribute – ストア配信 40https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/distribute IPAファイルのアッ プロード アップロード内容を確 認 リリースノートを記述 確認してPublish
- 45. Crashes – クラッシュ情報取得 • 登録方法はAppDelegateに以下のコードを追加するのみ。 • クラッシュ情報がAppCenterに送信されるのはアプリ再起動後。 • テストのため意図的にクラッシュさせるAPIが用意されている。 45 https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/crashes
- 47. Push • Pushの実現に必要な条件 ワイルドカードではないProduction証明書 Pushの許可を有効にすること Push 通知用のサービスキー アプリのビルドでCapabilitiesのPush通知をON アプリのソースにAppCenter/Pushを組み込む Podfileに 「pod ‘AppCenter/Push’」を追加 AppDelegateでMSPush.selfを追加 47https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/push
- 48. Push – 認証情報を登録 48 https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/push Key IDを登録 PrefixとIDを登録 Keyファイルにある Tokenを登録
- 50. Push – オーディエンスについて • オーディエンスは以下の属性から選択可能 App Version Country MobileCarrier Language DeviceModel OEM Device OS Version Screen Size 50https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/push App Versionはアプリの バージョンアップ時に、 旧バージョンを使っている ユーザへアップデートを促 す際に非常に有効
- 51. Push – 送信 • 各画面で登録した情報が表示 • 確認して「Send notification」 をクリック 51https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/push
- 52. Push – 履歴一覧 • 送信状況が一覧で確認できる 52https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/push
- 53. iOSまとめ • アプリへの組み込みのポイント CocoaPodsの導入、Podfileの編集 AppDelegateへの初期化処理の追加 各イベントログ対象時のイベントの埋め込み • クラッシュログが送信されるのは再起動後 • ストアへの配信はIPAファイルのアップロードのみ リポジトリからやりたいなぁ • 実機テストはローカル側の設定に一癖ありそう 53
- 55. サンプルアプリを通じて分かること • SDKの組み込み方 • ビルド方法 • テストの方法 • 配信方法（APK配布、GooglePlay配布） • クラッシュログの取得方法 • イベントログの残し方 • Push通知の方法 55https://github.com/Microsoft/appcenter-sampleapp-android
- 56. サンプルアプリの流れ 56 Getting Started Build Test Distribute Crashes Analytics Push
- 57. Getting Started • GitHubのアカウントを作成し以下のリポジトリをフォーク • https://github.com/Microsoft/appcenter-sampleapp-android • フォークしたリポジトリをローカルにClone • 例：git clone https://github.com/nakasho-dev/appcenter-sampleapp-android.git 57https://docs.microsoft.com/en-us/appcenter/quickstarts/android/getting-started ここをクリック
- 58. Getting Started • AppCenterにサインイン • https://appcenter.ms/create-account • 以下のアカウントが使用可能 • GitHub • Microsoft • Facebook • Google 58https://docs.microsoft.com/en-us/appcenter/quickstarts/android/getting-started
- 59. Getting Started • 新規アプリを登録 • Add New ⇒ Add New App • OSはAndroidを選択 • PlatformはJavaを選択 • 作成後ポータル画面に遷移 59https://docs.microsoft.com/en-us/appcenter/quickstarts/android/getting-started ポータル画面では最初 にやるべきことが書い てある
- 60. Getting Started - App Secretの置換 60https://docs.microsoft.com/en-us/appcenter/quickstarts/android/getting-started ポータル画面で表示されているApp SecretをMainActivity内にある<APP SECRET HERE>と置換する 公開リポジトリで管理するのであれば AppSecretは埋め込むのは厳禁
- 61. Getting Started – 証明書の準備 • 実機にAPKをインストールするためには証明書が必要 • Build > Generate Signed APKで証明書を作成 61https://docs.microsoft.com/en-us/appcenter/quickstarts/android/getting-started
- 62. Build – GitHubとの連携 • 自分が編集したソースをGitHubへPush $ git add . $ git commit –m ‘App Secret を変更’ $ git push • アプリポータル画面からビルドを選択してGitHubを選択 62https://docs.microsoft.com/en-us/appcenter/quickstarts/android/build
- 63. Build – GitHubとの連携 • GitHubへのログインをおこない、対象のリポジトリを選択 63https://docs.microsoft.com/en-us/appcenter/quickstarts/android/build
- 64. Build – GitHubとの連携 • ブランチの一覧が表示されるのでmasterを選択 64https://docs.microsoft.com/en-us/appcenter/quickstarts/android/build
- 65. Build – ビルド設定（１／２） • Android Module • Build Variant • Build Script • 固定名のファイルを含めることで有効と なる • Build frequency • Pushごとにビルドするか否か • Automatically increment build number • ビルドごとにビルド番号を増加させるか否か • Run XCTest tests • ビルド時にXCTestをおこなうか否か • Lint source code • コードの静的解析(Lint)をおこなうか否か 65https://docs.microsoft.com/en-us/appcenter/quickstarts/android/build
- 66. Build – ビルド設定（２／２） • Environment variables • 環境変数を設定しビルドに反映できる • リポジトリに含められないものはここ で管理すべき • Sign builds • ビルド時に署名を付与するか否か • Test on a real device • 実機テストを実施するか否か • Distribute builds • ビルドを配信するか否か • Advanced • ビルドステータスバッジの有無 66https://docs.microsoft.com/en-us/appcenter/quickstarts/android/build
- 67. Build – Sign builds 署名設定 • Gradle内で署名はできるが、こ こで署名をした方がセキュア 67https://docs.microsoft.com/en-us/appcenter/quickstarts/android/build
- 68. Build – ビルド状態表示 68https://docs.microsoft.com/en-us/appcenter/quickstarts/android/build • 設定後、ビルドを走らせると以下のようにビルド状態を表示 Downloadボタンから以下 がダウンロード可能 ・Build ・logs
- 69. Test – ポータル 69https://docs.microsoft.com/en-us/appcenter/quickstarts/android/test ビルドの設定で「Test on a real device」を有効にしていたらテストが 成功していた。
- 70. Test – ローカル端末で準備 • AppCenterCLIのインストール $ npm install -g appcenter-cli • AppCenterにログイン $ appcenter login • プロジェクトフォルダに移動し てテスト用APKを作成 $ ./gradlew assembleDebug $ ./gradlew assembleDebugAndroidTest 70https://docs.microsoft.com/en-us/appcenter/quickstarts/android/test Node.js6.3以上の環境で以下を実行 Loginコマンドでブラウザが開くので AppCenterにログインして上記のコー ドをコピーし、端末に貼り付ける
- 71. Test – 端末の選択 • 以下を選択 • 機種 • OS 71https://docs.microsoft.com/en-us/appcenter/quickstarts/android/test 今回は Google Pixel 2 XL Android 8.1.0 を選択
- 72. Test – 設定 • 以下を選択 • Test Series • システム言語 • Test framework 72https://docs.microsoft.com/en-us/appcenter/quickstarts/android/test 今回のサンプルアプリではEspresso 用のテストが用意されているので、 それを選択する。
- 73. Test – 実行 • プロジェクトのフォルダで 画面上に出ているテストコ マンドを実行する。 • 「pathToEspressoBuildFol der」を「sampleapp- android/app/build/outputs /apkに読み変える。 • 「 pathToFile.apk」を 「app-debug- androidTest.apk」に置換し て実行する。 73https://docs.microsoft.com/en-us/appcenter/quickstarts/android/test
- 74. Test – テストすら実行されない 74https://docs.microsoft.com/en-us/appcenter/quickstarts/android/test ぐぬぬぬ • エラー文：The same apk was uploaded as app and test ビルド時の同時実行では成功していたのに．．．
- 75. Distribute • Androidの配信方法は３つ グループ配信 App Centerによる配信 登録したユーザにメールで通知 未登録のユーザにも配布できるリンクが作成可能 GooglePlayによる配信 API接続用のセキュリティトークンが必要 α、βテスト用の配信 Production用の配信 Intune Company Portal用の配信 75https://docs.microsoft.com/en-us/appcenter/quickstarts/android/distribute
- 79. Distribute – Group配信 79https://docs.microsoft.com/en-us/appcenter/quickstarts/android/distribute 届いたメールの Accept Invitaionを クリック Downloadをクリッ ク 警告が出てもOK この警告が出た際は セキュリティの設定 を変更して再度イン ストール アプリ 起動
- 81. Distribute – ストア配信 81https://docs.microsoft.com/en-us/appcenter/quickstarts/android/distribute iTunesConnectを選択 トークンを登録したら GooglePlayへ接続 Google Play Developer Consoleから払い出したAPI接 続用のセキュリティトークンが 必要
- 82. Distribute – ストア配信 82https://docs.microsoft.com/en-us/appcenter/quickstarts/android/distribute Alphaを選択 Publish to Storeをク リック
- 83. Distribute – ストア配信 83https://docs.microsoft.com/en-us/appcenter/quickstarts/android/distribute APKファイルのアッ プロード アップロード内容を確 認 リリースノートを記述 確認してPublish
- 84. • GooglePlayDeveloperCon soleであらかじめアプリ を作成し、手動で一度は バイナリをアップロード しないとAPI経由でのアッ プロードに成功しない Distribute – 失敗 84https://docs.microsoft.com/en-us/appcenter/quickstarts/android/distribute
- 87. Crashes – クラッシュ情報取得 • 登録方法はMainActivityに以下のコードを追加するのみ。 • クラッシュ情報がAppCenterに送信されるのはアプリ再起動後。 • サンプルではCrash appボタン実行でRuntime Exceptionをス ローしている。 87 https://docs.microsoft.com/en-us/appcenter/quickstarts/android/crashes
- 89. Push • Pushの実現に必要な条件 Firebase Cloud MessagingのSenderIDとServerKey アプリのソースにappcenter-pushを組み込む app/build.gradleappcenter-pushを追加 compile "com.microsoft.appcenter:appcenter-push:${appCenterSdkVersion}" MainActivityでSenderIdとPush.classを追加 89https://docs.microsoft.com/en-us/appcenter/quickstarts/android/push
- 91. Androidまとめ • アプリへの組み込みのポイント Build.gradleの編集 MainActivityへの初期化処理の追加 各イベントログ対象時のイベントの埋め込み • クラッシュログが送信されるのは再起動後 • ストアへの配信はAPKファイルのアップロードのみ リポジトリからやりたいなぁ • 実機テストはローカル側の設定に一癖ありそう 91
- 92. Why CI/CD 92
- 93. なぜ、CI/CDは必要？ • スノーフレークによる不具合を防ぐために必要 • 常に同一の条件でビルド・テスト・配信するためには、デベ ロッパーの開発環境では限界がある。 デベロッパーが２トラック以上いるチームでは、お互いの環境の差 異により不具合を発生させる可能性が高くなる。 • 環境が壊れてもすぐに復旧できるように環境設定はコード化 したい。⇒Infrastructure as Code • Visual Studio App Centerの環境設定はどうコード化すべき か？ APIベースで操作したらよいのではないか。 • そこで．．． 93
- 94. App Center Client (Preview) 94https://openapi.appcenter.ms/