Craig Shoemaker

Presentation: ASP.NET AJAX 4 at the Orange Country .NET User Group

craigshoemaker — Wed, 13 Jan 2010 03:00:00 GMT

Thanks to everyone who came to my ASP.NET AJAX 4 talk at the Orange Country .NET User Group. Special thanks to Reza Madani for organizing the talk and running such a great group!

Here is the code download for the talk: ASPNETClientTemplates.zip

Podcast: Portable Areas with Jeffrey Palermo and Eric Hexter

craigshoemaker — Thu, 07 Jan 2010 21:30:00 GMT

In this episode of the Polymorphic Podcast Eric Hexter (@ehexter) and Jeffrey Palermo (@jeffreypalermo) join Craig Shoemaker (@craigshoemaker) to discuss Portable Areas. The Portable Areas contribution to MVC Contrib are an option for building single component or multi-page components for ASP.NET websites.

Full Speed:	download
Fast Version:	download

What Are Portable Areas?

Encapsulates the UI functionality of a website and send messages to the application for data access, services, etc.
Can be a single component on the page or come in form of multi-page feature to a site
View logic and view markup are compiled into a single DLL for easy distribution
An option for component model for MVC
Feature of MVC Contrib

How Does a Portable Area Communicate with the Host Application?

Registers on startup
Sends messages in the form of a class to host application
Messages managed by a ‘message bus’ which is a synchronous communication between area and app

How Is Integration Into the Application Handled?

For single components, the view will access a HTML helper that in the end points to a controller and view result
For multi-page components, new routes grants access to the new view pages

How Do the Areas Handle Layout and External Files?

Layout is made consistent by leveraging MVC Framework’s use of default views that may be overridden in the application
Documentation or review of embedded views will give developers of consuming apps the information about hooks required in views
Images, CSS, and script files may be embedded into the DLL or added to the host application

What Are Some Examples?

The following are items Eric and Jeffrey mentioned as examples that are implemented as portable areas, or they would like to see as a portable area. This list will hopefully give you an idea of how and when to use this feature:

Grid
Login
Forums
‘StackOverflow’ add-in
Blog engine
RSS reader

Resources

Amazon Kindle When You Don’t Own a Kindle

craigshoemaker — Tue, 05 Jan 2010 20:29:00 GMT

You don’t need to shell out the $250+ for a Kindle – use your iPhone, netbook or PC!

For Christmas my lovely bride got me an iPod Touch. Now I am usually not a gadget guy, but this is one of the things I had really wanted since I got her an iTouch for last year’s Christmas. After doing the normal setup I started looking around the AppStore. One of the apps that stuck out to me was Kindle for iPhone.

Now when Amazon first introduced the Kindle, my first impression was that I probably wouldn’t like it. For some reason I figured that I would prefer to feel a real paper book in my hand. After installing and using Kindle for iPhone I can say that preference no longer exists.

I love being able to just pull out my iPod and continue reading a book right where I left off wherever I am at!

So I figured that if there was an iPhone version of Kindle, then there was probably a PC version as well. Minutes after installing Kindle for PC I had the same book synchronized to my netbook. This experience was great for reading while holding our newborn baby – no hands necessary. I was fortunate enough to received one of the PDC netbooks (thanks Microsoft and Infragistics for letting me keep it!) so I could use the touch screen features to simply reach up and turn to the next page.

Finally I stalled Kindle for PC on my work laptop so I could also have the same books available should I have some time and want to read on a large monitor form factor.

So if you want most of the benefits of a Kindle reader and don’t want to empty your pockets for the Kindle device you now have the next best thing!

ASP.NET Ajax Library Beta with Stephen Walther

craigshoemaker — Mon, 04 Jan 2010 17:04:00 GMT

Stephen Walther (@swalther) and Craig Shoemaker discuss the latest announcements surrounding the ASP.NET Ajax Library during PDC09.

