[JP] How to start Android Dev

[JP] How to start Android Dev

Transcript

1. How to start dev
   Wasabeef
   GDG Tokyo New Year Party 2019 #gdgtokyo
   

   View Slide

2. About me
   Daichi Furiya
   Google Developers Expert
   CATS
   @wasabeef_jp wasabeef
   

   View Slide

3. 今年から Android アプリを
   作るなら知っておきたいこと
   January 2019
   

   View Slide

4. IDE (Build tools)
   Java / Kotlin
   Architecture
   Jetpack
   KTX
   AAC
   Agenda
   DI
   Networking
   Testing
   CI
   Multi-platform
   

   View Slide

5. IDE (Build tools)
   

   View Slide

6. Android Studio
   3.3 Stable
   3.4 BETA
   3.5 Canary
   Gradle
   Bazel
   IDE (Build tools)
   

   View Slide

7. Android Studio
   

   View Slide

8. Android Studio
   見た目はこんな感じ。DL→https://d.android.com/studio
   

   View Slide

9. Layout editor
   直接XMLを書くこと多いですが、Layout Editorは高機能です
   

   View Slide

10. MotionLayout
    

    View Slide

11. Motion editor
    今現在は実装されていませんが、Flash pro のようなエディタも実装される予定です
    

    View Slide

12. Motion editor
    今現在は実装されていませんが、Flash pro のようなエディタも実装される予定です
    

    View Slide

13. Emulator
    数年前と比べると格段に高機能で高速になりま
    した。
    Quick-boot Snapshots
    ARCore
    Screen Record
    Wifi, Location, Camera, Battery

    … and more
    

    View Slide

14. Emulator では出来ないこと
    Bluetooth
    NFC
    Device-attached headphones
    USB
    

    View Slide

15. Performance monitor
    

    View Slide

16. Gradle
    

    View Slide

17. Gradle
    ビルド自動化
    Android 開発におけるスタンダード
    DSL
    Groovy DSL ※ デフォルト
    Kotlin DSL
    

    View Slide

18. Java / Kotlin
    

    View Slide

19. Java / Kotlin
    Java
    Kotlin
    Dart
    

    View Slide

20. Java
    

    View Slide

21. Java
    Java 8 

    最新の Java は使えません

    ※ D8 tools によって今後変わりそう
    

    View Slide

22. Java 8 - Unsupported features and APIs
    Java 8 Language API Compatible minSdkVersion
    java.lang.annotation.Repeatable
    Android 7 (API24) +
    AnnotatedElement.getAnnotationsByType(Class)
    java.util.stream
    java.lang.FunctionalInterface
    java.lang.reflect.Method.isDefault()
    java.util.function
    

    View Slide

23. Kotlin
    

    View Slide

24. Kotlin
    Kotlin (1.3)
    Coroutines
    Null-safety
    Extension functions
    Lambda + Inline functions
    … and more
    

    View Slide

25. Architecture
    

    View Slide

26. Architecture
    MVVM
    Flux
    MVP
    MVI
    

    View Slide

27. MVVM
    

    View Slide

28. Google 推奨で AAC
    と相性が良い
    google/iosched
    nickbutcher/plaid
    MVVM
    

    View Slide

29. Flux
    

    View Slide

30. 日本で数件の事例あり
    DroidKaigi/
    conference-app-2019
    Flux
    

    View Slide

31. Jetpack
    

    View Slide

32. Jetpack
    

    View Slide

33. Jetpack
    KTX
    Lifecycles
    ViewModel (+ LiveData)
    Navigation
    

    View Slide

34. KTX
    

    View Slide

35. KTX
    Core
    Fragment
    Lifecycle
    Navigation
    … and more
    

    View Slide

36. Samples
    view.viewTreeObserver.addOnPreDrawListener(
    object : ViewTreeObserver.OnPreDrawListener {
    override fun onPreDraw(): Boolean {
    viewTreeObserver.removeOnPreDrawListener(this)
    actionToBeTriggered()
    return true
    }
    }
    ) アニメーションの処理でよく見かけるコード
    

    View Slide

37. Samples
    view.doOnPreDraw { actionToBeTriggered() }
    かなりシンプルに出来ました
    

    View Slide

38. Lifecycles
    

    View Slide

39. Lifecycles
    見えなくて
    大丈夫です..
    

    View Slide

40. Lifecycles
    ライフサイクルを知りたい時がある
    動画の開始停止
    画面閉じた時の終了処理
    … and more
    LiveData でも使われている
    

    View Slide

41. ViewModel
    (+ LiveData)
    

    View Slide

42. ViewModel
    Activity/ViewModel
    はそれぞれ異なるライ
    フサイクルがあります
    が、ViewModelのほ
    うが長生きします
    

    View Slide

