IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE....
Transcript of IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE....
![Page 1: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/1.jpg)
I N T R O D U CT I O N TO
I O S A R C H I T E CT U R E
![Page 2: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/2.jpg)
M O D E L V I E W C O N T R O L L E R
![Page 3: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/3.jpg)
M V C A R C H I T E CT U R E
V I E W M O D E L
ownsowns
updateupdate
C O N T R O L L E R
![Page 4: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/4.jpg)
![Page 5: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/5.jpg)
![Page 6: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/6.jpg)
M A S S I V E V I E W
C O N T R O L L E R
![Page 7: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/7.jpg)
M V V M O R M V C + +
![Page 8: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/8.jpg)
M V V M A R C H I T E CT U R E
V I E W M O D E L V I E W M O D E L
owns owns
update update
V I E W C O N T R O L L E R
![Page 9: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/9.jpg)
override func viewWillAppear(animated: Bool) { super.viewWillAppear(animated)
self.contentLabel.text = data.text let calendar = NSCalendar.currentCalendar(); let unit:NSCalendarUnit = NSCalendarUnit.CalendarUnitMinute let dateComponent = calendar.components(unit, fromDate: data.createdAt, toDate: NSDate(), options: nil) self.descriptionLabel.text = "\(data.firstname) \(data.lastname), \(dateComponent.minute) ago" self.commentButton.setTitle("\(data.numberOfComments) comments", forState: UIControlState.Normal) } …
W I T H O U T M V V M
![Page 10: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/10.jpg)
class DataViewModel: NSObject { var contentText = "" var descriptionText = "" var commentTitle = ""
func initWithData(data: Data) -> DataViewModel { let dataViewModel = DataViewModel() dataViewModel.contentText = data.text let calendar = NSCalendar.currentCalendar(); let unit:NSCalendarUnit = NSCalendarUnit.CalendarUnitMinute let dateComponent = calendar.components(unit, fromDate: data.createdAt, toDate: NSDate(), options: nil) dataViewModel.descriptionText = "\(data.firstname) \(data.lastname), \(dateComponent.minute) ago" dataViewModel.commentTitle = "\(data.numberOfComments)" return dataViewModel } }
W I T H M V V MCreate a viewModel class
![Page 11: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/11.jpg)
override func viewWillAppear(animated: Bool) { super.viewWillAppear(animated)
self.contentLabel.text = viewModel.contentText self.descriptionLabel.text = viewModel.descriptionText self.commentButton.setTitle(viewModel.commentTitle, forState: UIControlState.Normal) } …
W I T H M V V MAfter you initialized viewModel
![Page 12: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/12.jpg)
• MVVM is compatible with your existing MVC architecture.
• MVVM makes your apps more testable
• Because Microsoft
W H Y M V V M ?
![Page 13: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/13.jpg)
![Page 14: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/14.jpg)
The Single Responsibility Principle
![Page 15: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/15.jpg)
V I P ER
![Page 16: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/16.jpg)
![Page 17: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/17.jpg)
Business logic User Interface
![Page 18: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/18.jpg)
V I P E R A R C H I T E CT U R E
V I E W I N T E R A C T O R E N T I T YP R E S E N T E R
R O U T E
D ATA M A N A G E R
UI Interface
Business Logic
![Page 19: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/19.jpg)
D E M O
![Page 20: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/20.jpg)
![Page 22: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/22.jpg)
![Page 23: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/23.jpg)
• Introduction to MVVMhttp://www.objc.io/issue-13/mvvm.html
• The Clean Architecturehttp://blog.8thlight.com/uncle-bob/2012/08/13/the-clean-
architecture.html
• The Principles of OODhttp://www.butunclebob.com/ArticleS.UncleBob.PrinciplesOfOod
• Introduction to VIPERhttp://mutualmobile.github.io/blog/2013/12/04/viper-introduction/
R E S O U R C E S
![Page 24: IOS ARCHITECTURE - files.meetup.comfiles.meetup.com/13201442/CocoaHeads #5... · IOS ARCHITECTURE. MODEL VIEW CONTROLLER. MVC ARCHITECTURE VIEW MODEL owns owns update update CONTROLLER.](https://reader035.fdocuments.in/reader035/viewer/2022062602/5ee13785ad6a402d666c2cb2/html5/thumbnails/24.jpg)
My email is [email protected] if you would like to chat.Follow me @romsi94 because I like tweeting about dishes. I know that you prefer reading my slide, that’s why I wrote a lot. But first, I would like to say thanks to my parents. As developer you should know that 80% of your product development takes as much effort as the last 20%, prepare yourself for those detail challenge ahead. You can imagine how much time I spent to write all of these. I forget to tell you that if you continue to read this I can tell you another story but in French. C’est l’histoire d’un petit garçon qui avait eu un ordinateur pour son anniversaire. Il était très heureux et il apprit le développement. Bon, j’en ai marre d’écrire et si vous continuez de lire meme si c’est en français, je ne peux plus rien pour vous. Thank you for reading it.
T H A N K YO U
thecarevoice.com