Slide 1

Slide 1 text

2018.3.22 - ©2018 Wantedly, Inc. ReactorKit Λར༻ͨ͠ ؇΍͔ͳΞʔΩςΫνϟͷҠߦ iOS Flux / Reduxษڧձ Jiro Nagashima

Slide 2

Slide 2 text

©2018 Wantedly, Inc. ͸͡Ίʹ

Slide 3

Slide 3 text

©2018 Wantedly, Inc. ࣗݾ঺հ Ӭౡ࣍࿕@hedjirog User Growth νʔϜϦʔμʔWantedly VisitΞϓϦͷ։ൃ վળࢪࡦΛ࣮ࢪͭͭ͠ શମͷ࣮૷ํ਑ͷܾఆͱ࣮ࡍͷมߋΛߦͳ͏

Slide 4

Slide 4 text

©2018 Wantedly, Inc. ൃදͷͶΒ͍ ෦෼త͔ͭஈ֊తͳΞʔΩςΫνϟͷҠߦͷࣄྫΛ঺հ Wantedly VisitΞϓϦͷ ReactorKit Λར༻ͨ͠

Slide 5

Slide 5 text

©2018 Wantedly, Inc. ൃදͷͶΒ͍ ৽نࣄۀ େن໛ͳϦϑΝΫλϦϯά # طଘΞϓϦͷվળࢪࡦͱಉ࣌ʹ࣮ࢪ POINT ෦෼త͔ͭஈ֊తͳΞʔΩςΫνϟͷҠߦͷࣄྫΛ঺հ Wantedly VisitΞϓϦͷ ReactorKit Λར༻ͨ͠

Slide 6

Slide 6 text

©2018 Wantedly, Inc. Wantedly Visit ΞϓϦͱ։ൃମ੍ Wantedly Visit ΞϓϦͷվम ReactorKit ͷಋೖ ReactorKit Λར༻࣮ͨ͠૷ ReactorKitಋೖޙͷؾ͖ͮ ໨࣍

Slide 7

Slide 7 text

©2018 Wantedly, Inc. Wantedly VisitΞϓϦͱ։ൃମ੍ ͳͥ෦෼త͔ͭஈ֊తʹΞʔΩςΫνϟͷҠߦΛਐΊͨͷ͔ʁ

Slide 8

Slide 8 text

©2018 Wantedly, Inc. https://wantedlyinc.com/ja/products Wantedly Visit

Slide 9

Slide 9 text

©2018 Wantedly, Inc. Wantedly Visit ΞϓϦͱ։ൃମ੍ ‣ ࣮૷มߋͷݕ౼͕ඞཁ w J04ΞϓϦ͸ެ։͞Εͯ೥͕ܦա w Objective-C͔ΒSwiftͷ࣮૷΁Ҡߦ w ϦϦʔε౰ॳ͔ΒͷAPIΫϥΠΞϯτ࣮૷͕ଘࡏ ‣ ݶΒΕͨϦιʔεͰ։ൃΛਐΊΔඞཁੑ w ৽نࣄۀʹϦιʔε͕ूத w େن໛ͳ࣮૷มߋΛߦͳ͏ϦιʔεΛ֬อͰ͖ͳ͍ ‣ ΤϯδχΞͷۀ຿͸୯७ͳ։ൃ͚ͩͰͳ͍ • த௕ظͷࢪࡦͷܾఆɾ࣮ࢪΛΤϯδχΞࣗ਎͕ߦͳ͏

Slide 10

Slide 10 text

©2018 Wantedly, Inc. ΞʔΩςΫνϟҠߦͷഎܠ ‣ ࣮૷มߋͷݕ౼͕ඞཁ ‣ ݶΒΕͨϦιʔεͰ։ൃΛਐΊΔඞཁੑ ‣ ΤϯδχΞͷۀ຿͸୯७ͳ։ൃ͚ͩͰͳ͍ େن໛ͳ࣮૷มߋΛߦͳΘͣɺվળࢪࡦͷ࣮ࢪͱซͤͯ ෦෼త͔ͭஈ֊తͳΞʔΩςΫνϟͷҠߦ͕ՄೳͳखஈΛٻΊ͍ͯͨ

Slide 11

Slide 11 text

©2018 Wantedly, Inc. Wantedly VisitΞϓϦͷվम Ͳͷ෦෼ͰΞʔΩςΫνϟͷҠߦΛਐΊͨͷ͔ʁ

Slide 12

Slide 12 text

No content

Slide 13

Slide 13 text

No content

Slide 14

