Fluxで複雑な状態の変化を予測可能にするiOSアプリ開発

Reactive Swift Meetup
http://wantedly.connpass.com/event/29039/

Transcript

1. @yonekawa 'MVYͰෳࡶͳঢ়ଶͷมԽΛ
   ༧ଌՄೳʹ͢ΔJ04ΞϓϦ։ൃ
4. GSFFFͷJ04ΞϓϦ
5. https://itunes.apple.com/jp/app/id811207074
6. ಛ௃తͳ՝୊ • ͋Δೖྗ΍બ୒ʹΑͬͯ௥ՃͷϑΥʔϜ͕දࣔ/ඇදࣔʹ ͳͬͨΓ͢Δέʔε͕ଟ͘ɺViewͷঢ়ଶ؅ཧ͕ෳࡶ • 1ͭͷσʔλมߋॲཧʹରͯ͠ෳ਺ͷϞσϧ͕ؔ࿈͠ɺґଘ ͠߹͏͜ͱ͕ଟ͍ • ΞϓϦͱͯ͠ͷػೳͷଟ͞ɺͦΕΒ͕૬ޓʹؔ࿈͋͠͏ը໘ ભҠͷෳࡶ͞
7. MVVMͷ࠾༻ • ViewModelͰViewͷঢ়ଶͱϏδωεϩδοΫΛ؅ཧ • ReactiveCocoaͷRACSignalΛView͕subscribeͯ͠ঢ়ଶΛ όΠϯσΟϯά͢Δ • ViewModelʹมԽ͕ى͖Δͱ֘౰ͷϓϩύςΟͷมߋ͕ RACSignalʹΑͬͯ௨஌͞ΕɺView͕൓Ԡ͢Δ
8. ViewController ViewModel APIClient ߏ੒ VIEW VIEW View ϝιουݺͼग़͠ RACSignal VIEW VIEW Model
9. ݱঢ়ͷ՝୊ • ΞϓϦͷن໛͕େ͖͘ͳΔʹͭΕͯɺUIΠϕϯτ΍γεςϜ ΠϕϯτʹΑΔঢ়ଶͷมԽΛ؅ཧͰ͖ͳ͘ͳ͖ͬͯͨ • ViewModelͱͷ૒ํ޲όΠϯσΟϯάʹΑΔґଘؔ܎ͷ ༧ଌͷͮ͠Β͞ • ঢ়ଶͷ؅ཧͱϞσϧͷૢ࡞ͱυϝΠϯϩδοΫ͕ີ݁߹ • Ͳ͜Ͱ୭ʹΑͬͯԿ͕มΘͬͯࠓͲ͏ͳͬͯΔͷ͔͕௥͍͔ ͚ͮΒ͍
10. WebϑϩϯτΤϯυ͔ΒֶͿ • JavaScriptͷੈքͰ͸MVVM (2way-binding) ͸͏·͘ड͚ ೖΕΒΕͳ͔ͬͨ • Reactͷొ৔ʹΑͬͯΞʔΩςΫνϟͷτϨϯυ͸FluxΛݩ ʹͨ͠୯ํ޲ϑϩʔ΁
11. Flux facebook/flux: Application Architecture for Building User Interfaces
12. ΑΓྑ͍ΞʔΩςΫνϟ΁ͷԾઆ • WebϑϩϯτΤϯυͷྺ࢙͔ΒɺfreeeΞϓϦ๊͕͍͑ͯΔ ໰୊͸૒ํ޲όΠϯσΟϯάͷຊ࣭తͳ໰୊ͳͷͰ͸ • ୯ํ޲ϑϩʔͷίϯηϓτ͸iOSʹ͓͍ͯ΋Viewͷঢ়ଶ؅ཧ Λ៉ྷʹ͢ΔͨΊʹ༗༻ͳͷͰ͸
13. 'MVYͷ࠾༻
14. جຊϑϩʔ • Viewͷঢ়ଶΛStore͕࣋ͪɺStore͸ActionͷൃߦΛ଴ͪड ͚Δ • StoreΛ֎෦͔Βมߋ͢Δ͜ͱ͸Ͱ͖ͣɺdispatch͞Εͨ ActionʹԠͯࣗ͡਎Ͱมߋ͢ΔͷΈ • Store͸ͦΕ͕มߋ͞Εͨ͜ͱͷΈΛViewʹ௨஌͢Δ • มߋ͞Εͨࠩ෼ΛૹͬͨΓ͸͠ͳ͍ • View͸ৗʹStoreͷ࠷৽ͷঢ়ଶ͔Βߏங͞ΕΔ
15. ։ൃํ਑ • جຊతʹViewControllerͱ1:1ͰStoreΛ࡞Γঢ়ଶΛ؅ཧ͢Δ • ΞϓϦέʔγϣϯશମͷঢ়ଶʢೝূ͍ͯ͠Δͱ͔ʣΛ؅ཧ͢Δ StoreΛ࡞Γɺάϩʔόϧʹอ࣋͢Δ • APIϦΫΤετ͸ActionCreatorͰߦ͍ɺ݁ՌΛActionͷ Payloadͱͯ͠Storeʹड͚౉͢ • Realm(DB)΁ͷอଘ͸ΞϓϦέʔγϣϯͷঢ়ଶมԽͱΈͳ͠ StoreͰߦ͏
16. Store ViewController Store ViewController ߏ੒ Dispatcher Action Action Store Store (Global) Store ViewController ActionCreator Action Action Application
17. ϥΠϒϥϦԽ • https://github.com/yonekawa/SwiftFlux • DispatcherͱͦΕʹඥͮ͘Action/Storeͷந৅Խ • ReduceStoreͱ͔Flux Utils΋Ұ෦࣮૷ͯ͠Δ • ϓϩτίϧࢦ޲ͰSwiftΒ͠͞Λҙࣝͨ͠
18. struct FetchTodo: Action { typealias Payload = [Todo] func invoke(dispatcher: Dispatcher) { Session.sendRequest(FetchTodoRequest()) { result in switch result { case .Success(let todos): dispatcher.dispatch(self, result: Result(value: todos)) case .Failure(let error): dispatcher.dispatch(self, result: Result(error: error)) } } } } Action
19. class TodoStore: StoreBase { private(set) var todos: [Todo] private(set) var error: Error? func init() { register(FetchTodo.self) { (result) in switch result { case .Success(let todos): error = nil self.todos = payload emitChange() case .Failure(let error): self.error = error emitChange() } } } } Store
20. class ViewController: UITableViewController { let store = TodoStore() func viewDidLoad() { super.viewDidLoad() store.subscribe { () in tableView.reloadData() } ActionCreator.invoke(FetchAction()) } } ViewController
21. ࣮ઓ౤ೖ https://itunes.apple.com/jp/app/id1037197002
22. ϝϦοτ • View͸ৗʹStore͔Βશͯߏங͞ΕΔͷͰɺݱࡏͷViewͷঢ় ଶ͕໌ࣔతʹͳΓݟ௨͕͠Α͘ͳΔ • StoreΛߋ৽͢Δͷ͸Storeࣗ਎͔͋͠Γಘͳ͍ͷͰɺঢ়ଶͷ มԽ͸֘౰ͷAction͕ൃߦ͞Ε͔ͨΛ௥͏͚ͩͰΑ͍ • APIϦΫΤετ౳ͷঢ়ଶΛม͑ಘΔϩδοΫͱঢ়ଶΛ؅ཧ͢ Δ৔ॴΛ໌֬ʹ෼͚ΒΕΔ
23. Viewͷࠩ෼ߋ৽ • Swiftͷੈքʹ͸React͕ଘࡏ͠ͳ͍ɻͦΕͬΆ͍΋ͷ͸͍͘ ͔ͭ͋Δ͕Viewͷ࡞Γํ͕ಠࣗʹͳ͓ͬͯΓɺUIKit͕ఏڙ ͢Δ΋ͷ͔Β֎ΕΔͷ͸ϦεΫ͕ߴ͍ • ViewΛຖճ࠶ߏங͢Δͷ͸ίετ͕͔͔ΔͷͰࠩ෼ߋ৽͕ ඞཁɻ͔͠͠ؾΛ͚ͭͳ͍ͱঢ়ଶΛ࡞ͬͯ͠·͏ɻ • UITableViewͳͲΛ͏·ࠩ͘෼ߋ৽͢Δ൚༻తͳ࢓૊Έ͕΄ ͍͠
24. ίʔυྔ͸૿͑Δ • ঢ়ଶΛม͑ΔͨΊʹຖճActionͱStoreʹ࣮૷͕ඞཁ • ୯७ͳೖྗ஋ͷ൓өͳͲ΋ຖճDispatcherΛܦ༝ͯ͠Store ΁ૹΔͷͰ৑௕ʹͳΔ • ঢ়ଶΛ؅ཧ͢ΔͨΊͷखؒͱͯ͋͠Δఔ౓͸͔ͨ͠ͳ͍
25. Τϥʔॲཧ • ActionΛ࡞Δͱ͖ʹൃੜͨ͠ΤϥʔΛͲ͏ѻ͏΂͖͔ɻࠓ ͸Τϥʔ΋ը໘ͷঢ়ଶͷ̍ͭͱͯ͠Storeʹ౉͍ͯ͠Δ • SVProgressHUDͷΑ͏ͳग़͙ͯ͢ফ͑ΔUIΛ࢖͏৔߹ɺ Store͕࣋ͭΤϥʔঢ়ଶΛஞҰϦηοτ͢Δͷ͕໘౗
26. Ξχϝʔγϣϯ • ۪௚ʹ΍Δͱ͍͢͝ճ਺ͷϑϩʔ͕ճΔ • Ξχϝʔγϣϯͷ։࢝ͱऴྃΛঢ়ଶͱͯ͠؅ཧ͢Δ΂͖ʁ • ReactͰ΋͜Ε͸ঢ়ଶ؅ཧͷର৅֎ͱ͍ͯ͠Δ༷ࢠ
27. 'MVY
    WT
    3FEVY
