Posted by: Cirilo Meggiolaro | 04/11/2009

Tip of the day #179 – ASP.NET MVC overview

Microsoft has released the official ASP.NET MVC package this month. Those used to work with ASP.NET applications will notice a lot of new and cool features that may improve your web applications.

The MVC Design Pattern

The MVC (Model View Controller) pattern is not new. Its first version came out almost 30 years ago and is available currently in several frameworks.

User interface, business rules and flow orchestration in most part are so tied that become hard to reuse code and the level of dependency is high. That is the problem MVC expects to solve: the separation of concerns and how to decouple the user interface and the business layer. The three pieces that compound the pattern are:

Model: The Model is the core piece of the MVC and is responsible for data access, business validations and to expose the objects that will be consumed by the views. The model does not know anything about the View though.

View: The View is responsible for either displaying or accessing the information exposed by the model to build the user interface;

Controller: The Controller is responsible for handling user interactions and notifying the model that an action is requested.

ASP.NET MVC

Some characteristics of the new ASP.NET MVC:

  • Due to its separation of concerns it makes it easier to implement and manage complex business logic;
  • The view state is not available anymore avoiding some “needless abuses” of storage and making the application lightweight;
  • Server controls are not available anymore. At first sight it seems harder to work with but the MVC framework provides a good support to gather the form values;
  • It gives developers and web designers enough control over both layouts and features;
  • Apply unit tests on the controller component is pretty straightforward;
  • The basic project template provides support for security (login and registration);
  • The ability to scaffold properties from a model and generate create, update, details and list Views.

Requirements

To start with ASP.NET MVC you will need:

ASP.NET MVC project structure

Let’s create a MVC project to check the application structure:

  • Open Visual Studio 2008;
  • Create a new ASP.NET MVC Web Application;
  • The “Create Unit Test Project” dialog is displayed to give you the option to create a unit test project that will store your test classes. Choose the option that fits better to your needs and click OK;

Picture 1 - Create Unit Test Project Window

Picture 1 - Create Unit Test Project Window

  • The default project template is a starter kit that has a home, about, login and registration pages. The folder structure dictates where each kind of component (model, view or controller) and support files (js and css files) will be stored. The structure of the project is displayed below:

Picture 2 - MVC application structure on the solution explorer window

Picture 2 - MVC application structure on the solution explorer window

  • There are some folders that must follow a specific pattern but I will explain during this week when I explain each component;
  • Build and run the application. The starter kit application is loaded;

Picture 3 - Starter kit home view

Picture 3 - Starter kit home view

  • If you click on either the about or logon links you will notice that the URL on the address bar is not in the same pattern you are used to see. There is no file extension but a pattern similar to the following:

http://localhost:4778/Account/LogOn

http://localhost:4778/Home/About

  • Since there is no page anymore but views (even if there are physical files storing the view markup), the URL is different also and it introduces the ASP.NET MVC routing model that is the first item we are going to explore on tomorrow’s post.

Stay tuned!

Advertisements

Responses

  1. nice intro


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Categories

%d bloggers like this: