CONFIDENTIAL FREELETICS GMBH Lessons Learned from a Shared Codebase 

● Existing Cross Platform solutions ● Kotlin Native ● Future ● Q&A ● Demo CONFIDENTIAL FREELETICS GMBH Agenda 

Presentation Layer Application Layer Data Access Layer View ViewModel Business Rules Navigation Interactor Use Case Repository DAO DB - HTTP - FS Layered Architecture 

Presentation Layer Application Layer Data Access Layer View ViewModel Business Rules Navigation Interactor Use Case Repository DAO DB - HTTP - FS Web HTML + CSS React Redux HTTP GraphQL Web Standards like JS 

Presentation Layer Application Layer Data Access Layer View ViewModel Business Rules Navigation Interactor Use Case Repository DAO DB - HTTP - FS Web / PWA HTML + CSS React Redux HTTP GraphQL Service Worker Web Standards like JS 

Presentation Layer Application Layer Data Access Layer View ViewModel Business Rules Navigation Interactor Use Case Repository DAO DB - HTTP - FS Web Standards like JS - kind of Ionic / Cordova HTML + CSS React UI Components Redux OS Bridge i.e. Camera HTTP native 

Presentation Layer Application Layer Data Access Layer View ViewModel Business Rules Navigation Interactor Use Case Repository DAO DB - HTTP - FS Java Script React Native Native UI React Redux OS Bridge i.e. Camera HTTP native native 

Presentation Layer Application Layer Data Access Layer View ViewModel Business Rules Navigation Interactor Use Case Repository DAO DB - HTTP - FS C# (compiles arm, Runtime) Xamarin Xamarin Forms ViewModel BLoC Redux OS Bridge i.e. Camera HTTP native Native UI native 

Presentation Layer Application Layer Data Access Layer View ViewModel Business Rules Navigation Interactor Use Case Repository DAO DB - HTTP - FS Dart (compiles native arm) Flutter UI Drawing Components BLoC Redux OS Bridge i.e. Camera HTTP native 

Presentation Layer Application Layer Data Access Layer View ViewModel Business Rules Navigation Interactor Use Case Repository DAO DB - HTTP - FS C++ / JNI C++ / Rust / Swift Logic OS HTTP native View native ViewModel Navigation Business 

Presentation Layer Application Layer Data Access Layer View ViewModel Business Rules Navigation Interactor Use Case Repository DAO DB - HTTP - FS Kotlin (JVM, ARM) Kotlin Native Business Logic OS HTTP native View native ViewModel Navigation 

Business Logic OS HTTP View ViewModel Navigation Logic OS HTTP View ViewModel Navigation Business C++ / Rust Kotlin Native Native UI React Xamarin Forms Redux OS Bridge i.e. Camera HTTP Xamarin React Native UI Drawing Components BLoC Redux OS Bridge i.e. Camera HTTP Flutter HTML React Redux HTTP GraphQL Ionic Web OS Bridge 

Why do I talk about Kotlin Native? CONFIDENTIAL FREELETICS GMBH 

So, what is Kotlin Native? CONFIDENTIAL FREELETICS GMBH 

How to build a Kotlin Native App? CONFIDENTIAL FREELETICS GMBH 

CONFIDENTIAL FREELETICS GMBH Project Structure 

CONFIDENTIAL FREELETICS GMBH Expect / Actual In CommonMain In AndroidMain In TvOSMain expect fun log(tag: String, message: String) import android.util.Log actual fun log(tag: String, message: String) { Log.d(tag, message) } import platform.Foundation.NSLog actual fun log(tag: String, message: String) { NSLog("${tag}: ${message}") } 

FreeleticsTV How Freeletics would look like on a TV... CONFIDENTIAL FREELETICS GMBH 

CONFIDENTIAL FREELETICS GMBH tvOS https://youtu.be/EAXAxgsx_AI 

CONFIDENTIAL FREELETICS GMBH AndroidTV https://youtu.be/gK7xERZoUu0 

Use an architecture that allows to share as much code as possible! CONFIDENTIAL FREELETICS GMBH Main goals 

