Tweet
Tweet

Slide 1

Slide 1 text

FRESH!഑৴ΞϓϦͰ
 ࠾༻ͨ͠ࣄɾ͠ͳ͔ͬͨࣄ 2018/01/25 CA.swift #5 Ryo Aoyama
 CyberAgent, Inc GitHub: @ra1028
 Twitter: @ra1028fe5

Slide 2

Slide 2 text

Profile ੨ࢁ ྒྷ גࣜձࣾαΠόʔΤʔδΣϯτ
 FRESH! 2016೥ 4݄ ೖࣾ FRESH!ΞϓϦ(ࢹௌ)ɾFRESH! CASTΞϓϦ(഑৴)Λ։ൃத GitHub: @ra1028 Twitter: @ra1028fe5

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

ϩάΠϯෆཁɾߴը࣭ɾ௿஗ԆͰݟ์୊ όϥΤςΟʹ෋Μͩੜ์ૹಈըͷ഑৴ϓϥοτϑΥʔϜ

Slide 5

Slide 5 text

Home Broadcast ੜ์ૹ഑৴ɾΞοϓϩʔυ഑৴ɾ༧໿؅ཧɾetc…

Slide 6

Slide 6 text

ಈըࢹௌΞϓϦͷ։ൃΛܦͯ
 ԿΛ࠾༻ͯ͠ԿΛม͑ͨʁ

Slide 7

Slide 7 text

Contents • SVGΞΠίϯϦιʔε • XcodeGen • Danger • VueFlux ΞʔΩςΫνϟ • ϥΠϒϥϦ

Slide 8

Slide 8 text

VueFlux https://github.com/ra1028/VueFlux Unidirectional State Management Architecture for Swift - Inspired by Vuex and Flux VueFlux makes a unidirectional and predictable flow by explicitly dividing the roles making up the ViewController.

Slide 9

Slide 9 text

No content

Slide 10

Slide 10 text

No content

Slide 11

Slide 11 text

Actions

Slide 12

Slide 12 text

Actions ঢ়ଶભҠͤ͞ΔActionΛఆٛ enumͰ΋structͰ΋ܕ͸ͳΜͰ΋OK

Slide 13

Slide 13 text

Actions APIϦΫΤετͷϨεϙϯεʹԠͯ͡ActionΛDispatch

Slide 14

Slide 14 text

Actions ActionsͰ͸֎෦΁ͷґଘͳ͘ɺσʔλͷऔಘͳͲΛߦ͍ɺ ͦͷ݁ՌΛenumͳͲͷActionʹPayloadͯ͠ఴ෇ͯ͠ Dispatch͢Δ

Slide 15

Slide 15 text

No content

Slide 16

Slide 16 text

Mutations

Slide 17

Slide 17 text

Mutations Stateͷঢ়ଶมߋ͸MutationsΛհͯ͠ͷΈʹݶఆ͞ΕΔ

Slide 18

Slide 18 text

Mutations iOSʹ͸React΍ElmͰ͍͏Virtual DOMͷΑ͏ͳࠩ෼ߋ৽ γεςϜ͕ͳ͘ɺImmutableͳStateͰ͸ෳࡶͳঢ়ଶΛදݱ ͮ͠Β͍ VueFluxͰ͸ClassͷMutableͳStateͷ಺෦ঢ়ଶΛActionͷ ࣝผʹΑͬͯݸผʹߋ৽͢Δ

Slide 19

Slide 19 text

No content

Slide 20

Slide 20 text

State

Slide 21

Slide 21 text

State ActionͱMutationsΛassociatedtypeʹ΋ͭ class(mutable)ͳܕ

Slide 22

Slide 22 text

State ActionͱMutationsΛassociatedtypeʹ΋ͭ class(mutable)ͳܕ ComputedʹΑͬͯɺViewͷͨΊͷ஋ʹม׵ ·ͨImmutableͳ஋ʹͯ͠ެ։͢Δ

Slide 23

Slide 23 text

State ಺෦ঢ়ଶͱͯ͠ը໘ͷৄࡉঢ়ଶભҠʹผ్State MachineΛ࢖ͬͨભҠΛݕ౼ͯ͠΋ྑͦ͞͏

Slide 24

Slide 24 text

