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.

Transcript

1. A Multiplatform Adventure
   workshop edition
   @cafonsomota
   

   View 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 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 Slide

4. @cafonsomota
   install KMM plugin on Android Studio
   

   View 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 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 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 Slide

8. xkcd.com/303/
   

   View 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 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 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 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 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 Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View 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 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 Slide

21. what about Kotlin Multiplatform?
    

    View Slide

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

    View 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 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 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 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 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 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 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 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 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 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 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 Slide

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

    View 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 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 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 Slide

38. dev-reactions/it-works.gif
    

    View Slide

39. but how can different platforms
    expect to communicate?
    

    View Slide

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

    View Slide

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

    View Slide

42. View Slide

43. View Slide

44. View Slide

45. dev-reactions/god-mode.gif
    

    View Slide

46. View Slide

47. View Slide

48. - 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 Slide

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

    View Slide

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

    View Slide

51. 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 Slide

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

    View Slide

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

    View Slide

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

    View Slide

55. @cafonsomota
    > Configure project :shared
    
    Kotlin Multiplatform Projects are an Alpha feature.
    cmota.github.io/kmp-codelabs
    

    View Slide

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

    View Slide