28. Redux • ΞϓϦέʔγϣϯͷঢ়ଶ͸1ͭͷStoreΦϒδΣΫτ͕؅ཧ ͢Δ • State͸ϦʔυΦϯϦʔͰActionͷൃߦʹΑͬͯͷΈมߋ͞ ΕಘΔ • ঢ়ଶͷભҠ͸ͨͩͷؔ਺(Reducer)ʹΑͬͯߦ͏
29. ReduxͷϝϦοτ • Store͕1͔ͭ͠ଘࡏ͠ͳ͍ͨΊɺঢ়ଶ͕มΘΔ৔ॴ͕ΑΓ ݶఆ͞Εͯݟ௨͠΍͘͢ͳΔ • ҰՕॴͰશͯͷঢ়ଶ͕มΘΔͨΊɺ׬શͳมߋͷཤྺΛอ ࣋Ͱ͖Δ͜ͱʹΑΓɺUndo/RedoͳͲ΋༰қ • Reducerؔ਺͸લͷঢ়ଶʹॲཧΛՃ͑ͯ৽͍͠ঢ়ଶΛฦͩ͢ ͚ͳͷͰςετ͠΍͍͢
30. Redux or Flux? • جຊతʹ͸ReduxͷSingle State Tree͸ΑΓྑ͍ঢ়ଶ؅ཧͷ ࢓૊ΈΛఏڙͯ͘͠ΕΔͷͰΑ͍ • Redux͸Single State TreeΛલఏʹσβΠϯ͞Ε͍ͯΔͷ ͰɺΞϓϦέʔγϣϯશମΛͦΕલఏʹ࡞Βͳ͍ͱ͍͚ͳ͍ • Flux͸੍໿͕؇͍ͷͰɺෳࡶͳUIΛ෦෼తʹஔ͖׵͑ΔͳͲ طଘͷΞϓϦʹ΋ೖΕ΍͍͢
31. ReSwift • https://github.com/ReSwift/ReSwift • ReduxͷSwift࣮૷ • ৄ͘͠͸ninjinkun͞Μ͕࿩ͯ͘͠ΕΔͱࢥ͍·͢ɻ
32. ·ͱΊ
33. ·ͱΊ • ୯ํ޲ϑϩʔͷΞʔΩςΫνϟ͸Viewͷঢ়ଶΛݟ௨͠΍͢ ͯ͘͘͠ΕΔͷͰiOSʹ͓͍ͯ΋ϝϦοτ͕͋Δ • React͕ແ͍ͨΊStoreͷঢ়ଶ͔Βޮ཰Α͘ViewΛ࡞Δͱ͜ Ζʹ՝୊͕͋Δ͕ɺ޻෉ͷ༨஍͸͋Γͦ͏ • ϥΠϒϥϦ͸ࠓͷͱ͜ΖReSwift͕ຊ໋͕ͩɺطଘΞϓϦʹ ద༻͢ΔͳΒγϯϓϧͳFlux΋͋Γ
34. SwiftFluxͷࠓޙͷల๬ • ΋ͬͱܕ҆શʹͰ͖ΔΑ͏ʹΠϯλϑΣʔεΛݟ௚͍ͨ͠ • ෳ਺ͷStoreΛଋͶͯ؅ཧͰ͖ΔStoreGroupతػೳ • ൚༻తͳࠩ෼ߋ৽ͷͨΊͷUIϢʔςΟϦςΟ