Code reuse with Kotlin Multiplatform @ KotlinConf Global 2019 - Curitiba

This talk aims to introduce the Kotlin Multiplatform concept, with its advantages and disadvantages, and how this concept is different from cross-platform solutions in code reuse between platforms. Finally, the application of this concept will be shown in a simple chat made with kotlin for Web, Android and iOS.

Kotlin Multiplatform samples:
- https://github.com/felipehjcosta/chat-app
- https://github.com/felipehjcosta/hello-world-multiplatform

References:
- https://touchlab.co/future-cross-platform-native/
- https://www.youtube.com/playlist?list=PLQ176FUIyIUY6SKGl3Cj9yeYibBuRr3Hl
- https://www.youtube.com/watch?v=c8IkWGmlcNE
- https://www.youtube.com/watch?v=nw6YTfEyfO0

Transcript

1. Code reuse with Kotlin Multiplatform KotlinConf Global 2019 - Curitiba
2. Felipe Costa Senior Software engineer @ OLX Brasil Passionate Software Craftsman. I have been developing mobile applications since 2011 and enjoying it mostly in Kotlin since 2016.
3. Our purpose We approach Brazilians to turn items into happiness.
4. Kotlin @ OLX 0 Python Javascript Java C PHP Kotlin Objective-C Perl
5. Kotlin @ OLX 0 Android Authentication Experimentação Insertion Search Recomendation
6. Karol & Multiplatform Chat MVP
7. Why reuse code between platforms?
8. DRY
9. Risk mitigation
10. Feature parity
11. Solutions
12. Input Process Output App type Native Language: Kotlin & Swift & JS Outra linguagem Cross-Compile Inclui Runtime (Interpretador, VM, Bibliotecas) Native Code Native Language: Javascript Native Web Native Web
13. Input Process Output App type Native Language Other Language: Javascript Cross-Compile Include Runtime (Interpreter, VM, Libraries) Native Code + Bundle JS Native Language Native Web React Native
14. Flutter Input Process Output App type Native Language Other Language: Dart Cross-Compile Include Runtime (Interpreter, VM, Libraries) Native Code Native Language Native Web
15. Kotlin Multiplatform Input Process Output App Type Native Language: Kotlin Other Language Cross-Compile Include Runtime (Interpreter, VM, Libraries) Native Code Native Language: Javascript Native Web Android iOS Web
16. Why Kotlin Multiplatform?
17. Optional Sharing Low risk No Big decisions
18. 100% Native smooth interop First class citizen
19. Code sharing not “cross platform”
20. Activity community
21. Good tools
22. Modern Language
23. Not necessarily UI Business rules
24. Quem está usando?
28. Many Platforms
29. Common *.kt
30. plugins { id 'kotlin-multiplatform' version '1.3.61' } repositories { mavenCentral() } kotlin { sourceSets { commonMain { dependencies { implementation kotlin('stdlib-common') } } } } Build.gradle
31. plugins { id 'kotlin-multiplatform' version '1.3.61' } repositories { mavenCentral() } kotlin { sourceSets { commonMain { dependencies { implementation kotlin('stdlib-common') } } } } Build.gradle
32. plugins { id 'kotlin-multiplatform' version '1.3.61' } repositories { mavenCentral() } kotlin { sourceSets { commonMain { dependencies { implementation kotlin('stdlib-common') } } } } Build.gradle
33. plugins { id 'kotlin-multiplatform' version '1.3.61' } repositories { mavenCentral() } kotlin { sourceSets { commonMain { dependencies { implementation kotlin('stdlib-common') } } } } Build.gradle
34. Common *.kt
35. Common *.kt *.class *.jar, *.apk
36. kotlin { jvm() sourceSets { commonMain { /* */ } } } Build.gradle
37. kotlin { jvm() sourceSets { commonMain { /* */ } } } Build.gradle
38. kotlin { jvm() sourceSets { commonMain { /* */ } } } Build.gradle
39. Common *.kt *.class *.jar, *.apk
40. Common *.kt *.class *.jar, *.apk *.js
41. kotlin { jvm() js() sourceSets { commonMain { /* */ } } } Build.gradle
42. kotlin { jvm() js() sourceSets { commonMain { /* */ } } } Build.gradle
43. kotlin { jvm() js() sourceSets { commonMain { /* */ } } } Build.gradle
44. kotlin { jvm() js { browser() nodejs() } sourceSets { commonMain { /* */ } } } Build.gradle
45. kotlin { jvm() js { browser() nodejs() } sourceSets { commonMain { /* */ } } } Build.gradle
46. kotlin { jvm() js { browser() nodejs() } sourceSets { commonMain { /* */ } } } Build.gradle
47. Common *.kt *.class *.jar, *.apk *.js
48. Common *.kt *.class *.jar, *.apk *.js binário nativo Android/ NDK iOS Mac Linux Windows Webassembly Outros
49. kotlin { jvm() js() // For ARM, should be changed to iosArm32 or iosArm64 // For Linux, should be changed to e.g. linuxX64 // For MacOS, should be changed to e.g. macosX64 // For Windows, should be changed to e.g. mingwX64 macosX64("macos") sourceSets { commonMain { /* */ } } } Build.gradle
50. kotlin { jvm() js() // For ARM, should be changed to iosArm32 or iosArm64 // For Linux, should be changed to e.g. linuxX64 // For MacOS, should be changed to e.g. macosX64 // For Windows, should be changed to e.g. mingwX64 macosX64("macos") sourceSets { commonMain { /* */ } } } Build.gradle
51. kotlin { jvm() js() // For ARM, should be changed to iosArm32 or iosArm64 // For Linux, should be changed to e.g. linuxX64 // For MacOS, should be changed to e.g. macosX64 // For Windows, should be changed to e.g. mingwX64 macosX64("macos") sourceSets { commonMain { /* */ } } } Build.gradle
52. fun hello(): String = "Hello from Kotlin Multiplatform" Common
53. import kotlin.Metadata; import org.jetbrains.annotations.NotNull; @Metadata( mv = {1, 1, 15}, bv = {1, 0, 3}, k = 2, d1 = {"\u0000\b\n\u0000\n\u0002\u0010\u000e\n\u0000\u001a\u0006\u0010\u0000\u001a\u00020\u0001¨\u0006\u0002"}, d2 = {"hello", "", "Platform module com.example.hello-world-multiplatform.jvmMain including [com.example.hello-world-multiplatform.commonMain]"} ) public final class SampleKt { @NotNull public static final String hello() { return "Hello from Kotlin Multiplatform"; } } JVM
54. if (typeof kotlin === 'undefined') { throw new Error("Error loading module 'hello-world-multiplatform'. Its dependency 'kotlin' was not found. Please, check whether 'kotlin' is loaded prior to 'hello-world-multiplatform'."); } this['hello-world-multiplatform'] = function (_, Kotlin) { 'use strict'; function hello() { return 'Hello from Kotlin Multiplatform'; } var package$sample = _.sample || (_.sample = {}); package$sample.hello = hello; Kotlin.defineModule('hello-world-multiplatform', _); return _; }(typeof this['hello-world-multiplatform'] === 'undefined' ? {} : this['hello-world-multiplatform'], kotlin); JS
55. MacOS Binary .kexe
56. kotlin { jvm() js() macosX64("macos") { binaries { sharedLib("SharedLib") } } sourceSets { commonMain { /* */ } } } Build.gradle
57. kotlin { jvm() js() macosX64("macos") { binaries { sharedLib("SharedLib") } } sourceSets { commonMain { /* */ } } } Build.gradle
58. kotlin { jvm() js() macosX64("macos") { binaries { sharedLib("SharedLib") } } sourceSets { commonMain { /* */ } } } Build.gradle
59. MacOS Dynamic Library #ifndef KONAN_LIBSHAREDLIB_H #define KONAN_LIBSHAREDLIB_H #ifdef __cplusplus extern "C" { #endif /* typedefes */ typedef struct { /* Service functions. */ /* ... */ /* User functions. */ struct { struct { struct { const char* (*hello)(); } sample; } root; } kotlin; } libsharedLib_ExportedSymbols; extern libsharedLib_ExportedSymbols* libsharedLib_symbols(void); #ifdef __cplusplus } /* extern "C" */ #endif #endif /* KONAN_LIBSHAREDLIB_H */
60. kotlin { jvm() js() macosX64("macos") { binaries { framework("Framework") } } sourceSets { commonMain { /* */ } } } Build.gradle
61. kotlin { jvm() js() macosX64("macos") { binaries { framework("Framework") } } sourceSets { commonMain { /* */ } } } Build.gradle
62. kotlin { jvm() js() macosX64("macos") { binaries { framework("Framework") } } sourceSets { commonMain { /* */ } } } Build.gradle
63. MacOS Framework #import <Foundation/Foundation.h> NS_ASSUME_NONNULL_BEGIN @interface KotlinBase : NSObject - (instancetype)init __attribute__((unavailable)); + (instancetype)new __attribute__((unavailable)); + (void)initialize __attribute__((objc_requires_super)); @end; @interface KotlinBase (KotlinBaseCopying) <NSCopying> @end; /* More types */ __attribute__((objc_subclassing_restricted)) __attribute__((swift_name("SampleKt"))) @interface FrameworkSampleKt : KotlinBase + (NSString *)hello __attribute__((swift_name("hello()"))); @end; NS_ASSUME_NONNULL_END
64. And specific platforms?
65. fun hello(): String = "Hello from Kotlin Multiplatform" Common
66. object Platform { val name: String } fun hello(): String = "Hello from ${Platform.name}" Common
67. object Platform { val name: String = "JVM" } fun hello(): String = "Hello from ${Platform.name}" JVM
68. object Platform { val name: String = "JS" } fun hello(): String = "Hello from ${Platform.name}" JS
69. object Platform { val name: String = "Native" } fun hello(): String = "Hello from ${Platform.name}" Native
70. Common *.kt *.class *.jar, *.apk *.js binário nativo Android/ NDK iOS Mac Linux Windows Webassembly Outros
71. Common *.kt Kotlin/JVM *.kt, *.java Kotlin/JS *.kt, *.js Kotlin/Native *.kt, *.c *.class *.jar, *.apk *.js binário nativo Android/ NDK iOS Mac Linux Windows Webassembly Others
73. Expect/Actual
74. expect object Platform { val name: String } fun hello(): String = "Hello from ${Platform.name}" Common
75. expect object Platform { val name: String } fun hello(): String = "Hello from ${Platform.name}" Common
76. expect object Platform { val name: String } fun hello(): String = "Hello from ${Platform.name}" Common
77. kotlin { jvm() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { dependencies { implementation kotlin('stdlib-jdk8') } } } } build.gradle
78. kotlin { jvm() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { dependencies { implementation kotlin('stdlib-jdk8') } } } } build.gradle
79. kotlin { jvm() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { dependencies { implementation kotlin('stdlib-jdk8') } } } } build.gradle
80. actual object Platform { actual val name: String = "JVM" } fun hello(): String = "Hello from JVM" JVM
81. actual object Platform { actual val name: String = "JVM" } fun hello(): String = "Hello from JVM" JVM
82. actual object Platform { actual val name: String = "JVM" } fun hello(): String = "Hello from JVM" JVM
83. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { /* */ } jsMain { dependencies { implementation kotlin('stdlib-js') } } } } build.gradle
84. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { /* */ } jsMain { dependencies { implementation kotlin('stdlib-js') } } } } build.gradle
85. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { /* */ } jsMain { dependencies { implementation kotlin('stdlib-js') } } } } build.gradle
86. actual object Platform { actual val name: String = "JS" } fun hello(): String = "Hello from JS" JS
87. actual object Platform { actual val name: String = "JS" } fun hello(): String = "Hello from JS" JS
88. actual object Platform { actual val name: String = "JS" } fun hello(): String = "Hello from JS" JS
89. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { /* */ } jsMain { /* */ } macosMain { } } } build.gradle
90. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { /* */ } jsMain { /* */ } macosMain { } } } build.gradle
91. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { /* */ } jsMain { /* */ } macosMain { } } } build.gradle
92. actual object Platform { actual val name: String = "Native" } fun hello(): String = "Hello from Native” Native
93. actual object Platform { actual val name: String = "Native" } fun hello(): String = "Hello from Native” Native
94. actual object Platform { actual val name: String = "Native" } fun hello(): String = "Hello from Native” Native
95. Tests?
96. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } commonTest { /* */ } jvmMain { /* */ } jvmTest { /* */ } jsMain { /* */ } jsTest { /* */ } macosMain { /* */ } macosTest { /* */ } } } build.gradle
97. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } commonTest { /* */ } jvmMain { /* */ } jvmTest { /* */ } jsMain { /* */ } jsTest { /* */ } macosMain { /* */ } macosTest { /* */ } } } build.gradle
98. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } commonTest { /* */ } jvmMain { /* */ } jvmTest { /* */ } jsMain { /* */ } jsTest { /* */ } macosMain { /* */ } macosTest { /* */ } } } build.gradle
99. kotlin { /* */ sourceSets { /* */ commonTest { dependencies { implementation kotlin('test-common') implementation kotlin('test-annotations-common') } } jvmTest { dependencies { implementation kotlin('test') implementation kotlin('test-junit') } } jsTest { dependencies { implementation kotlin('test-js') } } macosTest { } } } build.gradle
100. import kotlin.test.Test import kotlin.test.assertTrue class SampleTestsJVM { @Test fun testHello() { assertTrue("JVM" in hello()) } } JVM
101. import kotlin.test.Test import kotlin.test.assertTrue class SampleTestsJS { @Test fun testHello() { assertTrue("JS" in hello()) } } JS
102. import kotlin.test.Test import kotlin.test.assertTrue class SampleTestsNative { @Test fun testHello() { assertTrue("Native" in hello()) } } Native
103. expect class Sample() { fun checkMe(): Int } object Platform { val name: String } fun hello(): String = "Hello from ${Platform.name}" Common
104. import kotlin.test.Test import kotlin.test.assertTrue class SampleTests { @Test fun testMe() { assertTrue(Sample().checkMe() > 0) } } Common
105. Libraries
106. Ktor Kotlinx.Coroutines kotlinx.io kotlinx.serialization sqldelight MPSettings Stately KorLibs Acesso a arquivos Melhor suporte a testes Data Estado de UI
108. Multiplatform Chat MVP
109. Architecture Common Client Android iOS Web Server
110. Architecture Android iOS Web Server Main Common Message Client ChatViewModel ChatClient
111. Common ChatClient.kt Kotlin/JVM ChatClient.kt Kotlin/JS ChatClient.kt Kotlin/Native ChatClient.kt *.class *.jar, *.apk *.js binário nativo Android/ NDK iOS Mac Linux Windows Webassembly Others
112. internal expect open class ChatClient(url: String) { open fun start() open fun send(message: Message) open fun receive(receiveBlock: (Message) -> Unit) open fun onFailure(throwableBlock: (Throwable) -> Unit) } Common
113. internal expect open class ChatClient(url: String) { open fun start() open fun send(message: Message) open fun receive(receiveBlock: (Message) -> Unit) open fun onFailure(throwableBlock: (Throwable) -> Unit) } Common
114. internal expect open class ChatClient(url: String) { open fun start() open fun send(message: Message) open fun receive(receiveBlock: (Message) -> Unit) open fun onFailure(throwableBlock: (Throwable) -> Unit) } Common
115. internal actual open class ChatClient actual constructor(val url: String) : WebSocketListener() { actual open fun start() { /* */ } actual open fun send(message: Message) { /* */ } actual open fun receive(receiveBlock: (Message) -> Unit) { /* */ } actual open fun onFailure(throwableBlock: (Throwable) -> Unit) { /* */ } override fun onMessage(webSocket: WebSocket, text: String) { /* */ } override fun onFailure(webSocket: WebSocket, t: Throwable, response: Response?) { /* */ } } Android
116. internal actual open class ChatClient actual constructor(val url: String) : WebSocketListener() { actual open fun start() { /* */ } actual open fun send(message: Message) { /* */ } actual open fun receive(receiveBlock: (Message) -> Unit) { /* */ } actual open fun onFailure(throwableBlock: (Throwable) -> Unit) { /* */ } override fun onMessage(webSocket: WebSocket, text: String) { /* */ } override fun onFailure(webSocket: WebSocket, t: Throwable, response: Response?) { /* */ } } Android
117. internal actual open class ChatClient actual constructor(val url: String) : WebSocketListener() { actual open fun start() { /* */ } actual open fun send(message: Message) { /* */ } actual open fun receive(receiveBlock: (Message) -> Unit) { /* */ } actual open fun onFailure(throwableBlock: (Throwable) -> Unit) { /* */ } override fun onMessage(webSocket: WebSocket, text: String) { /* */ } override fun onFailure(webSocket: WebSocket, t: Throwable, response: Response?) { /* */ } } Android
118. internal actual open class ChatClient actual constructor(val url: String) { actual open fun start() { /* */ } actual open fun send(message: Message) { /* */ } actual open fun receive(receiveBlock: (Message) -> Unit) { /* */ } actual open fun onFailure(throwableBlock: (Throwable) -> Unit) { /* */ } } JS
119. internal actual open class ChatClient actual constructor(val url: String) { actual open fun start() { /* */ } actual open fun send(message: Message) { /* */ } actual open fun receive(receiveBlock: (Message) -> Unit) { /* */ } actual open fun onFailure(throwableBlock: (Throwable) -> Unit) { /* */ } } JS
120. internal actual open class ChatClient actual constructor(val url: String) { actual open fun start() { /* */ } actual open fun send(message: Message) { /* */ } actual open fun receive(receiveBlock: (Message) -> Unit) { /* */ } actual open fun onFailure(throwableBlock: (Throwable) -> Unit) { /* */ } } JS
121. internal actual open class ChatClient actual constructor(val url: String) { actual open fun start() { /* */ } actual open fun send(message: Message) { /* */ } actual open fun receive(receiveBlock: (Message) -> Unit) { /* */ } actual open fun onFailure(throwableBlock: (Throwable) -> Unit) { /* */ } } iOS
122. internal actual open class ChatClient actual constructor(val url: String) { actual open fun start() { /* */ } actual open fun send(message: Message) { /* */ } actual open fun receive(receiveBlock: (Message) -> Unit) { /* */ } actual open fun onFailure(throwableBlock: (Throwable) -> Unit) { /* */ } } iOS
123. internal actual open class ChatClient actual constructor(val url: String) { actual open fun start() { /* */ } actual open fun send(message: Message) { /* */ } actual open fun receive(receiveBlock: (Message) -> Unit) { /* */ } actual open fun onFailure(throwableBlock: (Throwable) -> Unit) { /* */ } } iOS
124. Demo
126. Hands-on
127. Challenges
128. Experimental
129. Threads
130. Debug
131. Testing support
132. Compilation Time
133. Chat MVP delivered
135. felipehjcosta felipe.costa@olxbr.com