Slide 1

Slide 1 text

@yonekawa 'MVYͰෳࡶͳঢ়ଶͷมԽΛ ༧ଌՄೳʹ͢ΔJ04ΞϓϦ։ൃ

Slide 2

Slide 2 text

No content

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

GSFFFͷJ04ΞϓϦ

Slide 5

Slide 5 text

https://itunes.apple.com/jp/app/id811207074

Slide 6

Slide 6 text

ಛ௃తͳ՝୊ • ͋Δೖྗ΍બ୒ʹΑͬͯ௥ՃͷϑΥʔϜ͕දࣔ/ඇදࣔʹ ͳͬͨΓ͢Δέʔε͕ଟ͘ɺViewͷঢ়ଶ؅ཧ͕ෳࡶ • 1ͭͷσʔλมߋॲཧʹରͯ͠ෳ਺ͷϞσϧ͕ؔ࿈͠ɺґଘ ͠߹͏͜ͱ͕ଟ͍ • ΞϓϦͱͯ͠ͷػೳͷଟ͞ɺͦΕΒ͕૬ޓʹؔ࿈͋͠͏ը໘ ભҠͷෳࡶ͞

Slide 7

Slide 7 text

MVVMͷ࠾༻ • ViewModelͰViewͷঢ়ଶͱϏδωεϩδοΫΛ؅ཧ • ReactiveCocoaͷRACSignalΛView͕subscribeͯ͠ঢ়ଶΛ όΠϯσΟϯά͢Δ • ViewModelʹมԽ͕ى͖Δͱ֘౰ͷϓϩύςΟͷมߋ͕ RACSignalʹΑͬͯ௨஌͞ΕɺView͕൓Ԡ͢Δ

Slide 8

Slide 8 text

ViewController ViewModel APIClient ߏ੒ VIEW VIEW View ϝιουݺͼग़͠ RACSignal VIEW VIEW Model

Slide 9

Slide 9 text

ݱঢ়ͷ՝୊ • ΞϓϦͷن໛͕େ͖͘ͳΔʹͭΕͯɺUIΠϕϯτ΍γεςϜ ΠϕϯτʹΑΔঢ়ଶͷมԽΛ؅ཧͰ͖ͳ͘ͳ͖ͬͯͨ • ViewModelͱͷ૒ํ޲όΠϯσΟϯάʹΑΔґଘؔ܎ͷ ༧ଌͷͮ͠Β͞ • ঢ়ଶͷ؅ཧͱϞσϧͷૢ࡞ͱυϝΠϯϩδοΫ͕ີ݁߹ • Ͳ͜Ͱ୭ʹΑͬͯԿ͕มΘͬͯࠓͲ͏ͳͬͯΔͷ͔͕௥͍͔ ͚ͮΒ͍

Slide 10

Slide 10 text

WebϑϩϯτΤϯυ͔ΒֶͿ • JavaScriptͷੈքͰ͸MVVM (2way-binding) ͸͏·͘ड͚ ೖΕΒΕͳ͔ͬͨ • Reactͷొ৔ʹΑͬͯΞʔΩςΫνϟͷτϨϯυ͸FluxΛݩ ʹͨ͠୯ํ޲ϑϩʔ΁

Slide 11

Slide 11 text

Flux facebook/flux: Application Architecture for Building User Interfaces

Slide 12

Slide 12 text

ΑΓྑ͍ΞʔΩςΫνϟ΁ͷԾઆ • WebϑϩϯτΤϯυͷྺ࢙͔ΒɺfreeeΞϓϦ๊͕͍͑ͯΔ ໰୊͸૒ํ޲όΠϯσΟϯάͷຊ࣭తͳ໰୊ͳͷͰ͸ • ୯ํ޲ϑϩʔͷίϯηϓτ͸iOSʹ͓͍ͯ΋Viewͷঢ়ଶ؅ཧ Λ៉ྷʹ͢ΔͨΊʹ༗༻ͳͷͰ͸

Slide 13

Slide 13 text

'MVYͷ࠾༻

Slide 14

Slide 14 text

جຊϑϩʔ • Viewͷঢ়ଶΛStore͕࣋ͪɺStore͸ActionͷൃߦΛ଴ͪड ͚Δ • StoreΛ֎෦͔Βมߋ͢Δ͜ͱ͸Ͱ͖ͣɺdispatch͞Εͨ ActionʹԠͯࣗ͡਎Ͱมߋ͢ΔͷΈ • Store͸ͦΕ͕มߋ͞Εͨ͜ͱͷΈΛViewʹ௨஌͢Δ • มߋ͞Εͨࠩ෼ΛૹͬͨΓ͸͠ͳ͍ • View͸ৗʹStoreͷ࠷৽ͷঢ়ଶ͔Βߏங͞ΕΔ

