Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Introducing CodeLayout with Tips
Search
satoshin21
March 28, 2018
Technology
1.7k
6
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Introducing CodeLayout with Tips
AKIBA.swift × エウレカ
satoshin21
March 28, 2018
More Decks by satoshin21
See All by satoshin21
少数精鋭で戦うための技術的改善について
satoshin21
3
1.5k
GTXiLibで小さく始めるAccessibility Testing
satoshin21
0
5.5k
iPhoneのカメラで写真撮影から現像までの技術を紐解く
satoshin21
5
3.9k
try! swift-sh
satoshin21
2
1.1k
Reduxを取り入れて開発はpairs開発はどう変わったか
satoshin21
0
420
レガシーなアプリケーションの 60fps化を目指す為にやっていること
satoshin21
12
4.2k
World of No Interface Builder
satoshin21
0
2.1k
What I've done to attend WWDC
satoshin21
0
160
Swift Package Manager V4でAlfred Workflowを作ろう
satoshin21
0
320
Other Decks in Technology
See All in Technology
Claude Codeを「使うほど育つ」AI秘書にするノウハウ
minorun365
PRO
33
30k
C#未経験の僕がAIに読めるコードを書かせるまで
maguroalternative
0
210
AIによるクリエイティブ生成を行う上での試行錯誤
plaidtech
PRO
0
170
Making AI Agents Safe and Fast- Jev, Obsidian, and the Meta-Harness
x5gtrn
PRO
0
110
Vibe Coding で作ったプロダクトをどう安全に動かすか / How to Safely Run Products Built with Vibe Coding
glidenote
0
460
Railsのように考える: See through the Master
snoozer05
PRO
5
1.2k
サーバーレスをどこまで使う? WebRTC対戦ゲームで選んだVPSとの共存設計
kaidouji85
0
300
データ界隈LT祭 第1回LT登壇
taromatsui_cccmkhd
2
1.5k
登壇の自信を奪う3匹のオバケ / 3 Ghosts That Rob You of Your Confidence in Public Speaking
pauli
9
1.1k
山手線を徒歩で一周してわかった、 位置情報アプリは「足」が最強のデバッガー
hinakko
0
180
Goodbye ShellScript, Hello File-based App
shunsock
0
630
銀行勘定系システムにおける開発プロセス刷新×AIによる環境モダナイゼーション / Development Process Transformation and AI-Driven Environment Modernization
muit
1
2.6k
Featured
See All Featured
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
600
Sam Torres - BigQuery for SEOs
techseoconnect
PRO
0
540
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
38
3k
SEO Brein meetup: CTRL+C is not how to scale international SEO
lindahogenes
2
2.9k
Mozcon NYC 2025: Stop Losing SEO Traffic
samtorres
1
550
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
apolaine
2
430
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
2
510
Fashionably flexible responsive web design (full day workshop)
malarkey
409
67k
A Tale of Four Properties
chriscoyier
163
24k
Redefining SEO in the New Era of Traffic Generation
szymonslowik
1
420
Code Reviewing Like a Champion
maltzj
528
40k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
2.2k
Transcript
Copyright © 2017 eureka, Inc. All rights reserved. ίʔυϨΠΞτͷεεϝ Introducing
CodeLayout with Tips
Copyright © 2017 eureka, Inc. All rights reserved. 2 $
whoami !TBUPTIJO QBJST+1J04"QQMJDBUJPO&OHJOFFSBUFVSFLB *OD J04 "OESPJE "QQMF4DSJQU 5ZQF4DSJQUษڧத .BSWFM$JOFNBUJD6OJWFSTFେ͖
Copyright © 2017 eureka, Inc. All rights reserved. 3 Agenda
Ͳ͏ͯ͠*OUFSGBDF#VJMEFSΛΘͳ͍ܾஅΛͨ͠ͷ͔ ίʔυϨΠΞτͷਏ͍ॴ ίʔυϨΠΞτΛΩϨΠʹॻ͘ҝʹ
Copyright © 2017 eureka, Inc. All rights reserved. 4 Target
audience ݱࡏ*OUFSGBDF#VJMEFSΛ͍ͬͯͯɺਏ͞Λײ͍ͯ͡Δ TUPSZCPBSEͱYJCͷϨϏϡʔ͕ਏ͍ ͔͠͠ɺίʔυϨΠΞτίʔυྔ͕૿͑ͦ͏Ͱ͍᪳ͯ͠Δ
Copyright © 2017 eureka, Inc. All rights reserved. 5 pairs
Japan *OUFSGBDF#VJMEFS͍ͬͯ·ͤΜ "VUP-BZPVU͍ͬͯ·͢
Copyright © 2017 eureka, Inc. All rights reserved. 6 pairs
Global *OUFSGBDF#VJMEFS͍ͬͯ·ͤΜ 5FYUVSF :PHBͳͲ"VUP-BZPVUҎ֎ͷϨΠΞτΤϯδϯͱ"VUP-BZPVU ΛҰॹʹ͍ͬͯ·͢
Կނ Interface builderΛ Θͳ͍ͷ͔
Copyright © 2017 eureka, Inc. All rights reserved. 8 IBOutlet,
IBAction *NQMJDJUMZ6OXSBQQFE0QUJPOBM *#ͱίʔυͷඥ͚Εʹؾ͖ͮʹ͍͘ *OJUJBMJ[FSͰͷ6*ఆ͕ٛͰ͖ͳ͍ ΄ΜͱʹOJMͷϋϯυϦϯάͰ͖ͯΔʁ 3YͳͲʹΑΓΠϕϯτʹΑΓ6*ͷૢ࡞ൃੜ࣌ͳͲ
Copyright © 2017 eureka, Inc. All rights reserved. 9 Segue͕ਏ͍
QSFQBSF'PS4FHVFTFOEFSʹॳظԽͷॲཧΛ·ͱΊͳ͚ΕͳΒͳ͍ QFSGPSN4FHVFͷ*EFOUJpFS4USJOH ͭΒ͍
Copyright © 2017 eureka, Inc. All rights reserved. 10 Continuous
Developingʹ͔ͳ͍(ؾ͕͢Δ) ॳճߏங࣌&NQUZ7JFX͕͚ͭͩͩͬͨͩͬͨΒ*#্Ͱɾɾ &NQUZ7JFXͷछྨ͕Ճ͞Εͨ 4UPSZCPBSE্ͰՃ͢Δ ·ͨ&NQUZ7JFXͷछྨ͕Ճ͞Εͨ -
None
Copyright © 2017 eureka, Inc. All rights reserved. 12 Continuous
Developingʹ͔ͳ͍(ؾ͕͢Δ) 7JFX͕ॏͳΓ߹͏ࠈ ࠷ॳͷઃܭͷͩͬͨՄೳੑ͕ߴ͍͕ɺ*OUFSGBDF#VJMEFS্Ͱ੍Λ อͬͨ··ϨΠΞτ༷Λมߋ͢Δͷࠔ ಈతͳϨΠΞτมߋͩͱঘߋ
Copyright © 2017 eureka, Inc. All rights reserved. 13 try!
Swift After TalksͰͨ͜͠ͱ 6*7JFXͷBUUSJCVUFTͲ͜Ͱఆٛ͢Δͷ 4UPSZCPBSEYJCͷSFWJFXਏ͍Α
ίʔυϨΠΞτʹ Ҡߦͯ͠1 தʑ͏·͘Ε͍ͯΔ
ίʔυϨΠΞτͰ Կ͕มΘ͔ͬͨ
Copyright © 2017 eureka, Inc. All rights reserved. 16 ViewControllerͷ։ൃʹ੍ݶ͕ͳ͘ͳͬͨ
JOJUJBMJ[FSͰͷґଘੑೖ JOJUJBMJ[FSͷ׆༻ͷ෯͕͕ͬͨ (FOFSJDTΛ༻͍ͯ7JFX$POUSPMMFSΛ։ൃ ίʔυޙ΄Ͳ
Copyright © 2017 eureka, Inc. All rights reserved. 17 ܧଓత։ൃ͕͍͢͠
"#ςετ͕ͱʹ͔͍͘͢͠ 6*ύʔπͷࠩ͠ସ͑*#ʹൺͯ҆қ ঢ়ଶʹΑͬͯϨΠΞτ͕ΓସΘΔ༷ίʔυʹ͢Δ͜ͱͰ࣮ݱ͠ ͘͢ͳͬͨ
Copyright © 2017 eureka, Inc. All rights reserved. 18 ͦͷଞ
BUUSJCVUFTίʔυ্Ͱఆٛ͢ΔͷΈ SFWJFX4UPSZCPBSEYJC YNM ʹൺͯ֨ஈʹ͠қ͍ 3FWJFXFS DPOqJDUमਖ਼͕҆қʹ
Copyright © 2017 eureka, Inc. All rights reserved. 19 AutoLayout
ͨͩɺKQະͩ"VUP-BZPVUΛ͍ͬͯΔ ݱߦҠߦ͢Δʹ5FYUVSFͷֶशίετ͕ߴ͍ "VUP-BZPVUʹݶքΛײ͍ͯ͡ΔҝɺݱࡏҠߦΛݕ౼த ίʔυϨΠΞτʹ͓͔ͨ͛͠ͰɺϨΠΞτΤϯδϯͷҠߦ͠қ͍ ͣ
͔͠͠
ίʔυϨΠΞτʹ ͋Δఔͷਏ͕͋͞Δ
Copyright © 2017 eureka, Inc. All rights reserved. 22 ίʔυϨΠΞτͷਏ͞
ίʔυྔͷ૿େ "VUP-BZPVUͷ੍ఆٛ ίʔυϏϧυϨΠΞτ֬ೝίʔυͷαΠΫϧ ͳΜͱ͔͜ͷਏ͞Λܰݮ͍ͨ͠
Copyright © 2017 eureka, Inc. All rights reserved. 23 ίʔυྔͷ૿େ
ίʔυྔͷ૿େࣗମͦΕ΄ͲͰͳ͘ɺݟ௨͕͠ѱ͘ͳΔ͜ͱ͕ 4DPQFT 'BLF /BNFTQBDFT "UPNJD%FTJHO
Copyright © 2017 eureka, Inc. All rights reserved. Clean Code:
Scopes
Copyright © 2017 eureka, Inc. All rights reserved. 25 Scopes:
apply extension CustomDebugStringConvertible { @discardableResult func apply(_ closure: (Self) -> Void) -> Self { closure(self) return self } } self.titleLabel = UILabel(frame: .zero).apply({ $0.translatesAutoresizingMaskIntoConstraints = false $0.textColor = PairsPalette.gray01 $0.font = .boldSystemFont(ofSize: 15) $0.textAlignment = .center })
Copyright © 2017 eureka, Inc. All rights reserved. 26 Scopes:
apply extension CustomDebugStringConvertible { @discardableResult func apply(_ closure: (Self) -> Void) -> Self { closure(self) return self } } self.titleLabel = UILabel(frame: .zero).apply({ $0.translatesAutoresizingMaskIntoConstraints = false $0.textColor = .gray01 $0.font = .boldSystemFont(ofSize: 15) $0.textAlignment = .center })
Copyright © 2017 eureka, Inc. All rights reserved. 27 Scopes:
do constrain: do { constrain(view, backgroundView) { (view, backgroundView) in backgroundView.leading == view.leading backgroundView.trailing == view.trailing } } rxSetup: do { viewModel.didSomething .subscribe(onNext: { self.doSomething() }) .disposeWith(self) }
Copyright © 2017 eureka, Inc. All rights reserved. 28 Scopes:
do constrain: do { constrain(view, backgroundView) { (view, backgroundView) in backgroundView.leading == view.leading backgroundView.trailing == view.trailing } } rxSetup: do { viewModel.didSomething .subscribe(onNext: { self.doSomething() }) .disposeWith(self) }
Copyright © 2017 eureka, Inc. All rights reserved. 29 Scopes:
do constrain: do { constrain(view, backgroundView) { (view, backgroundView) in backgroundView.leading == view.leading backgroundView.trailing == view.trailing } } rxSetup: do { viewModel.didSomething .subscribe(onNext: { self.doSomething() }) .disposeWith(self) }
Copyright © 2017 eureka, Inc. All rights reserved. Clean Code:
Namespaces
Copyright © 2017 eureka, Inc. All rights reserved. 31 Namespaces
7JFXͷυϝΠϯΛҙࣝͤ͞Δ υϝΠϯຖʹ໊લۭؒΛ࡞ͬͯ۠ΓɺείʔϓΛ࡞Δ
Copyright © 2017 eureka, Inc. All rights reserved. 32 Namespaces
֤4DFOFʹఆٛ͢Δ7JFXΛٖࣅత/BNFTQBDFΛ࡞ͬͯάϧʔϐϯά͢Δ enum Card { enum SceneName {} enum Scene2Name {} }
Copyright © 2017 eureka, Inc. All rights reserved. 33 Namespaces
extension Card.SceneName { final class Overlay: UIView { override init(frame: CGRect) { super.init(frame: frame) // ... } @available(*, unavailable) required init?(coder aDecoder: NSCoder) { fatalError() } } } let overlayView = Card.SceneName.Overlay(frame: .zero) addSubview(overlayView)
Copyright © 2017 eureka, Inc. All rights reserved. 34 Namespaces
extension Card.SceneName { final class Overlay: UIView { override init(frame: CGRect) { super.init(frame: frame) // ... } @available(*, unavailable) required init?(coder aDecoder: NSCoder) { fatalError() } } } let overlayView = Card.SceneName.Overlay(frame: .zero) addSubview(overlayView)
Copyright © 2017 eureka, Inc. All rights reserved. Atomic Design
Copyright © 2017 eureka, Inc. All rights reserved. 36 Atomic
Design "UPNJD%FTJHOΛ ͋Δఔ ҙࣝͯ͠7JFXύʔπΛ࡞͢Δ 7JFXͷ࠶ར༻ੑΛߴΊΔ
Copyright © 2017 eureka, Inc. All rights reserved. 37 Atomic
Design "UPNT .PMFDVMFT 0SHBOJTNT 5FNQMBUFT 1BHFT
Copyright © 2017 eureka, Inc. All rights reserved. 38 Atomic
Design "UPNT .PMFDVMFT 0SHBOJTNT 5FNQMBUFT 1BHFT "UPNTϨϕϧͰ࡞͍ͬͯΔͱͭΒΈ͕ଟ͍ͷͰɺ.PMFTDVMFTϨϕϧͰ7JFX Λఆٛ͢Δ ͱ͍͑ɺ6*ύʔπͷׂσβΠφʔɺٴͼ4LFUDIϑΝΠϧͱরΒ͠߹ Θͤͳ͕Β֬ೝ͖͢
Copyright © 2017 eureka, Inc. All rights reserved. 39 Atomic
Design: Generics as Templates .PMFDVMFT 0SHBOJTNTΛ6*7JFXͰ࡞Δ 5FNQMBUFTΛ6*7JFX$POUSPMMFSͱ(FOFSJDTͰఆٛ͢Δ ґଘੑΛೖͯ͠1BHFTΛ࡞Δ
Copyright © 2017 eureka, Inc. All rights reserved. 40 Atomic
Design: Generics as Templates final class CardsViewController<ViewModel: CardViewModel, DataSource: CardDataSource>: UIViewController { private let viewModel: ViewModel private let dataSource: DataSource init(viewModel: ViewModel, dataSource: DataSource) { self.viewModel = viewModel self.dataSource = dataSource super.init(nibName: nil, bundle: nil) } @available(*, unavailable) required init?(coder aDecoder: NSCoder) { fatalError() } }
Copyright © 2017 eureka, Inc. All rights reserved. 41 Atomic
Design: Generics as Templates final class CardsViewController<ViewModel: CardViewModel, DataSource: CardDataSource>: UIViewController { private let viewModel: ViewModel private let dataSource: DataSource init(viewModel: ViewModel, dataSource: DataSource) { self.viewModel = viewModel self.dataSource = dataSource super.init(nibName: nil, bundle: nil) } @available(*, unavailable) required init?(coder aDecoder: NSCoder) { fatalError() } }
Copyright © 2017 eureka, Inc. All rights reserved. 42 Atomic
Design: Generics as Templates let viewModel = UserCardType.Pickup() let dataSource = PickupCardDataSource(viewModel: viewModel) let cardViewController = CardsViewController(viewModel: viewModel, dataSource: dataSource)
Copyright © 2017 eureka, Inc. All rights reserved. AutoLayoutͷ੍
Copyright © 2017 eureka, Inc. All rights reserved. 44 AutoLayout:
Cartography SPCC$BSUPHSBQIZͰ"VUP-BZPVU Λఆٛ͢Δ "VUP-BZPVUͷఆٛͷείʔϓΛڧ ੍తʹڱΊΒΕΔ $POUFOUIVHHJOHQSJPSJUZ7JFX ͷଐੑͱͯ͠ѻ͍ɺBQQMZͰఆٛ ͢Δ
Copyright © 2017 eureka, Inc. All rights reserved. ࣮αΠΫϧ
Copyright © 2017 eureka, Inc. All rights reserved. 46 ࣮αΠΫϧ
2ʮίʔυϨΠΞτͩͱ࣮ࡍͷϨΠΞτΛίʔυ͔Β૾͠ʹ͍͘ͷ Ͱͳ͍͔ʯ "͔֬ʹجຊతʹϏϧυͯ֬͠ೝ͢Δ
Copyright © 2017 eureka, Inc. All rights reserved. 47 ࣮αΠΫϧ
QBJSTͷಛੑ্ɺ6TFS4UBUVTʹԠͯ͡ಈతʹΓସΘΔը໘͕ଟ͍ ͦͦ*#্ͷ੩తͳଥੑݕূ͕͠ਏ͍ঢ়ଶ ͦΕͰίʔυϏϧυϨΠΞτ֬ೝίʔυͷαΠΫϧݮΒ͠ ͯ։ൃΛߴԽ͍ͨ͠ ϥϯλΠϜͰϨΠΞτΛௐͭͭ֬͠ೝ͢Ε͍͍͡ΌΜ͔
Copyright © 2017 eureka, Inc. All rights reserved. 48 ࣮αΠΫϧ
3FWFBM ϥϯλΠϜ7JFXσόοάπʔϧ 7JFXͷBUUSJCVUFTDPOTUSBJOUTΛϥϯ λΠϜ্Ͱมߋ ݟͨΛϦΞϧλΠϜͰม͑ͳ͕Β࣮ αΠΫϧΛ࠷খݶʹ͢Δ %&.0͠·͢
Copyright © 2017 eureka, Inc. All rights reserved. 49 ·ͱΊ
ӡ༻εςʔδʹೖΔͱɺ*OUFSGBDF#VJMEFSਏ͔ͬͨ ίʔυϨΠΞτʹҠߦ͢Δ͜ͱͰɺมԽʹڧ͘ͳΔ ʮมԽʹ࠷ରԠͰ͖Δੜ͖͕ੜ͖Δʯ ίʔυϨΠΞτͷπϥϛɺͰݮͰ͖Δ
Ϣʔβʹͱͬͯ ΤϯδχΞʹͱͬͯ շదͳϓϩμΫτΛ
Thank you IUUQTXXXOBTBHPWNJTTJPO@QBHFT/11OFXTFBSUIBUOJHIUIUNM