43. ViewModel (+ LiveData)
    ViewModel
    Activity の画面回転・破棄のデータ保持
    Fragments 間のデータ共有
    永続化ではない
    LiveData
    Observable の一種
    

    View Slide

44. Samples
    class MyViewModel(private val repo: UserRepository) : ViewModel() {
    private val _user = MutableLiveData
    val user: LiveData get() = _user
    fun getUser() = return repo.getUser()
    }
    class MyActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
    val model = ViewModelProviders.of(this).get(MyViewModel::class.java)
    model.getUser().observe(this, Observer { user ->
    // update UI
    })
    }
    } よく見かける ViewModel + LiveData のサンプルです
    

    View Slide

45. class MyViewModel(private val repo: UserRepository) : ViewModel() {
    private val _user = MutableLiveData
    val user: LiveData get() = _user
    fun getUser() = return repo.getUser()
    }
    class MyActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
    val model = ViewModelProviders.of(this).get(MyViewModel::class.java)
    model.getUser().observe(this, Observer { user ->
    // update UI
    })
    }
    }
    Samples
    よく見かける ViewModel + LiveData のサンプルです
    

    View Slide

46. Navigation
    

    View Slide

47. Navigation
    Fragment Transaction の簡易化
    アニメーション
    ディープリンク
    BottomNavigation / Toolbar などと連携
    Fragment 間でデータを型安全に渡せる
    Navigation editor で GUI で設定可能
    

    View Slide

48. Navigation editor
    iOS の StoryBoard ぽいものが増えました。でもXML直接書く人のほうが多そう
    

    View Slide

49. Dependency Injection
    (DI)
    

    View Slide

50. Dependency Injection (DI)
    Dagger
    Koin
    Kodein
    

    View Slide

51. Dagger
    Java
    Google (+ Square)
    少し難しいが一番利用されている
    Annotation Processing なので実行時は高速
    Android Support
    

    View Slide

52. Koin
    Kotlin
    軽量で簡単
    ランタイム
    Daggerよりは実行時が遅い
    

    View Slide

53. Kodein
    Kotlin
    簡単
    ランタイム
    Daggerよりは実行時が遅い
    JVM, Android, JS, iOS でも動作する
    

    View Slide

54. Android Injection Performance
    Library Setup Kotlin Setup Java Inject Kotlin Inject Java
    Koin 19.80 ms 20.43 ms 0.45 ms 0.35 ms
    Kodein 21.48 ms 21.02 ms 0.74 ms 0.62 ms
    Dagger 0.03 ms 0.03 ms 0.22 ms 0.15 ms
    Sloy/android-dependency-injection-performance
    

    View Slide

55. Networking
    

    View Slide

56. Networking
    Retrofit (+ OkHttp)
    Ktor
    

    View Slide

57. Retrofit
    (+ OkHttp)
    

    View Slide

58. Retrofit (+ OkHttp)
    Square 社製
    Android 5.0+ (OkHttp)
    JSON, Protobuf, XMLに対応
    使いやすく、多くの人に使われている
    

    View Slide

59. interface SampleService {
    @GET("users/{user}")
    fun getUser(@Path("user") user: String): Deferred
    }
    val retrofit =
    Retrofit.Builder().baseUrl("https://wasabeef.jp/").client(okHttpClient).build()
    val service = retrofit.create(SampleService::class.java)
    launch {
    val user = service.getUser("wasabeef").await()
    // Do something
    }
    Samples
    よくあるサンプルコード
    

    View Slide

60. interface SampleService {
    @GET("users/{user}")
    fun getUser(@Path("user") user: String): Deferred
    }
    val retrofit =
    Retrofit.Builder().baseUrl("https://wasabeef.jp/").client(okHttpClient).build()
    val service = retrofit.create(SampleService::class.java)
    launch {
    val user = service.getUser("wasabeef").await()
    // Do something
    }
    Samples
    よくあるサンプルコード
    

    View Slide

61. interface SampleService {
    @GET("users/{user}")
    fun getUser(@Path("user") user: String): Deferred
    }
    val retrofit =
    Retrofit.Builder().baseUrl("https://wasabeef.jp/").client(okHttpClient).build()
    val service = retrofit.create(SampleService::class.java)
    launch {
    val user = service.getUser("wasabeef").await()
    // Do something
    }
    Samples
    よくあるサンプルコード
    

    View Slide

62. Testing
    

    View Slide

63. Testing
    Unit Test
    Firebase Test Lab
    

    View Slide

64. Unit Test
    

    View Slide

65. Unit Test
    主なテスト方法は二つ
    Instrument Test

    実機やエミュレータ上でテスト行う
    Local Test (Robolectric)

    PC の JVM 上で擬似的にテストを行う
    

    View Slide

