Code reuse with Kotlin Multiplatform

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/hello-world-multiplatform
- https://github.com/felipehjcosta/marvel-client
- https://github.com/felipehjcosta/chat-app

References:
- https://touchlab.co/future-cross-platform-native/
- https://www.youtube.com/watch?v=c8IkWGmlcNE
- https://www.youtube.com/watch?v=Dul17VSiejo
- https://www.youtube.com/watch?v=nw6YTfEyfO0
- https://www.youtube.com/watch?v=pcwIs749KSE
- https://medium.com/xebia-france/understanding-the-basics-of-multiplatform-projects-in-kotlin-1-3-1221689b3084

Transcript

1. Code reuse with Kotlin Multiplatform
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
19. Code sharing not “cross platform”
20. Activity community
21. Good tools
22. Modern Language
23. Not UI not necessarily
24. Many Platforms
25. Common *.kt
26. plugins { id 'kotlin-multiplatform' version '1.3.31' } repositories { mavenCentral() } kotlin { sourceSets { commonMain { dependencies { implementation kotlin('stdlib-common') } } } } Build.gradle
27. plugins { id 'kotlin-multiplatform' version '1.3.31' } repositories { mavenCentral() } kotlin { sourceSets { commonMain { dependencies { implementation kotlin('stdlib-common') } } } } Build.gradle
28. plugins { id 'kotlin-multiplatform' version '1.3.31' } repositories { mavenCentral() } kotlin { sourceSets { commonMain { dependencies { implementation kotlin('stdlib-common') } } } } Build.gradle
29. plugins { id 'kotlin-multiplatform' version '1.3.31' } repositories { mavenCentral() } kotlin { sourceSets { commonMain { dependencies { implementation kotlin('stdlib-common') } } } } Build.gradle
30. Common *.kt
31. Common *.kt *.class *.jar, *.apk
32. kotlin { jvm() sourceSets { commonMain { /* */ } } } Build.gradle
33. kotlin { jvm() sourceSets { commonMain { /* */ } } } Build.gradle
34. kotlin { jvm() sourceSets { commonMain { /* */ } } } Build.gradle
35. Common *.kt *.class *.jar, *.apk
36. Common *.kt *.class *.jar, *.apk *.js
37. kotlin { jvm() js() sourceSets { commonMain { /* */ } } } Build.gradle
38. kotlin { jvm() js() sourceSets { commonMain { /* */ } } } Build.gradle
39. kotlin { jvm() js() sourceSets { commonMain { /* */ } } } Build.gradle
40. Common *.kt *.class *.jar, *.apk *.js
41. Common *.kt *.class *.jar, *.apk *.js binário nativo Android/ NDK iOS Mac Linux Windows Webassembly Outros
42. Common *.kt *.class *.jar, *.apk *.js binário nativo Android/ NDK iOS Mac Linux Windows Webassembly Outros
43. 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
44. 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
45. 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
46. fun hello(): String = "Hello from Kotlin Multiplatform" Common
47. 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
48. 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
49. MacOS Binary .kexe
50. kotlin { jvm() js() macosX64("macos") { binaries { sharedLib("sharedLib") } } sourceSets { commonMain { /* */ } } } Build.gradle
51. kotlin { jvm() js() macosX64("macos") { binaries { sharedLib("sharedLib") } } sourceSets { commonMain { /* */ } } } Build.gradle
52. kotlin { jvm() js() macosX64("macos") { binaries { sharedLib("sharedLib") } } sourceSets { commonMain { /* */ } } } Build.gradle
53. 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 */
54. kotlin { jvm() js() macosX64("macos") { binaries { framework("framework") } } sourceSets { commonMain { /* */ } } } Build.gradle
55. kotlin { jvm() js() macosX64("macos") { binaries { framework("framework") } } sourceSets { commonMain { /* */ } } } Build.gradle
56. kotlin { jvm() js() macosX64("macos") { binaries { framework("framework") } } sourceSets { commonMain { /* */ } } } Build.gradle
57. 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
58. fun hello(): String = "Hello from Kotlin Multiplatform" Common
59. object Platform { val name: String } fun hello(): String = "Hello from ${Platform.name}" Common
60. object Platform { val name: String = "JVM" } fun hello(): String = "Hello from ${Platform.name}" JVM
61. object Platform { val name: String = "JS" } fun hello(): String = "Hello from ${Platform.name}" JS
62. object Platform { val name: String = "Native" } fun hello(): String = "Hello from ${Platform.name}" Native
63. Common *.kt Kotlin/JVM *.kt, *.java Kotlin/JS *.kt, *.js Kotlin/Native *.kt *.class *.jar, *.apk *.js binário nativo Android/ NDK iOS Mac Linux Windows Webassembly Others
64. Libraries
65. expect object Platform { val name: String } fun hello(): String = "Hello from ${Platform.name}" Common
66. expect object Platform { val name: String } fun hello(): String = "Hello from ${Platform.name}" Common
67. expect object Platform { val name: String } fun hello(): String = "Hello from ${Platform.name}" Common
68. kotlin { jvm() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { dependencies { implementation kotlin('stdlib-jdk8') } } } } build.gradle
69. kotlin { jvm() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { dependencies { implementation kotlin('stdlib-jdk8') } } } } build.gradle
70. kotlin { jvm() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { dependencies { implementation kotlin('stdlib-jdk8') } } } } build.gradle
71. actual object Platform { actual val name: String = "JVM" } fun hello(): String = "Hello from JVM" JVM
72. actual object Platform { actual val name: String = "JVM" } fun hello(): String = "Hello from JVM" JVM
73. actual object Platform { actual val name: String = "JVM" } fun hello(): String = "Hello from JVM" JVM
74. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { /* */ } jsMain { dependencies { implementation kotlin('stdlib-js') } } } } build.gradle
75. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { /* */ } jsMain { dependencies { implementation kotlin('stdlib-js') } } } } build.gradle
76. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { /* */ } jsMain { dependencies { implementation kotlin('stdlib-js') } } } } build.gradle
77. actual object Platform { actual val name: String = "JS" } fun hello(): String = "Hello from JS" JS
78. actual object Platform { actual val name: String = "JS" } fun hello(): String = "Hello from JS" JS
79. actual object Platform { actual val name: String = "JS" } fun hello(): String = "Hello from JS" JS
80. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { /* */ } jsMain { /* */ } macosMain { } } } build.gradle
81. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { /* */ } jsMain { /* */ } macosMain { } } } build.gradle
82. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } jvmMain { /* */ } jsMain { /* */ } macosMain { } } } build.gradle
83. actual object Platform { actual val name: String = "Native" } fun hello(): String = "Hello from Native” Native
84. actual object Platform { actual val name: String = "Native" } fun hello(): String = "Hello from Native” Native
85. actual object Platform { actual val name: String = "Native" } fun hello(): String = "Hello from Native” Native
86. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } commonTest { /* */ } jvmMain { /* */ } jvmTest { /* */ } jsMain { /* */ } jsTest { /* */ } macosMain { /* */ } macosTest { /* */ } } } build.gradle
87. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } commonTest { /* */ } jvmMain { /* */ } jvmTest { /* */ } jsMain { /* */ } jsTest { /* */ } macosMain { /* */ } macosTest { /* */ } } } build.gradle
88. kotlin { jvm() js() macosX64("macos") sourceSets { commonMain { /* */ } commonTest { /* */ } jvmMain { /* */ } jvmTest { /* */ } jsMain { /* */ } jsTest { /* */ } macosMain { /* */ } macosTest { /* */ } } } build.gradle
89. 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
90. import kotlin.test.Test import kotlin.test.assertTrue class SampleTestsJVM { @Test fun testHello() { assertTrue("JVM" in hello()) } } JVM
91. import kotlin.test.Test import kotlin.test.assertTrue class SampleTestsJS { @Test fun testHello() { assertTrue("JS" in hello()) } } JS
92. import kotlin.test.Test import kotlin.test.assertTrue class SampleTestsNative { @Test fun testHello() { assertTrue("Native" in hello()) } } Native
93. expect class Sample() { fun checkMe(): Int } object Platform { val name: String } fun hello(): String = "Hello from ${Platform.name}" Common
94. import kotlin.test.Test import kotlin.test.assertTrue class SampleTests { @Test fun testMe() { assertTrue(Sample().checkMe() > 0) } } Common
95. Ktor Kotlinx.Coroutines kotlinx.io kotlinx.serialization sqldelight MPSettings Stately KorLibs File Access Better test support Date UI state
96. Multiplatform Chat MVP
97. Architecture Common Client Android iOS Web Server
98. Architecture Android iOS Web Server Main Common Message Client ChatViewModel ChatClient
99. Common ChatClient.kt Kotlin/JVM ChatClient.kt Kotlin/JS ChatClient.kt Kotlin/Native ChatClient.kt ChatClient.class ChatClient.js binário nativo Android/ NDK iOS Mac Linux Windows Webassembly Outros
100. 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
101. 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
102. 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
103. 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
104. 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
105. 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
106. 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
107. 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
108. 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
109. 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) { /* */ } inner class WebSocketDelegate : NSObject(), SRWebSocketDelegateProtocol { override fun webSocket(webSocket: SRWebSocket?, didReceiveMessage: Any?) { /* */ } } } iOS
110. 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) { /* */ } inner class WebSocketDelegate : NSObject(), SRWebSocketDelegateProtocol { override fun webSocket(webSocket: SRWebSocket?, didReceiveMessage: Any?) { /* */ } } } iOS
111. 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) { /* */ } inner class WebSocketDelegate : NSObject(), SRWebSocketDelegateProtocol { override fun webSocket(webSocket: SRWebSocket?, didReceiveMessage: Any?) { /* */ } } } iOS
112. Demo
114. Challenges
115. Experimental
116. Threads
117. Debug
118. Compile Time
119. Chat MVP delivered
121. felipehjcosta felipe.costa@olxbr.com