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

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

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
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.
11. Actions
12. Actions ঢ়ଶભҠͤ͞ΔActionΛఆٛ enumͰ΋structͰ΋ܕ͸ͳΜͰ΋OK
13. Actions APIϦΫΤετͷϨεϙϯεʹԠͯ͡ActionΛDispatch
14. Actions ActionsͰ͸֎෦΁ͷґଘͳ͘ɺσʔλͷऔಘͳͲΛߦ͍ɺ ͦͷ݁ՌΛenumͳͲͷActionʹPayloadͯ͠ఴ෇ͯ͠ Dispatch͢Δ
16. Mutations
17. Mutations Stateͷঢ়ଶมߋ͸MutationsΛհͯ͠ͷΈʹݶఆ͞ΕΔ
18. Mutations iOSʹ͸React΍ElmͰ͍͏Virtual DOMͷΑ͏ͳࠩ෼ߋ৽ γεςϜ͕ͳ͘ɺImmutableͳStateͰ͸ෳࡶͳঢ়ଶΛදݱ ͮ͠Β͍ VueFluxͰ͸ClassͷMutableͳStateͷ಺෦ঢ়ଶΛActionͷ ࣝผʹΑͬͯݸผʹߋ৽͢Δ
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ΛಉҰϑΝΠϧʹ͢Δ͜ͱͰΞΫηεϨ ϕϧΛ੍ݶ͢Δ
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 !