ERNI Technology Post No. 41 - ASP.Net and the Orchard project, what else?

Nowadays, the number of technologies for building web applications and web sites has drastically exploded. Although discovering and comparing all of them would be quite exciting, I have to limit my ramblings here not to write a book! Thus, I invite you to discover a technology named MVC ASP.net.

Microsoft has released this technology for the first time in 2009. Since then, it has been continuously developed and improved. Besides its relative novelty (or being a nice tool to play with for technology addicts), it is an interesting and relatively clean implementation of a well-known and widely adopted design pattern created more than 30 years ago (1978-79) [1]. What I find absolutely fascinating is the fact that a top technology is based on this design pattern.

Then, I invite you to go from theory to practice! Thus, I invite you for a short case study. The goal is to demonstrate you how it works, what is hidden behind these patterns. To do this, I will show you how you can develop a web application including a functional CMS (content management system), user management and a hello world module within 1 hour. This seems crazy to you? Maybe it is because I forgot to tell you that I will use a CMS / application framework named Orchard [19]. It is an open source product with a continuously growing reputation and, the most important, a plugin gallery.

In the following, after introducing the concepts and the inherited models, I will describe the way Microsoft has implemented it. I will explore the specificities of this technology compared with classical ASP.NET webforms. Finally, I will conclude by a short case study to demonstrate an easy and quick implementation of it.

Before to continue, please don’t be afraid! If you are not a technologist, this article will provide you with good overview of the subject. If you are a software engineer, I hope it will be a good refresh or an exiting starting point for further exploration. But, for sure, I will not let you get lost in this wild wide world!

MVC MVP do you need a clarification?

The model-view-controller pattern (MVC) has been initially developed at the end of the seventies by Trygve Reenskaug at Xerox Palo Alto Research Laboratory in 1978/79. Basically, the initial goal of this pattern is a general method allowing the user to control large and complex data[1]. To do so, the business logic and business rules of the application are encapsulated in a logical bloc called “Model”. The “Views” are linked to the Model and interrogate it to display appropriately the complex business objects. The view is also the place where the actions of the user are collected. The action handling is done in a component called “Controller”. The mouse interactions or the user’s input are interpreted here and the model and the view are adequately informed of the changes. The major advantage of this pattern is the clear separation done between the data, their presentation and the handling of the user’s interaction.

The model-view-presenter (MVP) pattern is an evolution of the model-view-controller presented in 1996 by Mike Potel[9]. The goal is to have a suitable design pattern for the modern graphical user interfaces components which self handles the users’ inputs. The basic idea behind MVP is the same than the one behind MVC. The model is an interface with the data (business objects). These data are presented by views. The big difference is the way the view and the model communicate together: the presenter is placed between the model and the views. It retrieves data from the model and prepares them adequately for the view. It handles the users command forwarded by the view. As a summary, we can say that the major difference between these two models is the way the users’ interactions are handled. Hereafter, Figure 2 shows the MVP model.