Subscribe to the podcast!

A New Name a New Home

Now named ASP.NET AJAX Library (old name was proprietary)
First contribution to the CodePlex Foundation

What's New for the Beta?

OSS and inclusion in the CodePlex Foundation
Microsoft is providing product support even as the library remains OSS
Merging Ajax Control Toolkit (ACT) into the Ajax library

Unique Features

Client Script Loader - loads script dependencies in parallel
No installation necessary - use the CDN
Most ACT controls and functionality supported in client only scenario
ACT HTML editor not in beta, but look for it in RTM
Minifier functionality – includes command line tool and MS Build task
Preprocessor
Wiki for OSS documentation

Is jQuery Used Inside Ajax Controls?

No dependency on jQuery yet... leaving that up to developer needs

Silverlight 4 with Tim Heuer and Jesse Liberty

craigshoemaker — Mon, 14 Dec 2009 23:28:00 GMT

While the attendees of PDC09 likely expected to hear a plethora of announcements regarding Silverlight 3 all hopes were dashed when Scott Guthrie quickly glossed over advancements in Silverlight 3 to make time to talk about... the Silverlight 4 beta!

This episode of Pixel8 Tim Heuer (@timheuer) and Jesse Liberty (@jesseliberty) join Craig Shoemaker (@craigshoemaker) to discuss the new features that excite them as well as projects that have recently caught their attention.

Subscribe to the podcast!

Tim Heuer

New Features

If you aren’t familiar with what’s new, make sure to read Tim’s comprehensive post on new features in Silverlight 4 beta. A point that both Tim and Jesse make is that new features were largely a direct result of customer feedback.

Is WPF Dead?

The announcement of IO support, printing and other features often associated with desktop applications left some wondering the fate of WPF. If the chasm between WPF and Silverlight continues to shrink, how do you choose a platform?

Tim’s advises, if you are targeting Windows, start with WPF. Silverlight is about cross-platform and reach. Both platforms are attempting to be feature compatible. If you must select a “winner” to the debate, perhaps it’s best to say that the winner is XAML. An investment in XAML will keep your options open on the desktop and the web.

Advice on Real World Development

Tim offers some quick tips for real life Silverlight development:

Invest time in learning the view model pattern
- MVVM seems to be the winner in presentation patterns. Even if the approach is not for you be familiar with the concepts
Understand a composite model and learn to partition your application
- Look at Prism and realize it’s value for building modular and composite applications beyond it’s MVVM support
Consider your extensibility points
- Managed Extensibility Framework (MEF) for could be used for extensibility or perhaps even building composition into your application

Designer Developer Workflow

Tim discusses his plea to my developer brethren about designer/designers
Role of the Integrator (may not be a full time person, but perhaps a senior person on the team able to run interference between developers and designer)

Jesse Liberty

Jesse sees the line of business story a more natural fit in Silverlight 4. By leveraging some of the infrastructure of previous releases, new features offer a richer experience in for common scenarios. For instance:

Leveraging of the Visual State Machine – where validation logic is server-bound, but the client reflects the outcome of this code
Fluid UI – animations for different states of a list box

Jesse is heading up the open source Silverlight HyperVideo Player project. The HVP adds in-context links to video content within a video. Jesse is spending time thinking about over all architecture and finer details like accessibility. A particularly impressive feature Jesse is looking to add to the HVP is a generic marking system that will allow markers to change and be added to a video over time. Look for some innovative work for coming from the Silverlight HyperVideo Player.

Lazy Loading JavaScript Files Using ASP.NET AJAX Script Loader

craigshoemaker — Wed, 09 Dec 2009 22:12:00 GMT

The ASP.NET AJAX Script Loader control will make your life easier. Gone are the days where you have to include a multi-line block of script includes on every web page. Gone are the days of double checking to make sure your script files are included in the right order. Now with the appropriate use of the Script Loader’s require function gone are the days of having to load scripts on your page whether you need them or not.

