How to use MVVM in iOS - State Management and Data Flow through SwiftUI - Example Refactoring Swift
Вставка
- Опубліковано 15 лип 2024
- MVVM (Model - View Model - Model) Swift tutorial. MVVM is a design pattern recommend for SwiftUI 🤩. Next we will see what MVVM means and how it works with SwiftUI. A important part is to understand the data flow. We will see why we use ObservableObject and @Published.
We will be talking about the declarative programming in SwiftUI, where "the truth" comes in. In the view part we will see the difference between @ObservedObject, @StateObject and @EnvironmentObject.
We will use it to improve a sample project and take advantage of it when working in the preview and writing unit tests.
Overview
00:00 Introduction
02:02 Coding example with bad practice
09:48 How does Model - View Model - Model work ⭐️
12:47 MVVM with SwiftUI: State management and data flow ⭐️
26:02 Recoding our coding example to use MVVM
35:58 Advantage of MVVM: dependency injection and showing different states of the view model in the preview
40:56 Advantage of MVVM: easy to include unit testing for SwiftUI projects
44:20 Wrap-up
📖 I wrote a summary blog post about MVVM where you can find all the images from this tutorial here: www.swiftyplace.com/blog/swif...
📖 You can read more about how to learn SwiftUI in this block post that I wrote a wile ago.
/ on-the-road-to-learn-s...
If you liked what you learned and you want to see more, check out one of my courses!
👨💻 my SwiftUI course school.swiftyplace.com/course...
👨💻 my Core Data and SwiftUI course school.swiftyplace.com/course...
👩🏻💻 Combine course school.swiftyplace.com/course...
👉 Overview of Property wrappers in SwiftUI • Property wrappers in S...
👉 @State vs @Binding • SwiftUI tutorial for B...
👉 @ObservedObject vs. @StateObject • SwiftUI by example: @O...
👉 @Published vs @State • @Published vs @State -...
👉 AppStorage and SceneStorage • SwiftUI 2.0 tutorial -...
#SwiftUI #Xcode #Programming #DesignPatterns
The work that you put into this is simply amazing... I really hope you do more content!
I have watched many tutorials, they felt like the tutor have read something and delivering to us. But in this it feels like the content is created by her. Love from India.
The First MVVM-Tutorial, which I completely understood... Thank you for your work and nice and understandable drawings.
I love the whole thing, especially the diagrams and high level overview. Great pace. Thank you!
If you prefer a written tutorial, you can go to my new blog www.swiftyplace.com/blog/swiftui-and-mvvm. The code and images are available too.
with tests as well! truly a treat. Thank you!
I love your drawing/diagrams!! Thank you so much!!
PhysicsNerd is a treasure. This is a great accelerated walkthrough. I especially liked the clean code organization and the inclusion of basic unit tests. Great stuff.
3:00 background cat >>>>>>
This works for me. Momentum and depth. Keep up the good work!
Excellent detailed explanation. Much appreciated.
Thank you for this! You are an excellent teacher! 👍
You are a great teacher, and these tutorials are really helpful and very informative...pleas keep on posting many many more of them :)
Fantastic video, very nicely explained and great visuals describing everything! Thank you
Thanks! Herzlichen Dank! Sehr informativ. Keep up good work!
You are very thorough. It helps as you think out loud as show your drawings. Thank you.
Hi Karin, love the way you explain things ! Like a PRO ! Merci beaucoup !
Very well explained! Thank you!
The way this Tutorial is setup, is super and i just want to learn more
You're the best! Thank you!
You have a great skill for teaching. Your explanations are so detailed and helpful. Thank you.
this is an awesome overview, thankyou!
what a wholesome video, thank you Karin!
Fantastic presentation. Everything is super clear, thank you very much!!!
This is brilliant. Thank you for providing such a detailed overview of MVVM, providing an example and simplifying it all to make it really easy to understand. I have been looking for something just like this!
Another video very similar to this showing people how to do exactly the same process, but with Firebase: FireStore read/write etc. instead of local data would also be a great addition in my opinion. There really isn't any videos that i've managed to find that break firebase down into a simplistic app...I think people would benefit greatly from it.
Thanks again.
This is amazing💖thank yo so much!
You are a very good instructor. Wishing you good luck and I will be following you closely.
Thank you!! it was really helpful
I love the way you put all the things separately and properly while explaining. Thanks for this tutorial. I was totally confused about the SwiftUI lifecycle and structure. But after watching your videos, it helps me to understand it easily. Right now I can say that I have some better idea about the SwiftUI. Thanks once again. ❤️
This was exactly what I needed to fully understand how to do MVVM is SwiftUI. Thanks so much!!!
Many many thanks for your videos. Especially the details you go into with so many diagrams. Please continue doing so. When my first app goes live, I hope I can donate a part to you and other amazing teachers I learnt from.
Your drawings are so helpful! Especially the one at 9:59. That feels to be really clicking for me. Thank you for putting all the hard work into this video.
Your tutorials are 💎
This work is amazing. Thanks for everything
Really enjoying your courses Karin. Thank you!
Very clear, thanks a lot!
Reaaally good tutorial, thanks a lot!
great video! thanks for making it 👍😘
Great work! I hope this video gets more attention.
Thanks for such an informative tutorial.
Thank you very much. Amazing tutorial ♥
Thank you so much! It's easy to understand!! I really love those faces!
you are amazingg thanks!!!
Superb video, right to the point!
Wow! Amazing video !!!
wow, this is so nice explanation!
Amazing! Thank you for this video of quality
I am treated up for your videos. Please keep it up.
Very helpful, thanks a lot! ❤️👍
Superb content Karin, helped me immensely x
Gorgeous. Subscribed!
Hi Karin, thumbs up! amazing! Thanks a lot for your efforts for this fantastic video! Absolutely useful! Great!
Awesome tutorial! You are the best. 👍
If you have time, I would be very grateful for showing how to use MVVM with CoreData in SwiftUI. Thanks!
amazing!!
Dear Karin, great content, thank you :-)
I really enjoy your content.
This is exactly what I've been searching for. I'm have a lot of experience with MVVM in C# WPF applications. I'm starting a new project on iOS and this video gives me everything I need to get to work.
Your way of explanation 🎉 something special madam 👍
Good explanation and the diagrams were really well done. Thank you for the content.
Glad it was helpful!
Amazing tutorial. I come from an Android background but this was definitely easy to follow along. Would definitely pay for any courses you have if they're anything like this.
Thanks!
you're amazing! thank you thank you thank you :)
You're so welcome!
you are the greatest have a good year
Thank you
Wow as an Intermediate~Advance iOS Developer, this is very concise and easy to understand, straight to the point, I love when you explaining with drawings, you're a natural Teacher, Thank you Karin! you earned my Subscription :D
This is great. I bought both your udemy courses.
nice work
good!! Awsome lecture!
Glad you liked it!
Hello,
First of all, thank you for your information. I don't understand how you did it in 45 min. But, you have explained all of the critical information about MVVM, Property Wrappers, SwiftUI etc. You are a really incredible teacher. If you speak a little slower than normal it would be perfect for people whose doesn't native language is English. I watched with 0.75 :)
I became your huge fan!
This video is by far the best I could find to finally understand MVVM and property wrappers. Thanks a lot.
I have small side question regarding the Test project: when you added the ZStack, the background of the app became gray. I couldn't figure out how to make it back to white. Why did it became gray and how to change it?
I think I've watched this three times now. I watched it two months ago when I first started my app. Lost appreciation for MVVM. Now that I have a fairly complex app... my appreciation is back.
I am very happy that you could gain this understanding. It is hard to show a larger project in a tutorial.
But this is exactly when MVVM helps to organise the code.
Great video! This helps me a lot in learning MVVM. Would you be able to update this for Xcode 13 and SwiftUI 5? NavigationView has drastically changed so a lot of the codes here no longer function as well.
Subscribed
nice
Really enjoying your videos. One thing that would interest me is how one would combine MVVM with the Coordinator pattern in modern Swift. Or are there better patterns for navigating in huge projects?
Cool visuals!
All done on my iPad with my Apple pencil. Feels like I can use a white board. 🤓
Done using Procreate on ipad? Very nice visuals. Please do more videos on SwiftUI
@@TechRagh Procreate is to much functionality for me. This is made with my own app. Still very buggy. But you can try it here apps.apple.com/us/app/assocy-the-genius-notebook/id1464579365
Hi Karin, deine Art zu erklären gefällt mir wirklich sehr gut. Ich würd mich sehr freuen, wenn du ein Video zum Thema APIs machen könntest. Vielleicht auch mal eine Zusammenfassung deiner liebsten Swift Bücher/ Lernunterlagen, Tipps etc.
Weiter so!
Hi Mona, freut mich dass dir meine Erklärungen gefallen. Ich wollte noch ein paar Videos zu Combine machen und die integration mit Core Data und realm. Ich werde mal sehen was ich für ein video zum Thema "Wie kann man Swift und UIKIt / SwiftUI lernen" machen kann.
The cat in the background is sooo cute that I can't focus on the actual tutorial
That is Louis job as cohost. He is very good at being cute. 🤩
You did a great job 👏 thank you very much! May I ask, are you from Germany ?
Hi Karin, great video, thanks so much for making it. I did have a question about some other file groups that I have seen in people's project, like services, extensions, utilities, and repositories. How do these elements fit into the MVVM blueprint you've discussed here? Thanks.
Very interesting and well explained. A little bit to fast, but i can stop and watch parts again. Could you please make a video how to handle CoreData with models. E.g. Players and statistics stored in coredata and use them in a model (maybe a simple game)? Whats the way to go using coredata objects in other models?
Hi,
Thanks a lot for the info, it was very helpful. When you create the Navigation Link for the name, if you wanted to have a more detailed view and perhaps edit details of "name" would it be necessary to create an entirely new view or could we incorporate a func in the VM to do so?
Love listening to your videos but I cannot take the bright white screen. Would you consider using dark mode? Most agree that the contrast is much better and easier on the eyes. I haver glaucoma and it is tough with sight only in my right eye. I appreciate what you do and either way will continue listening!
Hi Karin, thank you for providing such clarity on this subject. Suppose you want to maintain persistent data in a json file. What might be the simplest method to maintain one 'persistent' data source? My efforts are fraught with mutability issues. TIA
big thanks for your work!!great tutorial!!!
how can I get this wonderful SwiftUI road map?)
//I really need it
Excellent video. If you could do dark mode, reading the code would be a little easier on the eyes.
Nice work! May I ask what do u use for these beautiful diagrams?
Thank you. You explained it very well! Where should I create other view models? For example, I want to create another view model for editing items, so the model will represent a single item. Should I create an instance of that view model inside the main view model, or in the view itself or something else?
Thank you very much for your amazing work! May I ask you a question please? If I wanted to have a list of words (for example, English words with translation) already pre-populated, is it okey to use such an approach with a StateManager.fullState() or what is a best approach for such this cases?
Very good video. How can I modify the state of a view model from another view model? Should I do it or do it from another way?
This is an amazing video. Are the diagrams your own? They should be in the official docs!
Thanks for the nice words. The drawings are all mine. If the official docs get more images like these, I would be super happy too. I need to see visuals to understand.
Do you have any Udemy courses, I will be happy to buy it and study from you! Your explanation is awesome! I finally understood MVVM approach with CRUD (Create, Read, Update, Delete) operations and example of simple tests! Amazing training!
This is indeed a fantastic tutorial. Even as a beginner, I understand most, thank you!
One question if you (or others) don't mind.
You have talked about how a ViewModel interacts with a View.
But what do you do, if you have two ViewModels and want them to interact?
I have tried in ViewModel A to add ViewModel B as an @StateObject (get an error: )
weird
That's a good question that I have asked myself as well-I guess what it comes down to is to find a spot in your application where you have access to both of the view models (most likely the spot where they are created), passing down a reference to the respective other view model. Those could be optional properties, I guess.
You should go one more time to the Video all the drawings. To ViewModel is interacting with the Model.
👍🏼👍🏼👍🏼
Awesome content! Thanks 😊
Is this presentations available download for further checks?
I summarised the video in this blog post www.swiftyplace.com/blog/swiftui-and-mvvm. You can find all the images there.
@@SwiftyPlace great! I’ll check it out. Thanks for this 👏
Awesome content, thanks a lot! What is your solution to handing down instances to the detail view from a list to let the user make changes (like e.g. changing the todo's title-as your are handing down an unmutable instance from within the closure, you do not have a binding... Right now, I create a binding myself in the detail view by finding the instance via it's `id` in the view models array, but I do wonder if there is a better way to do this...
I think changing the item in the item array by id, is a feasible approach. Not sure if there is a different way because your data always is represented by this data array and that is the one that needs to be changed.
For the title I would have an extra @Published property in the view model. In order to let the user change it, I would show an extra editor view with a textfield. The view gets access to the view model with @ObservableObject or directly to the view models property with @Binding.
Thank you for this video. Where do you manage @FetchRequest with CoreData? IMO it should go in the ViewModel. Or do you use it in the View directly?
It would be great if we could use @FetchRequest in a view model. This will not work because it needs the NSManagedContext that has to be added in the environment with .environment\.managedObjectContext, context)
Core Data with MVVM is a bit more tricky. I explain more about it in this Core Data specific tutorial ua-cam.com/video/63oyC5bUujc/v-deo.html
treasure
Hi in the beginning of the video there is a beautiful road map. How can I reach that ?
PhysicsNerd?!?! I majored in Physics and I'm just now getting into Swift after working with Kotlin and Node for a while. What got you into development instead of working in something like academia related to physics?