Tach Talk Tokyo #5

1. MVVM IS LIKE FRACTURE
TECH TALK TOKYO VOL.5 10/5

3. HAVE YOU RECENTLY BEEN FRACTURE?

4. I HAD A FRACTURE BEFORE
RELEASE MY PROJECT.

5. MVVM≒

6. TODAY, I’D LIKE TO TALK ABOUT MVVM.

7. INTRODUCTION
KENTARO HANEDA (27) @JUMBOS5
▸ Job
▸ RareJob.
Consumer Dept. Mobile Developer
▸ Job History
▸ Retty 👉 Yahoo!JAPAN（ヤフオク）👉 RareJob
▸ Work/Interest
▸ Go/iOS/Kotlin/Python/Marketing

8. PORTFOLIO
DEV.
「レアジョブ日常英会話アプリ」
Swift2.3/Universal/1month
InShade
Backend (RoR/MySQL/PhantomJS)
Swift2.0
Android (Kotlin/RxJava)
released by adriablue.
lanskip
Week end commit.
Backend (Azure/Golang/Revel)

9. WHAT’S MVVM?

10. RAREJOB APP ARCHITECTURE
My App has many state.

11. RAREJOB APP ARCHITECTURE
View
View
Model
Model
Binding Update
Fetch
View
View
Controller
Model
Update
Action
Action
Update
MVVM?
or
MVC?

12. RAREJOB APP ARCHITECTURE
View
View
Model
Model
Binding Update
Fetch
View
View
Controller
Model
Update
Action
Action
Update
????????????????

13. RAREJOB APP ARCHITECTURE
View
View
Model
Model
Binding Update
Fetch
????????????????

14. STEP
FRACTURE
1. Slip Human.
2. Born has damage
3. Human to “Fracture”

15. STEP
MVVM
1. View get action.
2. Change value.
3. Change View and State.
View
View
Model
Model
Binding Update
Fetch

16. STEP
View
View
Model
Model
Binding Update
Fetch
class ArmView{
var vm:ArmViewModel
var skin:Skin
var hand:Hand
func slip()
}
class ArmViewModel{
var state:ArmStatus
var born:BornModel
…
}
class BornModel{
var count:Int
var damage:Float
…
}

17. View
View
Model
Model
Binding Update
Fetch
class ArmView{
var vm:ArmViewModel
var skin:Skin
var hand:Hand
func slip()
}
class ArmViewModel{
var state:ArmStatus
var born:BornModel
…
}
class BornModel{
var count:Int
var damage:Float
…
}
Call slip()
change viewmodel
property “born”
STEP

18. View
View
Model
Model
Binding Update
Fetch
class ArmView{
var vm:ArmViewModel
var skin:Skin
var hand:Hand
func slip()
}
class ArmViewModel{
var state:ArmStatus
var born:BornModel
…
}
class BornModel{
var count:Int
var damage:Float
…
}
Change values,
and change “state”
STEP

19. View
View
Model
Model
Binding Update
Fetch
class ArmView{
var vm:ArmViewModel
var skin:Skin
var hand:Hand
func slip()
}
class ArmViewModel{
var state:ArmStatus
var born:BornModel
…
}
class BornModel{
var count:Int
var damage:Float
…
}
Change “value”,
then change “state”
then change “view”
STEP

20. View
View
Model
Model
Binding Update
Fetch
STEP
MVVM is …
🙅 born broken then state to Fracture , next view to
Fracture.
🙆 born broken then state to Fracture then view to
Fracture. ≒ BINDING

21. HOW TO USE
MVVM?

22. RAREJOB APP ARCHITECTURE
How my app to mvvm?

23. Reserve
View
Reserve
ViewModel
:StateView
Model
Teacher
DataStore
Teacher
Model
RxSwift
ViewController ViewModel Repository Model
APIKIT
MVVM
RAREJOB APP ARCHITECTURE

24. Reserve
View
Reserve
ViewModel
:StateView
Model
Teacher
DataStore
Teacher
Model
RxSwift
ViewController ViewModel Repository Model
APIKIT
RxSwift can Binding value to view. So
be able to Create View Behavior
Declaratively.
But this library is a little heavy, need to
long build time.
MVVM
RAREJOB APP ARCHITECTURE

25. Reserve
View
Reserve
ViewModel
:StateView
Model
Teacher
DataStore
Teacher
Model
RxSwift
ViewController ViewModel Repository Model
APIKITThis layer can provide interface, even
if ViewModel is not understand need
to use Cache or API.
MVVM
RAREJOB APP ARCHITECTURE

26. Reserve
View
Reserve
ViewModel
:StateView
Model
Teacher
DataStore
Teacher
Model
RxSwift
ViewController ViewModel Repository Model
APIKITModel layer is tend to be complex.
But this OSS can code simply.
MVVM
RAREJOB APP ARCHITECTURE

27. Reserve
View
Reserve
ViewModel
:StateView
Model
Teacher
DataStore
Teacher
Model
RxSwift
ViewController ViewModel Repository Model
APIKITModel layer is tend to be complex.
But us this OSS can code simply.
MVVM
RAREJOB APP ARCHITECTURE
Model layer is tend to be complex.
But us this OSS can code simply.
Model layer is tend to be complex.
But us this OSS can code simply.
Each layer is loose coupling.
so each component is useful!

28. ∼ After Release ∼
OK, RELEASE GOOD….
I WANT TO UPDATE AND TESTING MORE!!
BUT ONLY HAVE 1 BUILD DEVICE…
IOS ENGINEER, IT’S ME ONLY…
＿人人人人人人人人人人人＿
＞ HELP ME！Someone！＜
￣Y^Y^Y^Y^Y^Y^Y^Y^Y￣
OK,
ADDITIONAL

29. bitrise
ADDITIONAL

30. ・What’s Good point?
- Free plan is substantial.
- Setting is simply.
- Can provide TestFairy, and
Upload to iTunesConnect
Simply using by fastlane.
- Can connect easily
Vender Service
- also use android.
ADDITIONAL

31. ENDING
CONCLUSION
▸ MVVM can explain using by
Fracture.
▸ bitrise is so good.

32. Please do not keep me alone.
We now hiring Designer and Engineer. :)
Please keep healthy….
Thank you.