Since the Script Loader control programmatically loads scripts into the browser you get imperative control of when and where scripts are loaded. Consider a page that will only load the dataView scripts on to the page when a user tries to access an area of the page where an ASP.NET AJAX client template is used to display the data. The following code demonstrates how to accomplish this task.

Note: Make sure to see it in action by checking out the live working copy!

Script

<script src="http://weblogs.asp.net/Scripts/MicrosoftAjax/start.js" type="text/javascript"></script>
<script type="text/javascript">

Sys.require(Sys.scripts.ComponentModel);

Sys.onReady(function()
{
    Sys.addHandler($get("bindButton"), "click", function()
    {
        $get("bindButton").disabled = true;
        Sys.require([Sys.components.dataView], function()
        {
            Sys.create.dataView("#dv", { data: colors });
        });
    });
});

var colors = [
   { Name: "Black" },
   { Name: "Blue" },
   { Name: "White" },
   { Name: "Green" }
];
</script>

Markup

<input type="button" value="Get Colors" id="bindButton" name="bindButton" />
<ul id="dv" class="sys-template">
    <li>{{Name}}</li>
</ul>

Special thanks to Julian Dominguez (@juliandominguez) for helping me work out a few kinks in the first iteration of this code :)

Presentation: ASP.NET AJAX 4 at Inland Empire .NET User Group

craigshoemaker — Wed, 09 Dec 2009 02:30:00 GMT

Thanks to everyone who came to my ASP.NET AJAX 4 talk at the Inland Empire .NET User Group. Special thanks to James Johnson (@latringo) for organizing such a great group!

Here is the code download for the talk: ASPNETClientTemplates.zip

ASP.NET Simplicity and Performance with Scott Hunter

craigshoemaker — Fri, 04 Dec 2009 16:28:00 GMT

On this episode of Pixel8 Scott Hunter (@coolsch) joins us to discuss his team’s focus on simplicity and performance in ASP.NET. Scott was kind enough to surprise me with some talking points about what his team is thinking about for releases coming after ASP.NET 4! Please note, what’s discussed herein are un-implemented features of ASP.NET so your feedback is not only welcome, but encouraged!

Subscribe to the podcast!

Velocity Provider for Caching: This will allow developers to plug in caching scenarios based on their needs.
Automatic Generation of CSS Sprites: Adding images to the Content folder will trigger the ASP.NET framework to stitch together a single image which is later sliced up by inline styles. A helper method is responsible for generating markup of the appropriate CSS coordinates to wire-up the sprite. This feature will allow for groups so related images may be combined together.
Complex Helpers: There are scores of common features and functionality that many developers want to include in their applications, but unfortunately right now these features require a lot of code to implement. In the future you may have helpers available that provide a simple API to do the following:
- Resize images
- Watermark images
- Flip images
- Send Email - helpers for single method calls to send and mail or verify an address [ex: Email.Send() or Email.VerifyAddress()]
- Schedule Tasks - submit tasks to a background worker process (wouldn’t take down app domain if exception occurred)
- Posting status updates to Facebook, Twitter, etc.
- Polls
- Ratings
- Comments
- OpenID integration
* Many of these features will likely be released outside the formal ASP.NET framework
Data Simplicity: Active record implementation that features a code-first approach. Consider a blank database with no tables. The active record pattern would allow you to instantiate the Foo class and then add values to Foo.Bar1 and Foo.Bar2, then call Foo.Save(). If the Foo table does not exist in the database, then the table is created and the data is persisted. Also Foo.All() would return all the records of Foo, but the return type is an IQueryable so you could further filter on the server. The code-first won’t be the only direction the integration will work. Changes in the database can be reflected in the model by use of T4 templates.

Note: I ask the requisite question about the virtues of the repository pattern as opposed to active record. Scott demonstrates how the implementation they are considering would not hinder you from exposing your own DTOs and wrapping a repository around the active record objects.

