Thursday, February 27, 2014

MVC Tutorial Part 2 : Understanding Default MVC Project


Now when we are done with basics of MVC, most of which is already present on internet from where you can get more details. Let’s start with creation of an MVC project.

.Net MVC provides an inbuilt project which contains basic template.

In this session we will be going through this inbuilt MVC application given to us by MVC.

In this session we will be learning :

  1.  Basic structure of MVC project.
  2.  How to run the project.

Assumptions before going forward:

Microsoft .NET Framework 4.5:
We are assuming that you have already installed latest .net version
Recommended: Microsoft ASP .NET Framework 4.5
To download .NET Framework 4.5 follow below link

Microsoft Visual Studio Express 2012 for web:
We are assuming that you have already installed latest Visual studio
Recommended: Microsoft Visual Studio Express 2012 for web
To download the Microsoft Visual Studio Express 2012 for web follow below link

Microsoft SQL Express 2012
SQL is not needed for this demo, but we would require this in coming demos.
To download MS SQL Express 2012 follow the link below

Once all installations are done. Go to Start >> All Programs >> Microsoft Visual Studio 2012 Express >> VS Express for Web

Click on VS Express for Web. This will open launch Visual Studio.


Now go to File and navigate to “New Project”. This will open a new project window. Name your project “Demo1” and select a location where you want your project to be saved. Go to Visual C# and select ASP.NET MVC 4 Web Application and click on OK.


Note: We will be doing all our demos in MVC 4.

This will open a window as below,
Currently we are interested in “Internet Application”, select “Internet Application”.
Exactly below select template window we have an option to select View Engine.
There are two types of view engines in MVC4.0 ASPX and Razor. Mostly widely used view engine is Razor but for our starting projects we will be using ASPX view engine. Once done click OK.


This will create a new MVC application for us. 

In Solution Explorer you can see multiple folders and files.
These are default folders and files which MVC has created for us. Now let’s go through some of the important features MVC has provided us.


In Solution explorer, the main folders which we will be going through are: Controller, View, Model, App_Start.   

As the name suggests MVC (Model View Controller), you can make out what each folder would contain.

Controller Folder : Controller folder would contains the controller. Controller is the part to which View and Model talks to.
The role of controller is to dictate what to do behind the scenes and what to display in the view next.

1. Controller receives a request
2. Controller decides the requested activities based on request parameters
3. Controller delegates tasks to be performed based on the request parameters
4. Controller delegates the next view to be shown

In our application MVC has created two controllers for us :
  • ·         Home Controller
  • ·         Account Controller

To understand them better lets run our application by pressing F5 or by using the Run button on VS screen. This will load a well structured web page as below.


Now if you go back to VS and open HomeController.cs file. You will find on line 13:

 ViewBag.Message = "Modify this template to jump-start your ASP.NET MVC application.";

It’s the same message in title which is getting displayed on the Home screen above. This message is getting displayed in View called Index. If it’s not clear we will be going through all concepts in coming demos.


View Folder : View Folder contains sub folders as Account, Home, and Shared.


Home Folder: Files in this folder are called views. So the folder structure defines that Home Controller has three Views as About.aspx, Contanct.aspx and Index.aspx.


If you check line 11, 18 and 25 in HomeController.cs file, which shows we are calling these views from the Home Controller. Index.aspx is the default view.

Open Index.aspx file and go through the asp tags which MVC has created for us, you will find it similar to the text which is getting displayed on our home page after you run the project.



Model Folder: This folder currently has only one file. We don’t be using any model in some starting demos. To see model in a working you need to run the project and navigate to register page. Add some user name, password and click on Register. 
You will get error message as below, this validation message is coming from line 80 in AccountModels.cs Model.


App_Start Folder :
This folder contains some startup files. Some important files are explained below.
·         
     AuthConfig.cs: The AuthConfig file contains code to register clients for external authentication providers. By default, this code is commented out, so none of the external providers are enabled.
·         RouteConfig.cs: It is used to do URL routing or rewriting. (To know more about URL routing in asp.net : http://msdn.microsoft.com/en-us/library/cc668201.aspx )

We will be creating a small project in our next demo.



To learn more about MVC follow all parts of this tutorial series.
For detailed documentation and Video notes on MVC visit:


Created by:

Team: Techies@its4u
ITSolution4U – Technology Expert
ITSolution4U Home Page:
http://www.itsolution4u.com
Twitter:     https://twitter.com/IT_S4U
                                 




No comments:

Post a Comment