Slide 15

Slide 15 text

։ൃํ਑ • جຊతʹViewControllerͱ1:1ͰStoreΛ࡞Γঢ়ଶΛ؅ཧ͢Δ • ΞϓϦέʔγϣϯશମͷঢ়ଶʢೝূ͍ͯ͠Δͱ͔ʣΛ؅ཧ͢Δ StoreΛ࡞Γɺάϩʔόϧʹอ࣋͢Δ • APIϦΫΤετ͸ActionCreatorͰߦ͍ɺ݁ՌΛActionͷ Payloadͱͯ͠Storeʹड͚౉͢ • Realm(DB)΁ͷอଘ͸ΞϓϦέʔγϣϯͷঢ়ଶมԽͱΈͳ͠ StoreͰߦ͏

Slide 16

Slide 16 text

Store ViewController Store ViewController ߏ੒ Dispatcher Action Action Store Store (Global) Store ViewController ActionCreator Action Action Application

Slide 17

Slide 17 text

ϥΠϒϥϦԽ • https://github.com/yonekawa/SwiftFlux • DispatcherͱͦΕʹඥͮ͘Action/Storeͷந৅Խ • ReduceStoreͱ͔Flux Utils΋Ұ෦࣮૷ͯ͠Δ • ϓϩτίϧࢦ޲ͰSwiftΒ͠͞Λҙࣝͨ͠

Slide 18

Slide 18 text

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

Slide 19

Slide 19 text

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

Slide 20

Slide 20 text

class ViewController: UITableViewController { let store = TodoStore() func viewDidLoad() { super.viewDidLoad() store.subscribe { () in tableView.reloadData() } ActionCreator.invoke(FetchAction()) } } ViewController

Slide 21

Slide 21 text

࣮ઓ౤ೖ https://itunes.apple.com/jp/app/id1037197002

Slide 22

Slide 22 text

ϝϦοτ • View͸ৗʹStore͔Βશͯߏங͞ΕΔͷͰɺݱࡏͷViewͷঢ় ଶ͕໌ࣔతʹͳΓݟ௨͕͠Α͘ͳΔ • StoreΛߋ৽͢Δͷ͸Storeࣗ਎͔͋͠Γಘͳ͍ͷͰɺঢ়ଶͷ มԽ͸֘౰ͷAction͕ൃߦ͞Ε͔ͨΛ௥͏͚ͩͰΑ͍ • APIϦΫΤετ౳ͷঢ়ଶΛม͑ಘΔϩδοΫͱঢ়ଶΛ؅ཧ͢ Δ৔ॴΛ໌֬ʹ෼͚ΒΕΔ

Slide 23

Slide 23 text

Viewͷࠩ෼ߋ৽ • Swiftͷੈքʹ͸React͕ଘࡏ͠ͳ͍ɻͦΕͬΆ͍΋ͷ͸͍͘ ͔ͭ͋Δ͕Viewͷ࡞Γํ͕ಠࣗʹͳ͓ͬͯΓɺUIKit͕ఏڙ ͢Δ΋ͷ͔Β֎ΕΔͷ͸ϦεΫ͕ߴ͍ • ViewΛຖճ࠶ߏங͢Δͷ͸ίετ͕͔͔ΔͷͰࠩ෼ߋ৽͕ ඞཁɻ͔͠͠ؾΛ͚ͭͳ͍ͱঢ়ଶΛ࡞ͬͯ͠·͏ɻ • UITableViewͳͲΛ͏·ࠩ͘෼ߋ৽͢Δ൚༻తͳ࢓૊Έ͕΄ ͍͠

Slide 24

Slide 24 text

ίʔυྔ͸૿͑Δ • ঢ়ଶΛม͑ΔͨΊʹຖճActionͱStoreʹ࣮૷͕ඞཁ • ୯७ͳೖྗ஋ͷ൓өͳͲ΋ຖճDispatcherΛܦ༝ͯ͠Store ΁ૹΔͷͰ৑௕ʹͳΔ • ঢ়ଶΛ؅ཧ͢ΔͨΊͷखؒͱͯ͋͠Δఔ౓͸͔ͨ͠ͳ͍

Slide 25

Slide 25 text