Also make sure you check out my post 12 Ways to Simplify ASP.NET and Visual Studio I wrote after being inspired by this interview!

12 Ways to Simplify ASP.NET and Visual Studio

craigshoemaker — Fri, 04 Dec 2009 14:42:00 GMT

While at PDC this year I had an opportunity to interview a number of smart and engaging people. One of my guests was Scott Hunter (@coolcsh) who these days is responsible for WebForms, ASP.NET Data and seemingly much more. To my surprise Scott wanted to talk about what is coming after ASP.NET 4!

Taking a step back and looking at ASP.NET, tooling, data and the entire experience of working with the .NET stack Scott’s team and other groups in Microsoft are turning their attention to a single concept…

Simplicity

While I will refer you to the Pixel8 podcast, ASP.NET Simplicity and Performance with Scott Hunter, to hear the details about ideas his team is entertaining to make ASP.NET easer and perform even faster, I thought I would throw in my two cents as well. The following is my wish list of twelve improvements to ASP.NET and Visual Studio that would undoubtedly make development faster and easier.

1: Overload the DataBind Method

How often have you worked with data bound control and wrote code like this:

protected void Page_Load(object sender, EventArgs e)
{
  this.grid.DataSource = foo;
  this.grid.DataBind();
}

Wouldn’t it be simpler if you could just call the DataBind method and pass in the data source?

You can do this easily today by implementing an extension method as I did here, but it would be nice to have this as a first-class feature of the BaseDataBoundControl class.

2: Implement IsFirstRequest Property

The whole notion of the IsPostBack property always seemed a bit awkward to me. More often than not you are using this property to evaluate it’s negative state – in other words trying to figure out if the page is running under the context of the first request. I suggest the addition of a property that is no more than the reverse of IsPostBack:

It’s a small thing, but I think it makes code a little cleaner to read.

3: Implement Application Name

Often developers need a way to display the application name to users. While setting up a globally-scoped class to handle this task is trivial, but it would be nice if there was a “Name” property off the page’s locally scoped Application property:

The value for this property would likely be saved in the web.config or Global.asax. Adding this feature may also help sort out a common problem that arises in using the membership provider when developers forget to define an application name. Visual Studio could auto fill this value with the “application name” from the create project wizard and then allow an override at any time.

4: Option to Categorize IntelliSense Members

Ever wanted to tap into an event of an object, but weren’t sure what the event name was? Ever wanted to know just what an object methods were while trying to learn a new API? What about trying to find out if there is a property for X? IntelliSense is an invaluable tool in it’s current form and Visual Studio 2010 adds some needed filtering behaviors for C#, but we can do even better.

It would be nice if IntelliSense had a way to display members in a categorical format:

Obviously this isn’t a feature you would want enabled at all times, but it would make working with new APIs much easier.

5: Bring XAML Data Binding Syntax to ASP.NET

David Fowler (@davidfowl) has been churning out some amazing blog posts all around the topic of data binding in ASP.NET. One of his recent posts included an exposition of DataBinding 3.0. Basically the latest iteration of data binding brings the XAML syntax to ASP.NET data binding.

This addition makes life easier because then you don’t have to worry about when you use the Bind or Eval syntax. Plus making a homogenous binding syntax among WPF, Silverlight, ASP.NET AJAX and ASP.NET WebForms makes working with the controls a natural task regardless of the platform you are working.

6: Parameter Attributes

When working with QueryString parameters requires some repetitious boilerplate code. Consider the following listing, which you have probably written thousands of times:

private string UserName
{
  get
  {
    if(Request.QueryString["userName"] != null)
    {
      return Request.QueryString["userName"].ToString();
    }
    return string.Empty;
  }
}

How much simpler would it be if you could just decorate the property with an attribute and the retrieval code is implemented automatically?

