Upgrade to Pro — share decks privately, control downloads, hide ads and more …

A Multiplatform Adventure

cmota
October 09, 2020

A Multiplatform Adventure

Kotlin Multiplatform is here to stay! We start to see several products in production that are already migrating part of their code/ implementing new features with KMP. The goal here is simple, develop your application logic once and use it on every platform.

So join me on the next two hours on this multiplatform adventure and let’s create an app for android and iOS.

cmota

October 09, 2020
Tweet

More Decks by cmota

Other Decks in Programming

Transcript

  1. A Multiplatform Adventure
    workshop edition
    @cafonsomota

    View full-size slide

  2. Android Dev Lead @WITSoftware
    Founder @GDGCoimbra and co-founder @Kotlin_Knights
    ✍ Author @rwenderlich and @opinioesonline
    Podcaster wannabe
    Loves travel, photography and running
    @cafonsomota

    View full-size slide

  3. MATERIALS
    speakerdeck.com/cmota/a-multiplatform-adventure
    github.com/cmota/kmm-a-multiplatform-adventure
    cmota.github.io/kmp-codelabs
    IDE’s required
    Android Studio
    Xcode
    @cafonsomota

    View full-size slide

  4. @cafonsomota
    install KMM plugin on Android Studio

    View full-size slide

  5. $ git clone https:!//github.com/cmota/kmm-all-together-now.git
    install KMM plugin on Android Studio
    github.com/cmota/kmm-all-together-now

    View full-size slide

  6. $ git clone https:!//github.com/cmota/kmm-all-together-now.git
    AllTogetherNow [kmm-all-together-now/00. Starter Project]
    install KMM plugin on Android Studio
    github.com/cmota/kmm-all-together-now
    open “00. Starter Project”

    View full-size slide

  7. $ git clone https:!//github.com/cmota/kmm-all-together-now.git
    AllTogetherNow [kmm-all-together-now/00. Starter Project]
    install KMM plugin on Android Studio
    github.com/cmota/kmm-all-together-now
    open “00. Starter Project”
    wait for gradle to finish

    View full-size slide

  8. xkcd.com/303/

    View full-size slide

  9. > Task :shared:cinteropFirebaseFirestoreIos FAILED

    2 actionable tasks: 1 executed, 1 up-to-date

    xcrun: error: unable to find utility "xcodebuild", not a developer tool or in PATH

    Exception in thread "main" org.jetbrains.kotlin.konan.MissingXcodeException: An error occurred during an xcrun
    execution. Make sure that Xcode and its command line tools are properly installed.

    at org.jetbrains.kotlin.konan.target.CurrentXcode.xcrun(Xcode.kt:77)

    at org.jetbrains.kotlin.konan.target.CurrentXcode.access$xcrun(Xcode.kt:45)

    at org.jetbrains.kotlin.konan.target.CurrentXcode$version$2.invoke(Xcode.kt:70)

    at org.jetbrains.kotlin.konan.target.CurrentXcode$version$2.invoke(Xcode.kt:45)

    at kotlin.SynchronizedLazyImpl.getValue(LazyJVM.kt:74)

    AllTogetherNow [kmm-all-together-now/00. Starter Project]
    install KMM plugin on Android Studio
    github.com/cmota/kmm-all-together-now
    open “00. Starter Project”
    wait for gradle to finish
    ❌ no Xcode installed

    View full-size slide

  10. !/* If you don't have Xcode installed comment this code block!*/

    !/* Search for this comment on build.gradle.kts (:shared) and comment all the references to iOS:

    * - onPhone

    * - cocoa pods

    * - iosMain

    * - iosTest

    * - packForXcode

    * - tasks.getByName(“build”)

    !*/
    AllTogetherNow [kmm-all-together-now/00. Starter Project]
    install KMM plugin on Android Studio
    github.com/cmota/kmm-all-together-now
    open “00. Starter Project”
    wait for gradle to finish
    comment iOS related blocks on build.gradle.kts (:shared)

    View full-size slide

  11. BUILD SUCCESSFUL in 11s

    44 actionable tasks: 44 executed
    AllTogetherNow [kmm-all-together-now/00. Starter Project]
    install KMM plugin on Android Studio
    github.com/cmota/kmm-all-together-now
    open “00. Starter Project”
    wait for gradle to finish
    ✅ Xcode installed

    View full-size slide

  12. iosApp: pod install
    install KMM plugin on Android Studio
    github.com/cmota/kmm-all-together-now
    open “00. Starter Project”
    wait for gradle to finish
    go to iosApp folder on Terminal and execute “pod install”

    View full-size slide

  13. install KMM plugin on Android Studio
    github.com/cmota/kmm-all-together-now
    open “00. Starter Project”
    wait for gradle to finish
    go to iosApp folder on Terminal and execute “pod install”
    compile and run the app
    $ git clone https:!//github.com/cmota/kmm-all-together-now.git
    AllTogetherNow [kmm-all-together-now/00. Starter Project]

    View full-size slide

  14. @cafonsomota
    and now we wait…
    (In KMM defense, well we’ve got the FirebaseFirestore lib as a pod)

    View full-size slide

  15. dev-reactions/crash-in-production.gif

    View full-size slide

  16. A Multiplatform Adventure
    A bit of theory…
    @cafonsomota

    View full-size slide

  17. @cafonsomota
    dev-reactions/commitstrip/unrealist-mobile-dev-dream

    View full-size slide

  18. 2008 2012 2018
    2013
    2011 2017
    2006 2010
    2009 2015
    * Kotlin Multiplatform
    *

    View full-size slide

  19. - Smaller team
    - Small learning curve for web developers
    - Typically half of the cost needed on native
    - Less time (working hours) to built
    (advantages)
    Cross-platform
    to test
    to fix issues (hopefully not framework specific )

    View full-size slide

  20. - Chained to the framework implementation of UI
    - new updates from the OS will take time to adopt
    - Performance is not the same
    - Some native code might need to be written
    - OS/ device features are dependent on the fw support
    - Dart (flutter) is not widely used language (for now)
    - Committed to one framework/ language
    (disadvantages)
    Cross-platform

    View full-size slide

  21. what about Kotlin Multiplatform?

    View full-size slide

  22. shares application logic
    doesn’t share the application UI
    kotlin
    multiplatform

    View full-size slide

  23. - Chained to the framework implementation of UI
    - new updates from the OS will take time to adopt
    - Performance is not the same
    - Some native code might need to be written
    - OS/ device features are dependent on the fw support
    - Dart (flutter) is not widely used language (for now)
    - Committed to one framework/ language
    (disadvantages)
    Cross-platform

    View full-size slide

  24. - Chained to the framework implementation of UI
    - new updates from the OS will take time to adopt
    - Performance is not the same
    - Some native code might need to be written
    - OS/ device features are dependent on the fw support
    - Dart (flutter) is not widely used language (for now)
    - Committed to one framework/ language
    Cross-multiplatform
    UI is developed natively
    nope, as fast as an update to
    the SDK and recompile the apps

    View full-size slide

  25. - Chained to the framework implementation of UI
    - new updates from the OS will take time to adopt
    - Performance is not the same
    - Some native code might need to be written
    - OS/ device features are dependent on the fw support
    - Dart (flutter) is not widely used language (for now)
    - Committed to one framework/ language
    Cross-multiplatform
    nope, as fast as an update to
    the SDK and recompile the apps
    UI is developed natively
    always arguable, but you’re leaving UI to native, so…

    View full-size slide

  26. - Chained to the framework implementation of UI
    - new updates from the OS will take time to adopt
    - Performance is not the same
    - Some native code might need to be written
    - OS/ device features are dependent on the fw support
    - Dart (flutter) is not widely used language (for now)
    - Committed to one framework/ language
    Cross-multiplatform
    nope, as fast as an update to
    the SDK and recompile the apps
    yes, the UI
    UI is developed natively
    always arguable, but you’re leaving UI to native, so…

    View full-size slide

  27. - Chained to the framework implementation of UI
    - new updates from the OS will take time to adopt
    - Performance is not the same
    - Some native code might need to be written
    - OS/ device features are dependent on the fw support
    - Dart (flutter) is not widely used language (for now)
    - Committed to one framework/ language
    Cross-multiplatform
    nope, as fast as an update to
    the SDK and recompile the apps
    yes, the UI
    UI is developed natively
    you have direct access
    to them; although if on
    shared module it might
    give you extra effort
    always arguable, but you’re leaving UI to native, so…

    View full-size slide

  28. - Chained to the framework implementation of UI
    - new updates from the OS will take time to adopt
    - Performance is not the same
    - Some native code might need to be written
    - OS/ device features are dependent on the fw support
    - Dart (flutter) is not widely used language (for now)
    - Committed to one framework/ language
    Cross-multiplatform
    nope, as fast as an update to
    the SDK and recompile the apps
    yes, the UI
    UI is developed natively
    kotlin, is one of the most
    trending languages nowadays,
    with strong community support
    always arguable, but you’re leaving UI to native, so…
    you have direct access
    to them; although if on
    shared module it might
    give you extra effort

    View full-size slide

  29. (advantages)
    - Language features
    - Kotlin first!
    - Low risk
    - You decide what’s worth to share across platforms
    - Interoperability
    - Consistency across platforms
    - Strong investment from JetBrains and community support
    Kotlin Multiplatform server web native
    android desktop
    jvmMain jsMain androidMain iosMain macosX64Main
    linuxX64Main
    mingwX64Main

    View full-size slide

  30. - It’s in alpha
    - Although we keep seeing new projects in production
    - Space was announced during Kotlin Conf 19 (web, desktop and mobile)
    (apps in production)
    Kotlin Multiplatform
    Space
    Adapted from: KotlinConf 2019: Opening Keynote by Andrey Breslav
    Full KMP
    Cash App
    Shares:
    business logic
    Yandex Maps
    Shares:
    business logic,
    wrappers for C++
    libraries
    PlanGrid Planboard
    Workspace
    Shares:
    business logic,
    sync logic,
    mgmnt offline data
    Shares:
    business logic,
    networking,
    offline caching lyrs
    Shares:
    business logic

    View full-size slide

  31. - Open source
    - Concise, safe, interoperable, tool-friendly
    - Supported/ used by Google for Android Development
    - It’s more than “just for Android”
    - Small learning curve involved
    - Easily to go from JavaScript/ Swift into Kotlin and back
    Kotlin

    View full-size slide

  32. var variable = 42
    variable = 1
    let value = 42
    var variable = 42
    variable = 1
    val value = 42
    *adapted from http://nilhcem.com/swift-is-like-kotlin/
    (variables and constants)
    Kotlin vs Swift
    Kotlin
    Swift

    View full-size slide

  33. fun greet(name: String, day: String): String {
    return "Hello $name, today is $day."
    }
    greet(“World”, “Thursday”)
    *updated from http://nilhcem.com/swift-is-like-kotlin/
    func greet(_ name: String,_ day: String) -> String {
    return "Hello \(name), today is \(day)."
    }
    greet(“World”, “Thursday”)
    Kotlin
    Swift
    (functions)
    Kotlin vs Swift

    View full-size slide

  34. K
    otlin multiplatform
    using kotlin in projects
    that target more than
    one platform

    View full-size slide

  35. network network network
    parser parser parser
    model model model
    presentation presentation presentation
    model
    parser
    network
    view
    presentation
    view view view
    presentation presentation presentation
    desktop
    web
    iOS
    android

    View full-size slide

  36. business logic business logic business logic
    model
    parser
    network
    presentation
    model
    parser
    network
    presentation
    model
    parser
    network
    presentation
    model
    parser
    network
    presentation
    business logic
    view view view view
    desktop
    web
    iOS
    android

    View full-size slide

  37. android iOS web desktop
    model
    parser
    network
    presentation
    common
    view view view view
    java/kotlin objective-c/ swift (kotlin) JS supported in jvm

    View full-size slide

  38. dev-reactions/it-works.gif

    View full-size slide

  39. but how can different platforms
    expect to communicate?

    View full-size slide

  40. declared at common module
    expect
    declared at android module
    actual
    declared at iOS module
    declared at …

    View full-size slide

  41. we want a platform-specific value
    for the device name

    View full-size slide

  42. dev-reactions/god-mode.gif

    View full-size slide

  43. - User interface
    - RecyclerView and more (Android)
    - UITableViewController and more (iOS)
    - Multiple network request
    - Parse response objects
    - Store on local database
    - Use system preferences
    - Migrate code to Multiplatform
    Project structure

    View full-size slide

  44. android iOS
    Room CoreData
    Retrofit Alamofire
    GSON/ Moshi JSONSerialization
    MVP, MVVM, MVI MVVM, ELM
    RxJava RxSwift
    Tests Tests
    Activity UIViewController
    RecyclerView UITableView

    View full-size slide

  45. Room CoreData
    Retrofit Alamofire
    GSON/ Moshi JSONSerialization
    MVP, MVVM, MVI MVVM, ELM
    RxJava RxSwift
    Tests Tests
    Activity UIViewController
    RecyclerView UITableView
    android iOS

    View full-size slide

  46. Room CoreData
    Retrofit Alamofire
    GSON/ Moshi JSONSerialization
    MVP, MVVM, MVI MVVM, ELM
    RxJava RxSwift
    Tests Tests
    Activity UIViewController
    RecyclerView UITableView
    android iOS
    Activity UIViewController
    RecyclerView UITableView
    unnecessary duplication

    View full-size slide

  47. SQLDelight
    ktor
    kotlinx.serialization
    MVP
    kotlinx.coroutines
    kotlin.test
    android iOS
    Activity UIViewController
    RecyclerView UITableView

    View full-size slide

  48. multiplatform
    ktor
    SQLDelight
    model
    kotlinx.serialization
    SendMessages GetConferences
    SQLDriver dispatcher
    view
    presenter
    Settings
    Firebase
    presenter

    View full-size slide

  49. @cafonsomota
    cmota.github.io/kmp-codelabs/
    cmota.github.io/kmp-codelabs

    View full-size slide

  50. @cafonsomota
    > Configure project :shared

    Kotlin Multiplatform Projects are an Alpha feature.
    cmota.github.io/kmp-codelabs

    View full-size slide

  51. speakerdeck.com/cmota/a-multiplatform-adventure
    github.com/cmota/kmm-a-multiplatform-adventure
    cmota.github.io/kmp-codelabs
    @cafonsomota

    View full-size slide