Architecture Android tvOS common common 

CONFIDENTIAL FREELETICS GMBH Workout StateMachine inState { observeWhileInState(countdownStopWatch.timeElapsed()) { _, _, setState -> setState { state -> val timeLeft = state.timeLeft - 1 if (timeLeft >= 0) { CountdownState(timeLeft) } else { createFirstExerciseState(rounds) } } } } data class CountdownState( val timeLeft: Int ) 

CONFIDENTIAL FREELETICS GMBH Workout StateMachine inState { on { action, getState, setState -> setState { state -> createNextExerciseState(state, rounds) } } } data class ExerciseState( override var secondsElapsed: Long = 0, override var currentRoundIndex: Int = 0, override var currentExerciseIndex: Int = 0, override var workoutProgress: Int = 0, override var nextExercise: RoundExercise? ) 

CONFIDENTIAL FREELETICS GMBH Workout StateMachine class MyStateMachine ( initialState: MyState ): FlowReduxStateMachine(initialState) { inState { on { action, getState, setState -> setState { //create new state } } //on {...} } inState { observeWhileInState(someFlowWhichEmitsValues) { value, getState, setState -> setState { //create new state } } //on {...} } } 

CONFIDENTIAL FREELETICS GMBH Testing the StateMachine Given("a workout with a single round") { //initialize StateMachine and required data here val state = stateMachine.state.record() And("the user wants to do the workout") { When("it starts") { Then("it starts with a countdown and 5 seconds left") { state shouldEmitNext WorkoutState.CountdownState(5) } } for (i in 4 downTo 0) { When("One countdown second elapsed") { countdown.nextTick() Then("Time left in CountdownState is $i") { state shouldEmitNext WorkoutState.CountdownState(i) } } } //When(...) When("Next Button clicked") { stateMachine.nextExercise() Then("next exercise state is emitted") { state shouldEmitNext RepExerciseState(...) } } } 

Use an architecture that allows to share as much code as possible! How did we achieve that goal? - Fragment / ViewController -> ViewModel -> StateMachine -> Repository -> DB/API - Make it easy to render the UI! (By using a state machine which is easy to read and test) CONFIDENTIAL FREELETICS GMBH Main goals 

CONFIDENTIAL FREELETICS GMBH How much code did I share? Android Code: ~2500 LOC TvOS Code: ~1400 LOC Shared Code: ~4600 LOC 

- TvOS wasn’t even supported when we started - Libraries had a hard time catching up to changes - Coroutines can only be used in Kotlin - Features have to be possible on both platforms (e.g. background services) - There is not always an answer for your problem CONFIDENTIAL FREELETICS GMBH Challenges 

Would you use Kotlin Native in a real project? CONFIDENTIAL FREELETICS GMBH 

Future? 

CONFIDENTIAL FREELETICS GMBH Write once, run everywhere 

CONFIDENTIAL FREELETICS GMBH Write once, run away! 

CONFIDENTIAL FREELETICS GMBH Learn once, write anywhere 

CONFIDENTIAL FREELETICS GMBH inState { observeWhileInState(countdownStopWatch.timeElapsed()) { ... } } inState { on { ... } } 

CONFIDENTIAL FREELETICS GMBH class WorkoutScreen extends React.Component { render() { if (this.state instanceof CountdownState) return ; else if (this.state instanceof ExerciseState) return ; } } 

CONFIDENTIAL FREELETICS GMBH class WorkoutScreen : View { @State var state: State var body: some View { switch(state){ case let countdown as CountdownState: Countdown(timeLeft: countdown.timeLeft) case let exercise as ExerciseState: Exercise(exercise: exercise) } } } 

CONFIDENTIAL FREELETICS GMBH @Composable fun WorkoutScreen(state : State) { when(state){ is CountdownState -> Countdown(state.timeLeft) is ExcerciseState -> Exercise(state) } } 

Q&A 

Demo 

CONFIDENTIAL FREELETICS GMBH KEEP CALM AND SHIP IT