This approach doesn’t have to stop with the query string either. The same types of attributes may be available for :

QueryString
Form Elements
Context Items
Session
Cache
Cookies

7: WebForms Model Binders

One of the features that I immediately fell in love with from the ASP.NET MVC framework was model binders. With the updates to ASP.NET 4 granting total control over the client IDs of server controls, now WebForms needs model binders!

The pages could be strongly typed like MVC strongly typed views, or the designer could interrogate the control hierarchy and build the view model on the fly. Obviously we’d also need some hooks to tap into the flow to implement custom bindings too.

8: JavaScript Model Binders

Just as the server can benefit from automatic mapping of input controls to a model object, Ajax scenarios could be greatly simplified if there was a function to run on the client that automatically created a JSON object with all input values.

Consider a form like this:

With markup like this:

A model, or DTO if you like, could easily be constructed by querying the form and building the object from input elements.

There could even be special rules for certain controls like a select list. Sending the selected index, text and value as a group for the single control should provide all the information necessary to consuming resource.

9: Select the Location of ViewState

While ASP.NET 4 makes great strides to trim down a page’s ViewState it would still be nice to have explicit control over where the ViewState is rendered on the page. I’d love to see a server control that allows you to place the ViewState containers at a location of your choosing:

Now more times than not the best approach is to simply move ViewState to the bottom of the page, but having explicit control of the placement seems like the best scenario.

10: Disabling the Post Back Button

The ASP.NET runtime will not recognize a post back initiated by a disabled button so developers have had to concoct some clever ways to protect users from themselves. It would be nice if ASP.NET had a way to reliably disable post back buttons out-of-the-box.

11: Implement ASP.NET Configuration Console as Portable Area

Eric Hexter (@ehexter) recently blogged about the concept of a “portable area” where you can compile single controls controls or even up to entire workflows into an assembly to later include in an ASP.NET MVC or WinForms application. This approach is perfect for implementing the ASP.NET configuration UI generated by Visual Studio.

The portable area approach would decouple the screens from the layout seen in this screenshot and allow the pages to reflect the layout of your website. This feature would be perfect for exposing the membership functionality to admins, power users or even just the development team.

12: Script-Based Post Backs

On occasion when working with WebForms under the traditional post back model you may need to implement a JavaScript function that initiates a post back. Right now, the approach for executing this a hack at best. One the best ways I have seen to accomplish this is to add a LinkButton to the page and hide it from the user using CSS. Then you can view source on the page and use the __doPostBack call the LinkButton was using in your custom script – like I said real hacky :)

It would make life much simpler for the times when this functionality is required to have a method off the Sys namespace (or wherever appropriate) that posts back a WebForm. This is how it could look:

Passing a string into the function would tell the page which handler to map to in the page event lifecycle.

So there you have it. These are some of my ideas about how to make ASP.NET and Visual Studio simpler to use. Now tell me, what are yours?

nBuilder, Ugly Outfitters and VM Workshop

craigshoemaker — Tue, 01 Dec 2009 20:26:00 GMT

In this episode of the Polymorphic Podcast I interview Gareth Down of nBuilder. Writing demo applications, prototypes and tests just got a whole lot easier using the fluent interface of nBuilder to quickly generate test objects in .NET.

Full Speed:	download
Fast Version:	download

Fast Feed Gets New Life

I would like to extend a huge thanks to Cory Fowler (@SyntaxC4) for his contribution to the Polymorphic Podcast Fast Feed. The Fast Feed is an RSS feed to versions of podcast episodes that are sped up and pitch corrected (no chipmunking here) so you can listen in a fraction of the time. Cory asked me on Twitter if I planned to convert the show’s archives. In a gesture of kindness to us all Cory volunteered to convert the entire back archives of the show into the “fast” format. Now that I have all the files, I’ll release two vintage shows a week until we catch up to present episodes – it’ll be a blast from the past!

