FRESH!配信アプリで採用した事・しなかった事

439ebe4787a98881df8a59d41baf4a43?s=47 Ryo Aoyama
January 25, 2018

 FRESH!配信アプリで採用した事・しなかった事

CA.swift #5
25 JAN. 2018
VueFlux https://github.com/ra1028/VueFlux

439ebe4787a98881df8a59d41baf4a43?s=128

Ryo Aoyama

January 25, 2018
Tweet

Transcript

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

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

    GitHub: @ra1028 Twitter: @ra1028fe5
  3. None
  4. ϩάΠϯෆཁɾߴը࣭ɾ௿஗ԆͰݟ์୊ όϥΤςΟʹ෋Μͩੜ์ૹಈըͷ഑৴ϓϥοτϑΥʔϜ

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

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

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

    • ϥΠϒϥϦ
  8. 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.
  9. None
  10. None
  11. Actions

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

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

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

  15. None
  16. Mutations

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

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

  19. None
  20. State

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

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

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

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

  25. None
  26. ViewController

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

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

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

  30. Contents • SVG ΞΠίϯϦιʔε • XcodeGen • Danger • VueFlux

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

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

  34. Contents • SVG ΞΠίϯϦιʔε • XcodeGen • Danger • VueFlux

    ΞʔΩςΫνϟ • ϥΠϒϥϦ
  35. ΞΠίϯϦιʔε PNG? JPEG? PDF?

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

  37. Icon Fonts • ϕΫλʔͳͷͰαΠζมߋͰ࠶࡞੒͢Δඞཁ͕ͳ͍ • ୺຤αΠζ͝ͱ(1x, 2x, 3x)ͷ༻ҙ͕͍Βͳ͍ • UILabel,

    UIButton౳ͱͷ૬ੑ͕͍͍ • ༰ྔ͕খ͍͞
  38. SVG͕͑͑ͳ ͔͠͠…

  39. 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
  40. Font Custom https://github.com/FontCustom/fontcustom SVGϑΝΠϧ܈͔ΒTTF(ϑΥϯτ)ϑΝΠϧʹ Ϛοϐϯά͢Δπʔϧ

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

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

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

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

    • Ϧετ؅ཧ
  45. 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
  46. XcodeGen https://github.com/yonaskolb/XcodeGen ཁ͸YAMLϑΝΠϧʹهड़ͨ͠ઃఆ͔Β xcodeprojΛੜ੒͢Δ xcodeproj(pbxproj)ΛgitignoreͰ͖Δ

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

  49. • Derived Data(Ωϟογϡ)ෆ੔߹ͰϏϧυΤϥʔ • Checkoutͷ౓ $xcodegen গ͠ਏ͍ • ຖճ $pod

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

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

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

    • ϥΠϒϥϦ
  53. 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.
  54. Danger? PullRequestͷϧʔϧΛܗࣜԽͯ͠CI͔ΒGitHubͷMachine ΞΧ΢ϯτΛ௨ͯࣗ͡ಈతʹϨϏϡʔͤ͞Δπʔϧ ⚡ ઃఆϑΝΠϧ(Dangerfile)ʹ͸Ruby, JavaScript, SwiftͳͲ ͕࢖͑Δ

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

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

  58. Thanks !