Τϥʔॲཧ • ActionΛ࡞Δͱ͖ʹൃੜͨ͠ΤϥʔΛͲ͏ѻ͏΂͖͔ɻࠓ ͸Τϥʔ΋ը໘ͷঢ়ଶͷ̍ͭͱͯ͠Storeʹ౉͍ͯ͠Δ • SVProgressHUDͷΑ͏ͳग़͙ͯ͢ফ͑ΔUIΛ࢖͏৔߹ɺ Store͕࣋ͭΤϥʔঢ়ଶΛஞҰϦηοτ͢Δͷ͕໘౗

Slide 26

Slide 26 text

Ξχϝʔγϣϯ • ۪௚ʹ΍Δͱ͍͢͝ճ਺ͷϑϩʔ͕ճΔ • Ξχϝʔγϣϯͷ։࢝ͱऴྃΛঢ়ଶͱͯ͠؅ཧ͢Δ΂͖ʁ • ReactͰ΋͜Ε͸ঢ়ଶ؅ཧͷର৅֎ͱ͍ͯ͠Δ༷ࢠ

Slide 27

Slide 27 text

'MVYWT3FEVY

Slide 28

Slide 28 text

Redux • ΞϓϦέʔγϣϯͷঢ়ଶ͸1ͭͷStoreΦϒδΣΫτ͕؅ཧ ͢Δ • State͸ϦʔυΦϯϦʔͰActionͷൃߦʹΑͬͯͷΈมߋ͞ ΕಘΔ • ঢ়ଶͷભҠ͸ͨͩͷؔ਺(Reducer)ʹΑͬͯߦ͏

Slide 29

Slide 29 text

ReduxͷϝϦοτ • Store͕1͔ͭ͠ଘࡏ͠ͳ͍ͨΊɺঢ়ଶ͕มΘΔ৔ॴ͕ΑΓ ݶఆ͞Εͯݟ௨͠΍͘͢ͳΔ • ҰՕॴͰશͯͷঢ়ଶ͕มΘΔͨΊɺ׬શͳมߋͷཤྺΛอ ࣋Ͱ͖Δ͜ͱʹΑΓɺUndo/RedoͳͲ΋༰қ • Reducerؔ਺͸લͷঢ়ଶʹॲཧΛՃ͑ͯ৽͍͠ঢ়ଶΛฦͩ͢ ͚ͳͷͰςετ͠΍͍͢

Slide 30

Slide 30 text

Redux or Flux? • جຊతʹ͸ReduxͷSingle State Tree͸ΑΓྑ͍ঢ়ଶ؅ཧͷ ࢓૊ΈΛఏڙͯ͘͠ΕΔͷͰΑ͍ • Redux͸Single State TreeΛલఏʹσβΠϯ͞Ε͍ͯΔͷ ͰɺΞϓϦέʔγϣϯશମΛͦΕલఏʹ࡞Βͳ͍ͱ͍͚ͳ͍ • Flux͸੍໿͕؇͍ͷͰɺෳࡶͳUIΛ෦෼తʹஔ͖׵͑ΔͳͲ طଘͷΞϓϦʹ΋ೖΕ΍͍͢

Slide 31

Slide 31 text

ReSwift • https://github.com/ReSwift/ReSwift • ReduxͷSwift࣮૷ • ৄ͘͠͸ninjinkun͞Μ͕࿩ͯ͘͠ΕΔͱࢥ͍·͢ɻ

Slide 32

Slide 32 text

·ͱΊ

Slide 33

Slide 33 text

·ͱΊ • ୯ํ޲ϑϩʔͷΞʔΩςΫνϟ͸Viewͷঢ়ଶΛݟ௨͠΍͢ ͯ͘͘͠ΕΔͷͰiOSʹ͓͍ͯ΋ϝϦοτ͕͋Δ • React͕ແ͍ͨΊStoreͷঢ়ଶ͔Βޮ཰Α͘ViewΛ࡞Δͱ͜ Ζʹ՝୊͕͋Δ͕ɺ޻෉ͷ༨஍͸͋Γͦ͏ • ϥΠϒϥϦ͸ࠓͷͱ͜ΖReSwift͕ຊ໋͕ͩɺطଘΞϓϦʹ ద༻͢ΔͳΒγϯϓϧͳFlux΋͋Γ

Slide 34

Slide 34 text

SwiftFluxͷࠓޙͷల๬ • ΋ͬͱܕ҆શʹͰ͖ΔΑ͏ʹΠϯλϑΣʔεΛݟ௚͍ͨ͠ • ෳ਺ͷStoreΛଋͶͯ؅ཧͰ͖ΔStoreGroupతػೳ • ൚༻తͳࠩ෼ߋ৽ͷͨΊͷUIϢʔςΟϦςΟ