In all his spare time, Cory is also behind jTweetr – a jQuery interface for Twitter. Make sure to check out Cory’s blog and his posts on jTweetr!

Resources

I highlight a number of resources in the show. Here are the relevant links:

Ugly Outfitters: ASP.NET AJAX, jQuery and Infragistics Drag and Drop Framework Mashup
VM Workshop: Reference application for working with MVVM and Presentation Model
Introducing 'Shazzam' with Walt Ritscher
Data Visualization in the Wild: Chart Analysis with Dr. Tobias Komischke
User Engaged Prototyping with Billy Hollis
Windows 7’s solution to beta software : XP Mode

Win Asus Netbook or NetAdvantage for .NET While You’re NotAtPDC!

craigshoemaker — Mon, 16 Nov 2009 22:28:00 GMT

Even if you can't make it to PDC for the convention you deserve a a chance to win some cool prizes!

Learn how you could win an Asus netbook or a license to NetAdvantage for .NET by following @infragistics and tweeting about a #NotAtPDC session!

Integrating Infragistics Drag & Drop with jQuery and Microsoft Ajax Preview 6

craigshoemaker — Tue, 10 Nov 2009 21:15:00 GMT

The Concept

I created “Ugly Outfitters” to showcase the interaction between Infragistics Drag & Drop, jQuery and Microsoft Ajax Preview 6.

Why Ugly Outfitters? Well, I decided that rather than just dragging around some bland icons on the screen why not attempt to inject a little bit of humor into the process. Like I said... attempt ;)

If you want to jump right in take a look at this short video demonstrating the application with a quick overview of the code:

Note: Also available are higher quality versions of the video.

What follows is an excerpt of the discussion of what’s found in Ugly Outfitters. The best way to get acquainted with the details is always to download the code and review it’s design.

The Approach

The page is constructed to have a list of shirts on the top of the page, a list of pants along the bottom and a large “outfit designer” area to preview combinations. Along with the coupling of the garment images, when an image is dropped on the page the garment title and description are updated.

A typical approach of constructing a page like this is often to include a server-side repeater to generate the HTML required to list the shirt and pant images. Instead of explicitly rendering HTML for each list item, this page uses a series of client templates to create the thumb nail lists. The data for the page is served to the client in JSON arrays, rather than being embedded into blocks of HTML. Using the JSON arrays make coding interaction on the page easy as all the required data is available in a programmatically accessible format.

Variations

The sample is available in three different variations. The first sample uses the ASP.NET ScriptManager control to bring in the required scripts and leverages the code behind to render the JSON array to the page.

The second sample is exactly the same as the first except instead of using a ScriptManager, the JavaScript files are loaded into the page using the Microsoft Ajax Preview 6 Script Loader control. The Script Loader is used to bring in ASP.NET AJAX, the Client Templates, jQuery and the Infragistics Drag and Drop Framework.

The final variation extends the second sample, but removes the dependence on the code behind and is a static HTML file. Data is injected into the page by referencing a dynamic JavaScript file. This script file is added as a custom script and then loaded into the page using the Script Loader.

To read the full write-up including code samples, please check out: Integrating Infragistics Drag & Drop with jQuery and Microsoft Ajax Preview 6 on my Infragistics blog.

Serialize and Deserialize JSON

craigshoemaker — Fri, 06 Nov 2009 16:28:00 GMT

On one of the projects I am working on I needed a way to work get the JSON string generated from some sort of serialization process. If you are working Ajax or MVC controller actions, this work is done for you automatically, but I wanted the string all by itself. After some searching I ran across this article How to: Serialize and Deserialize JSON Data. The article is great, and gave me everything I needed to know, but I thought I would make it a little cleaner and wrap it all up in a class.

Below is the a generic class that will serialize and deserialize JSON:

using System.IO;
using System.Runtime.Serialization.Json;

public class JsonSerializer
{
    public JsonSerializer() { }