66. Unit Test
    Robolectric を使ったテストでは、実機
    やエミュレータの無い CI 上でテストを
    実行できる事や、それらを起動する必要
    がないので、高速で行うことができる。

    ※ まれに JVM と Android(ArtVM)で挙動差があることがある
    

    View Slide

67. Firebase Test Lab
    

    View Slide

68. Firebase Test Lab
    .apk をアップロードするだけで実行が可能
    Instrument/Robo Test の指定が可能
    実機・エミュレータの指定ができる
    iOS も対応
    ユーザ名・パスワードのログインにも対応
    動作ログ (Screenshot, Video) が見れる
    

    View Slide

69. Firebase Test Lab
    コンソール画面
    

    View Slide

70. Firebase Test Lab
    Console で1件クラッシュしたことがわかる
    

    View Slide

71. Firebase Test Lab
    クラッシュ時のログも確認できる
    

    View Slide

72. Firebase Test Lab
    実行時のスクリーンショットも確認できる
    

    View Slide

73. Firebase Test Lab
    どの時間、どの画面で負荷が上がったかがわかる
    

    View Slide

74. CI
    

    View Slide

75. CI
    bitrise
    CircleCI
    Danger
    

    View Slide

76. bitrise
    

    View Slide

77. bitrise
    モバイル向け
    GUI
    Firebase Test lab が無料で使える

    ※ 指定出来るデバイスは少なめ
    メモリ不足で落ちることは殆どない
    

    View Slide

78. bitrise
    CircleCI と比べるとデザインが良い
    

    View Slide

79. bitrise
    Console で1件クラッシュしたことがわかる
    

    View Slide

80. CircleCI
    

    View Slide

81. CircleCI
    並列タスクが高機能

    Build, Lint, Test などを簡単に並列で出来る
    GUIがない (ので設定は慣れが必要)
    Android だとメモリ不足でよく落ちる

    ※ Performance pricing planに変更して、メモ
    リ量を増やすこともできる。
    

    View Slide

82. View Slide

83. Danger
    コードレビューの自動化をCI上で行う
    Android Lint, Swift Lint, ESLint,
    HLint, CheckStyle Format.......
    

    View Slide

84. Danger
    CI で Danger の連携をすると、Github コードレビューしてくれる
    

    View Slide

85. Multi-platform
    

    View Slide

86. Multi-platform
    Kotlin Multiplatform
    Flutter
    React Native
    

    View Slide

87. Kotlin Multiplatform
    

    View Slide

88. Kotlin Multiplatform
    iOS, macOS, Android, Windows,
    Linux, WASM に対応
    サーバも Kotlin にして、Backends for
    Frontends の流れで使われることがある
    UIを作れるものでは無い
    

    View Slide

89. Kotlin Multiplatform
    iOS エンジニアにも Kotlin を読めるよう
    になってもらったほうが良い
    iOS は Coroutines が Single Thread で
    しか使えない
    https://aakira.app/blog/2018/12/kotlin-mpp-reason/
    

    View Slide

90. Flutter
    

    View Slide

91. Flutter
    Google
    Dart
    UI も作れる
    Android, iOS, (Web), (macOS),
    (Windows), (Linux), (Fuchsia) に対応
    

    View Slide

92. Fast development
    Hot-reload に対応しているので、画面開発、動作確認までが楽
    

    View Slide

93. Expressive, beautiful UIs
    Material Design のウィジットが豊富で画面を作りやすい
    

    View Slide

94. Native Performance
    Dart で書いたものが C/C++ でコンパイルされ、 iOS/Android にネイティブとして動く
    

    View Slide

95. Conclusion..
    

    View Slide

96. Conclusion.. 個人的な話
    SingleActivity にして MVVM で良いと思います。

    AAC が MVVM 向きに作られてるような感じ。
    Koin の実行速度が Dagger くらいにならないと導入はしない。

    理解が難しいけど、慣れればそこまでかな。
    RxJava はもう使わなくてもいいかな。Kotlin (Coroutines), LiveData で十分。
    Firebase Test Lab は絶対いれたい。
    Arrow で Null-safety より安全なコードを目指したい。

    Scala属性でモナドの人は是非。
    そういえば、DroidKaigi に Arrow のプロポーザル出したけど落ちた。
    デスクトップアプリ作るなら Flutter にしたいな。
    

    View Slide

97. References:
    - https://d.android.com
    - https://kotlinlang.org
    - https://flutter.io
    - https://danger.systems
    - https://bitrise.io
    - https://circleci.com
    Resources
    Photos:
    - https://unsplash.com
    - https://www.pexels.com
    Illustrations:
    - http://www.chojugiga.com
    - https://www.irasutoya.com
    

    View Slide

98. twitter.com/wasabeef_jp
    wasabeef.jp
    github.com/wasabeef
    

    View Slide