Slide 14 text

©2018 Wantedly, Inc. վमՕॴืूը໘ ‣ ଟ༷ͳίϯςϯπ w ձࣾ৘ใɺϝϯόʔͷϓϩϑΟʔϧɺԠԉίϝϯτ ‣ ෳ਺ͷAPIϦΫΤετ w ืूͷৄࡉɺλάͷҰཡɺؔ࿈ืूͷҰཡ ‣ Ϣʔβʔૢ࡞ʹΑΔঢ়ଶมߋ w ϒοΫϚʔΫɺԠืɺԠԉ w දࣔϝϯόʔͷ੾Γସ͑

Slide 15

Slide 15 text

©2018 Wantedly, Inc. վमՕॴืूը໘ ‣ ଟ༷ͳίϯςϯπ ‣ ෳ਺ͷAPIϦΫΤετ ‣ Ϣʔβʔૢ࡞ʹΑΔঢ়ଶมߋ ෳࡶͳը໘Ͱ෦෼తͳΞʔΩςΫνϟͷҠߦʹ੒ޭ

Slide 16

Slide 16 text

©2018 Wantedly, Inc. ΞʔΩςΫνϟҠߦͷཱ໾ऀReactorKit https://github.com/ReactorKit/ReactorKit

Slide 17

Slide 17 text

©2018 Wantedly, Inc. ReactorKitͷಋೖ ReactorKitͱ͸Կ͔ʁͳͥReactorKitΛಋೖͨ͠ͷ͔ʁ

Slide 18

Slide 18 text

©2018 Wantedly, Inc. ‣ Fluxͷ࣮ݱ w ୯Ұํ޲ͷσʔλϑϩʔ w ঢ়ଶ؅ཧͷෳࡶ͞ͷղফ ‣ Reactive ProgrammingΛԠ༻ w ετϦʔϜʹΑΔ6*ૢ࡞΍ঢ়ଶͷ఻ൖ w RxSwiftΛར༻ w ඇಉظॲཧͷෳࡶ͞ͷղফ ReactorKit

Slide 19

Slide 19 text

©2018 Wantedly, Inc. ReactorKit ͷ֓೦ਤ https://github.com/ReactorKit/ReactorKit#basic-concept ۃΊͯγϯϓϧ

Slide 20

Slide 20 text

©2018 Wantedly, Inc. ReactorKit ಋೖͷܾΊख ‣ Flux ୯Ұํ޲ͷσʔλϑϩʔ ʹର͢Δظ଴ w Wantedly Visit ΞϓϦͷಛ௃ͱͯ͠ɺঢ়ଶ؅ཧΛඞཁͱ͢Δ༷ʑͳը໘Λ༗͢Δ w ଟ༷ͳίϯςϯπͷදࣔɺߴ౓ͳݕࡧϑΟϧλʔɺνϟοτɺϓϩϑΟʔϧฤू ‣ RxSwift ͱซ༻Մೳ w RxSwiftΛར༻͍ͯ͠ΔͷͰɺซ༻͢Δख๏Λཱ֬͢Δඞཁ͕ͳ͍ ‣ ෦෼త͔ͭஈ֊తʹಋೖ͕Մೳ • “Start Small”ͱ͍͏σβΠϯΰʔϧΛܝ͍͛ͯΔ

Slide 21

Slide 21 text

©2018 Wantedly, Inc. ReactorKitΛར༻࣮ͨ͠૷ ͲͷΑ͏ͳ࣮૷͔ʁ

Slide 22

Slide 22 text

No content

Slide 23

Slide 23 text

©2018 Wantedly, Inc. ืूը໘ͷ࣮૷ https://github.com/ReactorKit/ReactorKit#basic-concept

Slide 24

Slide 24 text

©2018 Wantedly, Inc. ืूը໘ͷ࣮૷ https://github.com/ReactorKit/ReactorKit#reactor

Slide 25

Slide 25 text

©2018 Wantedly, Inc. ืूը໘ͷ࣮૷ https://github.com/ReactorKit/ReactorKit#reactor ProjectViewController ProjectViewReactor

Slide 26

Slide 26 text

©2018 Wantedly, Inc. Reactor ͷ࣮૷ ProjectViewReactor 1. ActionͱStateͷఆٛ 2. mutateϝιουͱredueϝιουͷ࣮૷ POINT https://github.com/ReactorKit/ReactorKit#reactor

Slide 27

Slide 27 text

©2018 Wantedly, Inc. enum Action { case load case additionalLoad case toggleBookmarking case selectStaffing(Int) } Action ͷఆٛྫ ProjectViewReactor

Slide 28

Slide 28 text

©2018 Wantedly, Inc. struct State { var project: Project var summaryTags: [ProjectSummaryTag] = [] var relatedProjectSections: [ProjectRelatedProjectSection] = [] var companyProjects: [Project] = [] var isProjectLoaded: Bool = false var isBookmarking: Bool var isApplying: Bool var isSupporting: Bool var selectedStaffing: Staffing? } State ͷఆٛྫ ProjectViewReactor

Slide 29

Slide 29 text

©2018 Wantedly, Inc. func mutate(action: Action) -> Observable { switch action { case .load: return Observable .merge( Observable .concat([ projectService.project(id: currentState.project.id).asObservable().map { .setProject($0) }, Observable.just(.setProjectLoaded(true)), ]), projectService.summaryTags(projectID: currentState.project.id).asObservable().map { .setSummaryTags($0) } ) … } mutate ϝιουͷ࣮૷ྫ ProjectViewReactor

Slide 30

Slide 30 text

©2018 Wantedly, Inc. func reduce(state: State, mutation: Mutation) -> State { switch mutation { case let .setProject(project): var state = state state.project = project state.isBookmarking = project.isBookmarking state.isApplying = project.isApplied state.isSupporting = project.isSupporting state.selectedStaffing = state.selectedStaffing ?? project.staffings?.first return state … } reduce ϝιουͷ࣮૷ྫ ProjectViewReactor

Slide 31

Slide 31 text

©2018 Wantedly, Inc. ProjectViewController View ͷ࣮૷ 1. bindϝιουͷ࣮૷ 2. Actionͷ఻ൖͱStateͷ൓ө POINT https://github.com/ReactorKit/ReactorKit#reactor

Slide 32

Slide 32 text

©2018 Wantedly, Inc. ProjectViewController func bind(reactor: Reactor) { rx.methodInvoked(#selector(viewDidLoad)) .map { _ in Reactor.Action.load } .bind(to: reactor.action) .disposed(by: disposeBag) … state .map { $0.isBookmarking } .distinctUntilChanged() .bind(to: bookmarkButton.rx.isSelected) .disposed(by: disposeBag) … } bind ϝιουͷ࣮૷ྫ

Slide 33

Slide 33 text

©2018 Wantedly, Inc. ืूը໘ͷ࣮૷ https://github.com/ReactorKit/ReactorKit#reactor ProjectViewController ProjectViewReactor

Slide 34

Slide 34 text

©2018 Wantedly, Inc. ReactorKitಋೖޙͷؾ͖ͮ ಋೖͯ͠෼͔ͬͨ͜ͱ͸Կ͔ʁ

Slide 35

Slide 35 text

©2018 Wantedly, Inc. ؾ͖ͮ ‣ ςετख๏ཱ͕֬͞Ε͍ͯΔ w ԿΛͲ͏ςετ͢΂͖͔໌ݴ͞Ε͍ͯͯɺखஈ΋༻ҙ͞Ε͍ͯΔ w ςετख๏ཱ͕֬͞Εͣςετ͕ॻ͔Εͳ͍ͱ͍͏ࣄଶ͕ى͜ΓͮΒ͍ ‣ ඇΞϓϦΤϯδχΞ͕ΞʔΩςΫνϟΛཧղ͠΍͍͢ w ࣾ಺Ͱ͸webͷϑϩϯτ࣮૷ͰRedux Λར༻͍ͯ͠ΔͷͰલఏ஌͕ࣝ͋Δ w ReactorKitͷγϯϓϧ͞΋ड͚ೖΒΕ΍͍͢ ‣ αϯϓϧ͕๛෋ w ෳ਺ͷن໛ͷΞϓϦͷαϯϓϧ͕ެ։͞Ε͍ͯΔ w ඞཁͳ࣮૷ྫ͕ݟ͔ͭΔʢάϩʔόϧͳঢ়ଶͷѻ͍ɺςετίʔυͳͲʣ

Slide 36

Slide 36 text

©2018 Wantedly, Inc. ࠂ஌

Slide 37

Slide 37 text

ϖʔδλΠτϧ ϖʔδαϒλΠτϧ ©2018 Wantedly, Inc. ”ReactorKit Meetup” ։࠵͠·͢ ࡞ऀͷํΛ͓ট͖͢Δ༧ఆͰ͢ʂ Ϣʔβʔͷํɺ-5ر๬ऀͷํ͸͓੠ֻ͚͍ͩ͘͞ʂ