    public string Serialize(T instance)
    {
        using (MemoryStream stream = new MemoryStream())
        {
            DataContractJsonSerializer ser = new DataContractJsonSerializer(typeof(T));
            ser.WriteObject(stream, instance);
            stream.Position = 0;

            using (StreamReader rdr = new StreamReader(stream))
            {
                return rdr.ReadToEnd();
            }
        }
    }

    public T Deserialize(string json)
    {
        using (MemoryStream stream = new MemoryStream(System.Text.ASCIIEncoding.ASCII.GetBytes(json)))
        {
            DataContractJsonSerializer serializer = new DataContractJsonSerializer(typeof(T));
            T result = (T)serializer.ReadObject(stream);
            return result;    
        }
    }
}

Update: For a more robust solution, Javier Lozano suggests checking out Json.NET

VM Workshop: Model View ViewModel (MVVM) and the Presentation Model Pattern in 5 UI Platforms

craigshoemaker — Tue, 03 Nov 2009 16:51:00 GMT

For some reason the family of design patterns that exist around the Model View Controller pattern seem to be an elusive band of characters. The first time I encountered Model View Controller I studied the text hard trying to understand how the Strategy, Observer and Composite patterns worked together to accomplish some goal that – try as I might - remained fuzzy. Somehow I have a sense that I am not alone.

Model View Controller (MVC) is the parent pattern to a number of contemporary patterns that seem to find a natural home in Microsoft development. Variations of MVC have appeared over the years in an attempt to work within the construct of modern event-driven programming models. One of most distinguishing differences among MVC and some of the derivative patterns is that with MVC the controller executes first, where with the other patterns the view tends to execute first and then delegates control to some sort of “presentation” class.

A few years ago I did a series on Model View Presenter (MVP) [Design Patterns Bootcamp: Model View * Patterns] in an attempt to discuss how to completely abstract away the user interface layer. MVP proves to be an effective pattern, but can be confusing to some with the heavy use of interfaces and events.

The recent popularity of XAML applications has brought focus to the Model View ViewModel (MVVM) pattern, which is technically a fine-tuned version of Presentation Model that takes advantage of .NET’s data binding framework. Further, the advent of ASP.NET MVC has created a strong push for some sort of presentation strategy into the realm of ASP.NET WebForms.

So this history lesson is great, but how do you do you write the code to implement the patterns?

Introducing VM Workshop

The VM Workshop is a simple reference application demonstrating the Model View ViewModel and Presentation Model pattern in a number of different UI platforms.

The project includes examples in:

Silverlight
WPF
WebForms
ASP.NET MVC
Ajax
WinForms

…and as an open source project, you are invited to help add examples of how to deal with a myriad of different UI use cases!

The purpose of the VM Workshop is to be a working programmer’s reference, not an exposition in pattern purity. Therefore you may see small details that may not fit the textbook definition of the patterns, but the point is to provide a template for effective pattern use. For instance there is an example in ASP.NET MVC is included in VM Workshop. Obviously the pattern being implemented is Model View Controller, but the construction of a “view model” class is still relevant in this context. While referring to ViewModel class in a ASP.NET application may be technically inappropriate, I use the term “view model” to interchangeably refer to a ViewModel or Presentation Model class for simplicity.

I recently messaged John Gossman, arguably one of the most visible proponent of MVVM, to ask whether or not MVVM is exclusive to XMAL applications or if the pattern may be applied to any UI platform. John replied saying:

I think the pattern is completely applicable to any UI technology. There are some details around the use of commands and data-binding that tend to be XAML specific, so I tend to use MVVM for the XAML version of the pattern and to keep from having religious wars with Patterns zealots. The more general pattern is called PresentationModel by Fowler. OTOH, one of the nice things is if you design your Model and ViewModel’s correctly you should be able to reuse them between XAML-based and other UI technologies.

VM Workshop is meant to be a learn-by-example project showcasing different styles of implementation.

