Create ASP.NET MVC Application

Part I. Create ASP.NET MVC Application

In this article, we will create a simple example of an ASP.NET MVC project. To create ASP NET MVC Application, we will have to install the latest Visual Studio installer. In this tutorial, we’ll help you on how you can start new ASP.NET Web Application Projects, and hopefully, later on, we’ll help you to create your first Web Application.

What is ASP.NET MVC?

ASP.NET MVC is an open-source web development framework from Microsoft that provides a Model View Controller architecture. This free web framework is designed to build websites and web applications on .NET Framework using HTML, CSS, and JavaScript.

What is MVC?

MVC is an architectural pattern known as Model-View-Controller. This architecture separates your application into three logical components.

  • Model – The Model is the properties of the data inside your application. Model is created using C# classes.
  • View – The View is the main user interface of an application. This part is where all the data will be displayed.
  • Controller – The controller handles the user request. The user request using the view and send an HTTP request to the controller to process the request.

Before we start, Please make sure to have installed the latest Visual Studio. Link

Create ASP.NET MVC Project

Step 1. Open your Visual Studio then create a new project.

Create New Project

Step 2. Another window will open. Search for ASP.NET Web Application then click on the next button to proceed.

ASP.NET Web Application

Step 3. Configure your project. Please assign a name for your project. In my case, I named it MVCWebApp. Once you have set all the configuration settings, click on the create button.

Name your Project

Step 4. Now, we have two options to start a project we can use the MVC template, or we can start from an empty project. We will use the empty MVC template. Click on the create button.

Web Application

Step 5. Wait for Visual Studio to create your projects. A new project solution will be open once done. This is how an empty MVC project solution will look like. See the image below.

Empty MVC Project solution

Now, when you run the project by pressing F5. You will have the error from the image below since we started a project with an empty solution. We need to create the controller manually.

Without Controller

Step 6. Create a controller by right-clicking on the controller folder then select Add » Controller.

MVC Controller

Step 7. A popup window will appear, select MVC 5 controller then click the Add button.

MVC 5 Controller

Step 8. Name your controller. Then press Add.

Name Controller

This will create a new controller with a default Index method.

Home Controller

Step 9. Now, all we need to do is to create a View. We will create a view for this index method. To do that, right-click on the Index method from HomeController.

Add View

Step 10. Add window will popup. Click add to proceed.

Add View index

This action will create an Index.cshtml file under Views » Home folder. Adding a view also creates a file named _Layout.cshtml, this is the base layout of your application. This file is where your navigation menu is located. See the image below.

Create ASP NET MVC Application

So, finally you can rerun your project to see if your ASP.NET MVC Application is now working.

Create ASP NET MVC Application

To modify Application Name and adding of menu. Use the _Layout.cshtml file under Shared folder.

Summary

This article is a guide for beginners. We have demonstrated a step by step process on how we can create ASP NET MVC Application using an Empty MVC Project. If you want to familiarize yourself with the structure of a .NET MVC check out this article. Hopefully, you can use this article for your reference for your future projects. Happy coding!