Most of the people I speak to are SharePoint people or those who are getting into SharePoint. I find a good number of them don’t have experience with Silverlight and when I talk to them about this topic (Silverlight, MVVM & SharePoint 2010), I get the same questions such as:
- “How did you learn MVVM?”
- “How did you get up to speed on MVVM?”
- “Do you use a toolkit and why?”
- “How would you recommend I get up to speed on learning MVVM?”
In this post I’m going to try to answer these questions.
How do you learn MVVM? / How did you get up to speed on MVVM?
First, MVVM stands for Model-View-View Model. There are plenty of posts out there that explain what it is. There’s a good article on Wikipedia defining it. As I explained previously, I learned MVVM one week when I finally decided I needed to understand this buzz around this pattern. For me I set aside a week to get up to speed. For about 4 hours I read a lot of posts and watched some videos. I first watched a few videos from Pixel8, a podcast by Infragistics. There’s one video on doing MVVM in WPF and another with Silverlight that helped with the simplest of examples. I then read a bunch of articles/posts by the likes of the following founders / leading thinkers on the subject:
- Josh Smith (the founder you could say)
- Larent Bugnion
- Jeremy Likness
- John Papa
- Glenn Block
- Rob Eisenberg
The best videos & articles are the following (in my opinion of course)
- Josh Smith’s WPF Apps With the MVVM Design Pattern article in MSDN
- Dan Wahlin’s Getting Started with MVVM Pattern in Silverlight Apps article
- Swarn Wildermuth’s MVVM In Silverlight 2 Apps article in MSDN
- Video on Understanding the MVVM Pattern & Deep Dive MVVM on Laurent Bugnion’s site
After I felt like I had a solid understanding I started picking out building a sample app that I needed. I had numerous questions along the way and the MVVM tag on StackOverflow was very helpful. After working through this app for a two days or so, I felt I had a good grasp on the pattern.
Do you use a toolkit and why?
After the initial ramp up time, I then decided to look at a few of the toolkits that were out there. Ultimately I settled with the MVVM Light Toolkit by Larent Bugnion. I really liked it because it wasn’t a heavy handed “you must do things” this way type of toolkit as some of the others do. Instead I felt like it was filling a few gaps that you needed to do on your own to implement MVVM (such as the DispatcherHelper that assists with threading). Other things helped you stay closer to the spirit of MVVM (such as the ViewModelLocator) and others were just helping you code less (RelayCommands) or providing extra functionality (Messages). Now I can’t see myself building a XAML based application without using the MVVM Light Toolkit.
How would you recommend I get up to speed on learning MVVM?"
Great question… one I’ve put some thought behind. First, I’d do the same thing I did by watching the Pixel8 videos referenced previously. Next, see if you can’t get your hands on an example application that uses the MVVM pattern… this will give you what I call a reference implementation (RI). I’ve got one you can grab from my company site, Critical Path Training. Just navigate to the Members section & sign in (create a free sign in if you don’t already have one) and look in the code samples for the AC’s SharePoint+Silverlight+MVVM Sample Product Browser download. I plan to keep updating it with new stuff.
Now, start working on your own RI. You’ll use this as a reference for future apps. The trick is you want to make sure you include enough tasks to cut your teeth on the common stuff you’ll hit. Some of these things I’ll cover in later posts in this series. Here’s what I’d focus on:
- Build an app that has a master-detail view. I like picking something like Product Categories & Products. When you select a category it shows all relevant products. When you pick a product, the details are shown in another form. This will give you practice doing the following:
- Building a view, view model & model
- Implement data binding with the view model & with the view
- Implement data binding with collections from the view model & templating the resting UI controls
- Issue async calls for data, specifically with no filter & with a filter
- Respond to selected item events
- Add buttons to handle CREATE/UPDATE/DELETE functionality and use commands instead of event handlers & have the CREATE/UPDATE use a modal dialog. This will give you practice doing the following:
- Working with dialogs
- Working with commands and moving away from events
- Issue async calls to data source for CREATE/UPDATE/DELETE commands & refreshing the views
- Add unit/integration tests to view model & model. This will give you practice doing the following:
- Creating unit tests against the view
- Verify your application can work 100% without a UI
- Add unit testing to the view using recorded UI tests.
- Consider implementing services (more on this in a later post), such as a data service. This will give you practice doing the following:
- Creating live data service that acts as a proxy to your data source
- Creating a sample data service that lets you create sample data programmatically in a design tool such as Expression Blend or Visual Studio 2010
My RI is the Product Browser I referenced above that you can download from our company site. I’m always working to add more stuff to it to make it the ideal RI for me. It addresses everything in the list above that I suggest you build for your own RI… don’t just take mine, you’ll learn more as you do it yourself. This app can run 100% without the view & I can test the whole thing without a view… even dialogs! I’ll use it throughout this little series of posts.