The question at this point is why discussing these two, well-known design patterns today? In fact, not because they are knew as they both have been proposed during the last century. The answer here is in the technology we use every day either as developer or as user. Many current UI framework (i.e., cocoa (Mac OS X[10]). Java Frameworks (Struts[11], Swing[12]) are based on the MVC pattern. MVC and MVP are also supporting well-established web technologies as Asp.net webforms and the relatively recent Asp.net MVC.

More precisely, Asp.net Webforms, by the mean of the viewstate (the viewstate is a kind of object that maintains the state of the view under post back) is operating as a rich client in an environment being stateless by essence (the web). This technology is build following the model-view-presenter. On the contrary, Asp.net MVC is based on the on the MVC pattern. Here, the goal is not to emulate rich client development. Thus, the original design pattern fit well.

In the following section, I invite to study a bit more in details the ASP.net MVC architecture.

Microsoft’s implementation of the MVC framework

Actually, the affirmation saying that ASP.NET MVC is based on a pure model-view-controller design pattern is not exact. ASP.NET MVC, as the java server pages [11], is based on Model 2 [12]. Model 2 is an evolution of the MVC however being really close to it. Model 2 was first introduced in an article by Govind Seshadri[15] at the javaworld conference. Model 2 is composed, as shown in Figure 3, of the view, the controller and the model, which is connected to the data sources.

In ASP.net MVC, the operations related the application data (storage and retrieval) as well as the application data logic are contained in the model (business logic). The model data are used by the views to build the user interfaces (UI logic). The data are then presented to the user by the view. The controller receives the users command and does the appropriate job relatively to the received command (input logic). The controller also selects the appropriate view to present the result of the work done.

One of the major specificities of this technology is the clear division between the different aspects of the application. This separation is an application of the “divide and conquer” paradigm. The place where each aspect of the application must be is clearly defined. This helps to manage the complexity in large applications.

So, Asp.net MVC is now defined. The next section aims to discuss when to use this technology.

Asp.net MVC a good idea? When to make the jump?

The first question is then when? In fact, it is not reasonable to migrate a whole and well working application or framework. The extension or redesign of a working solution is neither an appropriate time for such a migration or choice. Working solution should be kept in their technologic line when possible to keep the people’s expertise, application stability and avoiding inopportune costs. Thus one of the good moments is the arrival of new projects with new needs. The time is well to change something and to try or improve working methodologies.

Farther away from time and management considerations, considering ASP.Net Webform and ASP.net MVC, let’s examine what can be the decision process. These two frameworks have both particularities and one will not replace the other. As a consequence, the decision should be made on the actual needs related to the application development process. In the lists here after, different arguments are introduced to support the decision process [18].

APS.NET Webform:

  • Rich client operations supported by the viewstate. The state is conserved between HTTP. Its management is then made easier.
  • Server controls supports many types of events.
  • Better suited for small development team (i.e., one developer working on one page). A large number of components are also available. Thus the development speed for such teams is improved.
  • The different components are well integrated together. Hence less code is required and the application development is less complex.

ASP.NET MVC:

  • The separation of the application into a model, a view and a controller simplifies the application complexity management. (In particular for large applications)
  • Rich routing and SEO friendly URL support by a powerful URL-Mapping component.
  • Particularly suitable for test-driven development (TDD). Fast and flexible unit testing of all the components.
  • Particularly suitable for applications developed by large teams.
  • The developers have full control on the behavior of the application (no viewstate, no server based forms).

To conclude this section, keep in mind that both are ASP.Net technologies. Both will leave in the future. Both frameworks are ASP.net. Thus, many libraries can be used independently of the chosen technology.

In the next section, I’ll show you how to have a running applicative framework in ASP.NET MVC within a short time!

Case study: quick start

For the case study, I invite you to discover a content management system (CMS) / application framework named Orchard [19][20]. The project is not officially supported by Microsoft but is supported by the Outercurve Foundation. However, Microsoft employees are often among the project leaders. What make Orchard interesting at my point of view, outside being an APS.NET MVC framework is, on one hand that it is an open source Framework under BSD license and on the other hand, however it is relatively new, many modules and themes are already available.

In the following, I’ll guide you in the process to have a first application running under Orchard. This being the basis for further development and tests. I will not give all the details here, but the place where you can find them.

Orchard can be installed directly from Webmatrix[21], but to develop the “Hello world” Module, I recommend you to download the source. At this point you can open the solution in Visual studio 2010 (your system must be configured for asp.net MVC and up to date) and we are ready to go.

The first step is to run the solution. Here we get the Orchard configuration window shown in Figure 4.

I chose the default recipe to have a fully functional CMS. Here you can choose the database you want, in my case, I connected Orchard to my SQL server. So that’s it, lets finish setup and see what we get. After changing the theme and playing a bit with the content, I got the system shown in Figure 5. I have to say that I’m impressed how easy it was to get a running system!

Now, I want to create my own module to display Hello „name“ if given, otherwise, some message to invite the user to give its name in a field.

To do this, simply follow the steps presented in the “Hello World” tutorial in Orchard (http://docs.orchardproject.net/Documentation/Building-a-hello-world-module). At the end, I got a running module saying “Hello World”.

It is nice and works fine. To be honest, it worked to fine… So let’s see if it is still the case if I want to go a little bit farther.

So we are going to change a bit this, so we can ask the name of the user and display it. To do this, I change the view file to include a form requesting the name:

I have also to change the Controller to handle the new event and to display the result of the action. So my new controller looks like this:

Then, I have to set up the route to tell Orchard how to handle the new return URL and the form action. The Route file looks like this:

Finally, by running my HelloErni module, I get the application shown in Figure 9.

I have to say that I’m surprised. It is easy and quick to start the project and it works fine. I did not encounter big problems. I easily found all the solutions I needed. Everything worked fine! (Too fine, no bug / trick to search for hours…)

Conclusion

Happy to see that you are still with me! We have seen three different deign patterns supporting some of the today’s most used technology, we have seen where do these patterns come from and how they are implemented. We also discuss the opportunity to switch from one technology to the other before going through a small test case using the Orchard CMS.

I hope that the overview of ASP.NET webforms and ASP.NET MVC may help you to better understand their fundamental differences and will be a helpful support for future technologic decisions. Away from habits and emotional considerations, there are clearly arguments for each technology that can be highly helpful in a decision process. But at now, after writing this technical letter, I recognize that both technologies are great.

Finally, it was very interesting to explore the Orchard project as case study to discover this technology. It was surprisingly easy to get it working. Following the Hello world tutorial and getting something working in such a short time was an incredible feeling. This applicative framework simply avoids the frustration of coding hours (at the beginning) for a tiny result. I played a bit farther and have to say that I have a really good feeling. Orchard looks like stable, well tested and well designed.

I warmly encourage you to try APS.NET MVC and ORCHARD! It just works!

References

[1] Model View Controller The original MVC reports Trygve Reenskaug Dept. of Informatics University of Oslo (http://heim.ifi.uio.no/~trygver/2007/MVC_Originals.pdf)

[2] Model view Controller on Wikipedia (http://en.wikipedia.org/wiki/Model–view–controller)

[3] Model view Presenter on Wikipedia (http://en.wikipedia.org/wiki/Model–view–presenter)

[4] Simple Example of MVC (Model View Controller Design Pattern (http://www.codeproject.com/Articles/25057/Simple-Example-of-MVC-Model-View-Controller-Design)

[5] Model-View-Controller (http://msdn.microsoft.com/en-us/library/ff649643.aspx)

[6] Ever green but still tropical: MVC vs. MVP (http://dotnetslackers.com/articles/designpatterns/Evergreen-but-still-topical-MVC-vs-MVP.aspx)

[7] MVC vs. MVP (http://archive.darronschall.com/weblog/2004/06/mvc-vs-mvp.html)

[8] Everything You Wanted To Know About the MVC and the MVP But Where Afraid To Ask (http://haacked.com/archive/2008/06/16/everything-you-wanted-to-know-about-mvc-and-mvp-but.aspx)

[9] MVP: Model-View-Presenter The Taligent Programming Model for C++ and Java (http://www.wildcrest.com/Potel/Portfolio/mvp.pdf)

[10] Cocoa (apple) (http://fr.wikipedia.org/wiki/Cocoa_(Apple))

[11] Apache Struts (http://fr.wikipedia.org/wiki/Apache_Struts)

[12] Swing (java) (http://fr.wikipedia.org/wiki/Swing_(Java))

[13] Model 2 (http://en.wikipedia.org/wiki/Model_2)

[14] ASP.NET Presentation Patterns (http://msdn.microsoft.com/en-us/magazine/dd252940.aspx)

[15] Understanding JavaServer Pages Model 2 architecture (http://www.javaworld.com/javaworld/jw-12-1999/jw-12-ssj-jspmvc.html)

[16] ASP.NET MVC VS. MVP (http://www.alligatortek.com/Blog/post/2010/03/ASPNet-MVC-vs-MVP.aspx)

[17] Model View Presenter (MVP) VS Model View Controller (MVC) (http://blog.vuscode.com/malovicn/archive/2007/12/18/model-view-presenter-mvp-vs-model-view-controller-mvc.aspx)

[18] ASP.NET MVC Overview (http://www.asp.net/mvc/tutorials/older-versions/overview/asp-net-mvc-overview)

[19] The Orchard project (http://orchardproject.net)

[20] Orchard CMS: Up and Running – John Zablocki – O’REILLY

[21] Webmatrix (http://www.microsoft.com/web/webmatrix/)

posted on 14.12.2012
Categories: 
by: Raphael Kummer