MVC Environment Set Up

Setting up the environment for creating MVC web application

Run the visual studio and select File → New Project from the Start page. You can create applications using either Visual Basic or Visual C# as the programming language. We have used C# from the left and then select ASP.NET MVC 4 Web Application. Name your project as "MVCDemo" and then click OK.

From the new ASP.NET MVC 4 Project dialog box, select empty template. Leave Razor as the default viewengine. Click OK.

We have selected empty template therefore we will not get any default controller. We have to add controller to our self. From solution explorer, write click on controller folder and select Add → controller. Assign name of controller. We have given HomeController as a controller name.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace  MVCDemo.Controllers
{
    public class HomeController : Controller
    {
        // GET: /Home/
        public ActionResult Index()
        {
            return View();
        }
    }
}


When you run this application it will give you error as follows because view is not available.

For now change the return type of Index() function(type string) as given below and run the application.

using System.Web.Mvc;
namespace MVCDemo.Controllers
{
    public class HomeController : Controller
    {
         public string Index()
        {
            return "Welcome to TutorialRide.com";
        }
    }
}


Now run the application. You will get the message as "Welcome to TutorialRide.com";
In the above code HomeController class is inherited from Controller class. In this class Index is default function that returns the string.

One of the most interesting effect you will see at the address bar of the browser while you run ASP.NET MVC application. It will show you something like http://localhost:57498/ not as simple web application. When you run general web application you will see in the address bar of the browser something like http://localhost:58378/Default.aspx. In your case, port number probably may be different. When you run the application, a random port is used for the web server.

Now if you explicitly append /Home or /Home/index  to http://localhost:57498/ at the address bar of your browser, then you will get the same output.

Example:
http://localhost:57498/Home/ or http://localhost:57498/Home/index

So, how it possible? Or you can say how URL’s mapped to controller Action methods?
The answer is ASP.NET routing. ASP.NET implements the RouteConfig class. This
class is located in App_Start folder.

Code of RouteConfig.cs file

using System.Web.Mvc;
using System.Web.Routing;

namespace MVCDemo
{
    public class RouteConfig
    {
        public static void RegisterRoutes(RouteCollection routes)
        {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
            routes.MapRoute(
                name: "Default",
                url: "{controller}/{action}/{id}",
                defaults: new { controller = "Home", action = "Index",  id = UrlParameter.Optional }
            );
        }
    }
}


In the above code, in defaults property, controller name is set to “Home” and action name is set as “Index”. If you do not append the /Home or /Home/Index, by default it is appended by MVC framework. That’s why when you simply run the application from visual studio, you will see the address at the address bar something like http://localhost:57498/, not complete address. The third property id is optional. You can pass this id in Index() function as:

public class HomeController : Controller
    {
         public string Index(Sting id)
        {
            return “ID = ”+id;
        }
    }


Write http://localhost:57498/home/index/100 in the address bar and run the above code. You will get the result as:
ID= 100

ASP.NET MVC - Application Folders

mvc-application

App_Data: This folder is used for storing database data or XML data.

App_Start: App_Start folder contains class files. These files will be executed when the application starts.

Controllers: The Controllers folder contains the controller classes. In ASP.NET MVC requires that the name of all controllers files should end with "Controller". Controllers handle input data and return a response.

Models: Models folder contains model class files. Generally model class comprises of public properties, which will be used by application to manipulate application data.

Views: Views folder contains the HTML file that displays the user interface. This folder contains one folder for each controller. Normally view files are .cshtml files where you write html and C# or VB.NET code. Razor-basedview templates have a .cshtmlfile extension.

Global.asax: As Global name itself says that everything that is written in Global.asax, will be applicable to whole application. Global.asax file contains initialization code that runs when the application is first started up. Code that you write in Global.asax runs in response to application level events, such as Application_BeginRequest, application_start, application_error, session_start, session_end etc.

Web.config: This file contains application level code for configurations settings.