State ޓ͍ʹ૬ؔੑͷͳ͍಺෦ঢ়ଶΛෳ਺࣋ͭ a.k.a ViewModel ಺෦ঢ়ଶϓϩύςΟ͸fileprivateʹͯ͠Mutationsͱ ComputedΛಉҰϑΝΠϧʹ͢Δ͜ͱͰΞΫηεϨ ϕϧΛ੍ݶ͢Δ

Slide 25

Slide 25 text

No content

Slide 26

Slide 26 text

ViewController

Slide 27

Slide 27 text

ViewController isIndicatorHiddenΛindicatorͷisHiddenͱbind viewWillAppear͕ݺ͹Εͨ࣌Ұճ͚ͩrefresh() Actionsʹఆٛͨ͠refreshΛݺͿ ͜ͷ࣌ɺStore.actions͔ΒݺͿͱɺ ಉ͡ܕͷstateશମʹBroadcast͞ΕΔ StoreͷΠϯελϯεΛ࡞Δͱ͖ʹstate, mutations΋࡞ͬͯ౉͢

Slide 28

Slide 28 text

ViewController MVVMͷΑ͏ʹɺViewController - StoreؒͷόΠϯσΟϯά ํ๏͸࢖༻ऀʹҕͶΔ جຊతʹReactive૝ఆͳͷͰɺVueFluxͱ͸frameworkΛ෼ ͚ͯVueFluxReactiveͱ͍͏؆қతͳReactiveϥΠϒϥϦΛ ࢖͑ΔΑ͏ʹͨ͠

Slide 29

Slide 29 text

VueFlux Flux(Redux)Λ࠾༻͢Δ্Ͱؾʹͳ͍ͬͯͨStateͷதԝ ूதʹΑΔͭΒΈ΍ɺܕ৘ใ͕εϙΠϧ͞ΕͨΓOptional ͳ৘ใ΋ଟ͘cast, unwrapͷཛྷ…ͳ໰୊͸ղܾͰ͖ͨ ը໘ͱStore͕1:1ͷMulti-Storeߏ੒ͰState͕Mutable ͱɺϢʔβʔͷଟ͍ReduxͱٯΛߦͬͨ΋ͷͷiOSͰͷ FluxͱMVVMͷਏ͞Λ͏·ؙ͘ΊΔײ֮Ͱ࢖͑ͯྑ͍

Slide 30

Slide 30 text

Contents • SVG ΞΠίϯϦιʔε • XcodeGen • Danger • VueFlux ΞʔΩςΫνϟ • ϥΠϒϥϦ

Slide 31

Slide 31 text

ϥΠϒϥϦ • ૉ௚ʹރΕͨ΋ͷΛબͿ ௨৴ܥͳͲͷಈ࡞΍ى͜Γ͏Δόάͷશ༰͕௫Ίͳ͍΋ͷ͸ɺ୯७ ʹϢʔβʔ͕ଟ͍΄͏͕χονͳόάमਖ਼͕ೖ͍ͬͯͯॿ͔Δ • طଘͷ΋ͷͰྑ͍΋ͷ͕ͳ͚Ε͹ࣗ࡞͢Δ ༧Ίগ࣌ؒ͠ΛऔͬͯϕʔεΛ࡞ΓɺΞϓϦͱಉ࣌ਐߦͰ࡞੒

Slide 32

Slide 32 text

ϥΠϒϥϦ πʔϧ SwiftGen SwiftLint UI SpringIndicator ςετ Nimble Quick Ϩϙʔτ Crashlytics Fabric ΞʔΩςΫνϟ VueFlux ReactiveSwift ReactiveCocoa ௨৴ Alamofire AWSCore AWSS3 ιέοτ௨৴ Socket.IO-Client-Swift Starscream ը૾ Kingfisher ϩά SwiftyBeaver ϢʔςΟϦςΟ Alembic Magnolia(β) KeychainAccess ReachabilitySwift Result

Slide 33

Slide 33 text

ϥΠϒϥϦ • େ͖͍΋ͷ͸΄ͱΜͲಉ͡ • ΞʔΩςΫνϟઃܭʹVueFluxɺࢹௌΞϓϦͷUIมߋͷଟ͞ ͱϦετ؅ཧͷਏ͔͞ΒMagnolia(β)Λ࡞੒ɺಋೖ • ͍ͭͰʹࣗ࡞ͯͨ͠JSONύʔαʔͷAlembicΛಋೖ

Slide 34

Slide 34 text

Contents • SVG ΞΠίϯϦιʔε • XcodeGen • Danger • VueFlux ΞʔΩςΫνϟ • ϥΠϒϥϦ

Slide 35

Slide 35 text

ΞΠίϯϦιʔε PNG? JPEG? PDF?

Slide 36

Slide 36 text

ΞΠίϯϦιʔε ϕΫλʔΛ࢖͍͍ͨʂ PDF͸ίϯύΠϧ࣌ʹͦΕͧΕͷαΠζ ͷը૾ʹల։͞ΕΔ…

Slide 37

Slide 37 text

Icon Fonts • ϕΫλʔͳͷͰαΠζมߋͰ࠶࡞੒͢Δඞཁ͕ͳ͍ • ୺຤αΠζ͝ͱ(1x, 2x, 3x)ͷ༻ҙ͕͍Βͳ͍ • UILabel, UIButton౳ͱͷ૬ੑ͕͍͍ • ༰ྔ͕খ͍͞

Slide 38

Slide 38 text

SVG͕͑͑ͳ ͔͠͠…

Slide 39

Slide 39 text

Font Custom https://github.com/FontCustom/fontcustom Icon fonts from the command line. Generate cross-browser icon fonts and supporting files (@font-face CSS, etc.) from a collection of SVGs

Slide 40

Slide 40 text

Font Custom https://github.com/FontCustom/fontcustom SVGϑΝΠϧ܈͔ΒTTF(ϑΥϯτ)ϑΝΠϧʹ Ϛοϐϯά͢Δπʔϧ

Slide 41

Slide 41 text

fontcustom compile Font Custom https://github.com/FontCustom/fontcustom

Slide 42

Slide 42 text

ShellScript Font Custom https://github.com/FontCustom/fontcustom

Slide 43

Slide 43 text

SVGΞΠίϯϦιʔε iOSͰखܰʹѻ͑ΔϕΫλʔͰ͋ΔΞΠίϯϑΥϯτΛ࢖ ͍ͭͭɺiOS, Android޲͚ʹผʑͰϦιʔε؅ཧ͢Δඞཁ ͕ͳ͘ͳͬͨ

Slide 44

Slide 44 text

Contents • SVGΞΠίϯϦιʔε • XcodeGen • Danger • VueFlux ΞʔΩςΫνϟ • Ϧετ؅ཧ

Slide 45

Slide 45 text

XcodeGen https://github.com/yonaskolb/XcodeGen XcodeGen is a command line tool that generates your Xcode project using your folder structure and a simple project spec

Slide 46

Slide 46 text

XcodeGen https://github.com/yonaskolb/XcodeGen ཁ͸YAMLϑΝΠϧʹهड़ͨ͠ઃఆ͔Β xcodeprojΛੜ੒͢Δ xcodeproj(pbxproj)ΛgitignoreͰ͖Δ

Slide 47

Slide 47 text

name: App configs: Debug: debug Release: release targets: App: type: application platform: iOS sources: - AppSources settings: base: IPHONEOS_DEPLOYMENT_TARGET: $(inherited) ALWAYS_EMBED_SWIFT_STANDARD_LIBRARIES: $(inherited) TARGETED_DEVICE_FAMILY: $(inherited) dependencies: - target: Shared configFiles: Debug: configs/app.debug.xcconfig Release: configs/app.release.xcconfig prebuildScripts: - script: $PODS_ROOT/SwiftLint/swiftlint name: SwiftLint Shared: type: framework platform: iOS sources: SharedSources settings: base: IPHONEOS_DEPLOYMENT_TARGET: $(inherited) ALWAYS_EMBED_SWIFT_STANDARD_LIBRARIES: $(inherited) configFiles: Debug: configs/shared.debug.xcconfig Release: configs/shared.release.xcconfig project.yml

Slide 48

Slide 48 text

• Xcodeͷઃఆʹ(ଟগ)Մಡੑ͕ʂ • pbxprojͷίϯϑϦΫτΛࠜຊతʹͳͤ͘Δ • ϨϏϡʔ࣌ͷࠩ෼͕ݮΔ • ϓϩδΣΫτؒͰ࢖͍ճ͠Ͱ͖Δ Pros

Slide 49

Slide 49 text

