Wednesday, 4 December 2013

ASP.NET MVC Tutorial for beginners

Introduction

In this article we will try to look at ASP.NET MVC architecture from a beginner's perspective. There are a plethora of articles available on the same topic. This article is yet another attempt of explain MVC in my own words.

Background 

ASP.NET MVC is the architectural pattern based on ASP.NET framework which provides a clean and elegant way of developing Web application. Before we can understand why MVC is in vogue we need to understand some limitation of Web forms first.

A Brief Discussion on Web Forms

let us discuss some limitation of web forms which are seen as drawbacks. I am sure many veteran developers will agree that these drawbacks can be put in check by following best practices and guidelines but none the less its a good idea to discuss them before looking at the ASP.NET MVC architecture.
  • ViewState: This is the heart of ASP.NET when it comes to the ability of ASP.NET to provide stateful abstraction over stateless HTTP protocol. But with great power comes great responsibility  If the ViewState is not managed properly then this would increase the size of the rendered web page a lot and this causing extra load.
  • Generated HTML: Server side controls are another strong selling points of web forms. They facilitate rapid application development without worrying too much about the client side HTML code. But since the use of client side technologies are increasing (javascript, jQuery etc.), the less control over generated markup is becoming bit of a problem.
  • Urls: In ASP.NET web forms the request URL points to physical files and the structure of the URL is not SEO friendly. Also, now is the time when URL structure is very important and clean URLs and control over URLs is very much desired.
  • Code Behind: Code behind model, in my opinion, is the best part of ASP.NET. It provides clear separation of concern. From a developers perspective having the code behind file provides a great way to write the server side logic without having to write code between the HTML markup.
  • Page Life Cycle: Although code behind model provides a great way for providing separation of concern, the page life cycle is little complex and should be fully understood. If a developer fails to understand the page lide cycle then there might be some unforeseen and undesired issues in the final application.
  • Test Driven Development support: Now is the time of being agile. When we follow agile methodology (scrum specifically), it id very important to define the "Done" in scrum. TDD helps in this. If all our test cases are passed then we can be sure that the "Done" is done. ASP.NET does not provide native support for TDD because it is kind of difficult to imitate the HTTP request and HTTP context.
Having said that(all the above points), I would also like to point that question of limitations of web forms is becoming blurred with every new release of ASP.NET web forms. A lot of these limitations are being curbed in Web forms. ASP.NET 4.0 added URL Routing, reduced ViewState, and a much better control of the HTML mark-up. A lot of other issues related to leaky abstractions in web forms can be solved by following best practices and design guidelines. And the TDD can be performed with the help of some tool.
So it is not a question of which is better. ASP.NET Web Forms and MVC are two different architectural styles. Forms focusing on rapid application development (and now getting a lot better with every new release). and MVC is for designing Web applications without the baggage that comes with forms and following good patterns.
A lot of deevlopers think that MVC is the new way of developing web application and Web forms is dead but strictly in my personal opinion, they both are two different architectural styles and no one supersedes other. We should choose the one based on our requirements and resources available. In fact the possibility of being able to mix both the styles is the best thing. We can use both these styles in a single application and get the best of both worlds.

A look at MVC 

MVC framework embraces the fact that the HTTP is stateless and thus no stateful abstraction will be provided by the framework. It is up to the developers to take care of managing the state in a MVC application.
In MVC architecture there are three major player. ModelView and Controller. we need to work on these creating these components to get our web application to work. Now before looking at these three in detail let us try to think how we can put server side contents in a HTML page. We will take a rather reverse approach to understand this. 
We need to put some server side data into an HTML markup before rendering it. Now this can easily be done in Web forms too where we used to put C# code in aspx markup. The only prerequisite for that is that we should have some object containing the value on the server side from which we can extract the data. That is what views does in MVC. they simply run and before rendering the markup they use some server side object to extract the data and create the complete HTML markup and render on client browser.
Now lets take a step back again, Now we need an object on server side. In MVC world this is model. We need an instantiated model and pass it to the view so that views can extract the data from this object and create the final HTML markup.
Now the question would be, who would instantiate these Models. These models will be instantiated in the controllers. Controller will instantiate the models and then pass the model to the view so that the view can use them to generate the markup.
But now the bigger question, How would the controller be invoked  The controller will be invoked on the user request. All the user requests will be intercepted by some module and then the request URL will be parsed and based on the URL structure an appropriate controller will be invoked.
So now that we know the basic flow let us try to define the Model, View and Controller formally.
  • Model: These are the classes that contain data. They can practically be any class that can be instantiated and can provide some data. These can be entity framework generated entities, collection, generics or even generic collections too.
  • Controllers: These are the classes that will be invoked on user requests. The main tasks of these are to generate the model class object, pass them to some view and tell the view to generate markup and render it on user browser.
  • Views: These are simple pages containing HTML and C# code that will use the server side object i.e. the model to extract the data, tailor the HTML markup and then render it to the client browser.

No comments:

Post a Comment