RxRIBs: Multiplatform architecture with Rx

6a11050c8147e4f5fbf2637907c27964?s=47 VCNC
November 06, 2018

RxRIBs: Multiplatform architecture with Rx

RxRIBs
Multiplatform architecture with rx

6a11050c8147e4f5fbf2637907c27964?s=128

VCNC

November 06, 2018
Tweet

Transcript

  1. VCNC (Between / TADA) 김 남 현 RxRIBs Multiplatform architecture

    with rx
  2. VCNC (Between / TADA) 김 남 현 VCNC RIBs Multiplatform

    architecture with rx
  3. Table of Contents 1 Why a new architecture? 2 RIBs

    at Uber 3 What we got from RIBs 4 RIBs at VCNC
  4. Why a new architecture?

  5. Why a new architecture? Icons made by Freepik from www.flaticon.com

    is licensed by CC 3.0 BY
  6. Why a new architecture? 4 different apps in 2 platforms

  7. Why a new architecture? Project started 2018.06 Driver α 2018.07

    2018.08 2018.09 2018.10 Rider α Beta Public release
  8. Why a new architecture?

  9. Why a new architecture? VIPER Reflex MVP with Rx

  10. Multi-platform architecture Reference: Tsahi Levent-Levi flickr

  11. Factors to consider No MVC (no MVVM or MVP, too)

    - MVC stands for Massive View Controller - Keeping components simple Single Activity Application - We’re making a map-based application No time to create a framework from scratch - Conductor, Scoop, ReSwift, ReactorKit, Reflex, …
  12. Factors to consider No MVC (no MVVM or MVP, too)

    - MVC stands for Massive View Controller - Keeping components simple Single Activity Application - We’re making a map-based application No time to create a framework from scratch - Conductor, Scoop, ReSwift, ReactorKit, Reflex, …
  13. Factors to consider No MVC (no MVVM or MVP, too)

    - MVC stands for Massive View Controller - Keeping components simple Single Activity Application - We’re making a map-based application No time to create a framework from scratch - Conductor, Scoop, ReSwift, ReactorKit, Reflex, …
  14. Multi-platform architecture https://github.com/uber/RIBs

  15. Uber RIBs Router Interactor Builder

  16. Uber RIBs Router Interactor Builder

  17. Uber RIBs Router Interactor Builder Presenter View

  18. Uber RIBs Router Interactor Builder Presenter View Business logic (a.k.a.

    brain of the app)
  19. Uber RIBs Router Interactor Builder Presenter View Helper for routing

    between RIBs
  20. Uber RIBs Router Interactor Builder Presenter View Build RIB units

  21. Uber RIBs Router Interactor Builder Presenter View Layout & Animation

  22. Uber RIBs Router Interactor Builder Presenter View Translation logic

  23. Uber RIBs Router Interactor Builder Presenter View

  24. Convoluted state machines Change Email Home Screen Menu Search for

    Location Change Vehicle Options Refine Location Request Vehicle Vehicle Matched Receipt On trip Verify Phone Number
  25. State tree Root Main LoggedOut Menu Request Ride LocationEditor Confirm

    Refinement Coupon DroppedOff Card Matched Pending Viewless Viewful Email, PW, ...
  26. RIB tree Root Main LoggedOut Menu Request LocationEditor Confirm Refinement

    Coupon Card Viewless Viewful Ride DroppedOff Matched Pending Email, PW, ...
  27. RIB tree Root Main LoggedOut Menu Request LocationEditor Confirm Refinement

    Coupon Card Viewless Viewful Ride DroppedOff Matched Pending Email, PW, ...
  28. RIB tree Root Main LoggedOut Menu Request LocationEditor Confirm Refinement

    Coupon Card Viewless Viewful Ride DroppedOff Matched Pending Email, PW, ...
  29. RIB tree Root Main LoggedOut Menu Request LocationEditor Confirm Refinement

    Coupon Card Viewless Viewful Ride DroppedOff Matched Pending Email, PW, ...
  30. RIB tree Root Main LoggedOut Menu Request LocationEditor Confirm Refinement

    Coupon Card Viewless Viewful Ride DroppedOff Matched Pending Email, PW, ...
  31. RIB tree Root Main LoggedOut Menu Request LocationEditor Confirm Refinement

    Coupon Card Viewless Viewful Ride DroppedOff Matched Pending Email, PW, ...
  32. RIB tree Root Main LoggedOut Menu Request LocationEditor Confirm Refinement

    Coupon Card Viewless Viewful Ride DroppedOff Matched Pending Email, PW, ...
  33. RIB tree Root Main LoggedOut Menu Request LocationEditor Confirm Refinement

    Coupon Card Viewless Viewful Ride DroppedOff Matched Pending Email, PW, ...
  34. View(ViewController) tree RootView MainView LocationEditor Confirm Refinement Coupon DroppedOff Card

    Matched Pending LoggedOut
  35. Scopes Root

  36. Root Scopes Main (logged in)

  37. Scopes class AuthenticateNetworkRequest: NetworkRequest { private var authToken: String? public

    func makeRequest() { if let authToken = authToken { addAuthToken(authToken) } super.makeRequest() }
  38. Scopes // `authToken` is not null in MainScope class AuthenticateNetworkRequest:

    NetworkRequest { private var authToken: String public func makeRequest() { addAuthToken(authToken) super.makeRequest() } }
  39. Root Scopes Main Ride

  40. Scopes public func refresh() { if let ride = self.ride

    { getRideStatus(ride.id) } else { getUserStatus(self.user!.id) } }
  41. Scopes // `ride` is not null in RideScope public func

    refresh() { getRideStatus(self.ride.id) }
  42. Efficiency in co-working Separation of concern leads to better modularization.

  43. Efficiency in co-working Before RIBs After RIBs

  44. Flow of data (Uber RIBs) Interactor (business logic) Presenter (translation

    logic) Router (attach/detach RIBs) View (layout & interaction)
  45. Flow of data (VCNC RIBs) Interactor (business logic) Presenter (translation

    logic) Router (attach/detach RIBs) View (layout & interaction) Events
  46. Animations No consideration in Uber RIBs Need to think about

    RIBs transitions UITransitioningDelegate in UIViewController HeroTransitions func transition(from: UIViewController, to: UIViewController) in view: UIView, completion: ((Bool) -> Void)? = nil)
  47. Lifecycle Router, Interactor, Presenter, View Active Inactive Router willAttach didAttach

    willDetach didDetach RIBs emit lifecycle events
  48. Wrap-up 1 Multi-platform architecture 2 Router, Inteactor, Builder, Presenter, and

    View 3 Business logic determines the state tree 4 Scopes 5 Unidirectional data flow, Animations, Lifecycle
  49. None