• Derived Data(Ωϟογϡ)ෆ੔߹ͰϏϧυΤϥʔ • Checkoutͷ౓ $xcodegen গ͠ਏ͍ • ຖճ $pod install ׂΓͱ͔͔࣌ؒΔ… (Carthage೿ͳΒ) Cons

Slide 50

Slide 50 text

• Derived Data(Ωϟογϡ)ෆ੔߹ͰϏϧυΤϥʔ • Checkoutͷ౓ $xcodegen গ͠ਏ͍ • ຖճ $pod install ׂΓͱ͔͔࣌ؒΔ… (Carthage೿ͳΒ) Cons

Slide 51

Slide 51 text

XcodeGen CocoaPodsͱͷ૬ੑ͔ɺDerived Dataؔ܎ͰΫϦʔϯϏϧυ ͕සൃ͠ɺࢼͨ͠౰࣌͏·͘ղܾͮ͠Β͔ͬͨઃఆ΋͋ΓҰ ࣌ಋೖݟૹΓʹ… XcodeGenࣗମ͸ૉ੖Β͔ͬͨ͠ͷͰɺ։ൃ͕΋͏গ͠؇΍ ͔ʹͳ͔ͬͯΒ࠶ಋೖ༧ఆ

Slide 52

Slide 52 text

Contents • SVGΞΠίϯϦιʔε • XcodeGen • Danger • VueFlux ΞʔΩςΫνϟ • ϥΠϒϥϦ

Slide 53

Slide 53 text

Danger https://github.com/danger/danger Formalize your Pull Request etiquette. Danger runs after your CI, automating your team's conventions surrounding code review. This provides another logical step in your process, through this Danger can help lint your rote tasks in daily code review. You can use Danger to codify your teams norms, leaving humans to think about harder problems.

Slide 54

Slide 54 text

Danger? PullRequestͷϧʔϧΛܗࣜԽͯ͠CI͔ΒGitHubͷMachine ΞΧ΢ϯτΛ௨ͯࣗ͡ಈతʹϨϏϡʔͤ͞Δπʔϧ ⚡ ઃఆϑΝΠϧ(Dangerfile)ʹ͸Ruby, JavaScript, SwiftͳͲ ͕࢖͑Δ

Slide 55

Slide 55 text

Dangerfile swiftlint.config_file = '.swiftlint.yml' swiftlint.binary_path = 'Pods/SwiftLint/swiftlint' swiftlint.lint_files inline_mode: true message("Good Job! @#{github.pr_author}") warn("PR is classed as Work in Progress") if github.pr_title.include? "WIP" warn("Big PR") if git.lines_of_code > 500 • SwiftLintͷ࣮ߦ݁ՌΛίϝϯτ • ࿑͍ͷݴ༿ • PRλΠτϧʹWIP͕෇͍͍ͯͨΒίϝϯτͯ͠statusΛwarningʹ͢Δ • มߋ͕500ߦҎ্ͩͬͨΒίϝϯτͯ͠statusΛwarningʹ͢Δ

Slide 56

Slide 56 text

Danger ࢖͍ํ࣍ୈͰ͸ϨϏϡʔλεΫΛܰݮͰ͖ͦ͏ ͔͠͠ฐࣾͰ͸GitHub Enterprise + IP੍ݶʹΑΓEnterprise Ͱͳ͍CI͕࢖͍ʹ͘͘ɺϩʔΧϧJenkinsͷͨΊPullRequest ΛϑοΫͰ͖ͳ͔ͬͨͷͰಋೖͳΒͣ… APIΛ࢖͑͹Ͱ͖ͳ͘͸ͳͦ͞͏ʁ

Slide 57

Slide 57 text

࠷ޙʹ ഑৴ΞϓϦͰ͸৭ʑͱ΍Γ͔ͨͬͨ͜ͱΛࢼͨ݁͠Ռɺࠓޙ ͷ։ൃʹ࢖͍͖͍ٕͬͯͨज़Λ࠾༻Ͱ͖ͨɻ ಛʹ৽͘͠ߟҊͨ͠VueFluxΞʔΩςΫνϟ͸FRESH! CAST ͷ҆શੑͱ։ൃ଎౓ʹҰ໾ങͬͯ͘ΕͨɻΦεεϝ

Slide 58

Slide 58 text

Thanks !