Examples in C# and VB.NET

Often discussions surrounding design patterns tend to only be available in C#. In order to extend the conversation to as many developers as possible, I’ve include a VB.NET solution that operates in complete parity to the C# version. The only difference in the VB.NET version is that due to lack of lambda support some of the places AutoMapper is leveraged in the C# version are removed and objects are mapped manually.

A Grid, a Form and an Action

The initial example is provided for all the UI platforms. Each implementation features the same UI and workflow composition. First a grid is presented to the user:

Upon selecting an individual item, an edit form becomes available allowing the user make changes to the item:

Note: These screen shots here are taken from the WebForms sample, but the UI reflects the appropriate look for each of the respective UI technologies.

Once changes are complete, and the ‘Save' button is pressed, the persistence operation is initiated. After persistence is complete, each implementation tells the UI to how to response respond to the action.

Please note that true persistence is not implemented in VM Workshop. In an effort to avoid using a database (which keeps the code more portable) persistence functions are simply stubbed out in the code. In the end, the project includes the same messages that would be sent among the application layers in any real-world application.

Minimizing Code in the View

The motivation for using these patterns is often creating a more testable user interface layer, decoupling your application from UI technologies or perhaps to promote better application composition. No matter what the motivation, the overarching goal is to remove application logic from the view layer. The examples in VM Workshop use a number of general concepts to achieve a thin view.

Lazy Loading

The grids are populated through a lazy loaded property on the view model class. This ensures that the request for data is restricted to only the times when the data wasn’t previously prepared. Another benefit is that a call to somehow ‘get stuff’ is not required. When the grid binds to the 'Products' property the property’s implementation knows where to get the data if it doesn’t have it.

Visibility Properties

Visibility properties (in XAML implementations) or boolean properties on the view model classes are used to control whether or not controls, messages or other UI elements appear to the user. Binding the state of these properties to the appropriate elements on the screen relieves the view of having to decide what is shown to the user and what is hidden.

No Logical Operations

While taking great care to remove all logical operations from the view, even seemingly benign tasks such as casting input into primitive types is delegated to the view model or some other class for execution. Even simple operations like type casting can quickly cascade into a series of business rules. Consider how convoluted validation scenarios can become when the application is expecting a currency value, but is one way or another served a string. While the validation does have UI implications, this type of logic is best handled in a lower level than the view.

Presentation Objects and Data Transfer Objects

The use of presentation objects or data transfer objects, or DTOs, (I tend to flip between terms depending on my mood) is used to accomplish at least two goals:

Hide the domain model from the rest of the application. Concealing the full-fledged Products class from the view makes sure unnecessary pressure is not exerted on the model to mutate at the whim of the view.
Make custom mapping the responsibility of the type. The presentation object’s job is to prepare the data coming from the domain model into a form that is natural to the view. This mapping or conversion responsibility is best placed in the hands of the presentation object and not within the procedure of an operation.

Get Acquainted

Check out the video that will get you oriented with VM Workshop:

Get Involved

The code for VM Workshop is available on CodePlex and you are encouraged to submit your implementations into the workshop!

Resources

VM Workshop uses nBuilder create data objects and AutoMapper for DTO to domain object mapping.

Thanks

Thanks to Infragistics for providing the time to develop the VM Workshop.

ASP.NET AJAX Preview 6 with Stephen Walther

craigshoemaker — Mon, 02 Nov 2009 23:12:00 GMT

Stephen Walther, Microsoft Product Manager for ASP.NET AJAX, joins the show to discuss the recent advancements in the AJAX toolset found in Preview 6. Listen or download below!

Full Speed:	download
Fast Version:	download

Just about all the details discussed in our conversation are available from the following links:

A Changed Landscape: ASP.NET AJAX

If you are in the Southern California area and would like to see some of the latest AJAX bits in action I am giving my talk to the following user groups: