Categories: ASP.NETASP.NET MVC

Building MVC pattern project by Visual Studio 2017 ( ASP.Net framework Part )

In recent years, Microsoft provides the ASP.NET framework and the ASP.NET Core framework. I will show two samples for the web application’s MVC pattern. The compiler tools are the Visual Studio 2017 because the previous generation tools can provide thoroughly developed environments and an ultimate framework. We can know the Visual Studio 2017 only supports the ASP.NET Core framework v2.8 and ASP.NET framework v4.8, which can’t affect the MVC pattern’s building web application. I know another part of developers uses the Visual Studio Code tool to develop the web application. Still, I won’t show the Visual Studio Code article content because I hope to offer more about screenshots to give the reader a see.

Enterprise Project Architecture

Enterprise project architecture means the web application architecture uses the Onion model, which is called “Onion architecture.” Onion architecture includes the UI layer, the application service layer, the domain service layer, and the domain model layer. It doesn’t limit that you only choose the Onion architecture. The enterprise project architecture has other architectures, such as Hexagonal architecture, Microservices, and Action-domain responder. You can select the MVC architecture for your project that is simple to build your project architecture. I will show it because most enterprise architects, system analytics, system design, and team leaders will choose the Onion architecture. After all, the Onion architecture is easy to understand modern architecture and maintenance projects.

ASP.NET framework v4.8 for the MVC pattern

Step 1. Create the web application by ASP.NET framework. Open the Visual Studio. Click File -> New -> Project menu option, then adding the new project dialog open.

Fig 1

Step 2. Chose the Visual Studio empty temple project that is base on the ASP.NET framework. We focus on the enterprise architecture project’s MVC pattern, creating quick and simple projects to demo. I call this project name that is “Enterprise_MVC_WebApplication.”

Fig 2 New project dialog box screen

Add the unit test in this project. The authentication setting is “No Authentication.”

Fig 3 New ASP.NET web application dialog box

You will see your solution explorer files architecture that likes Fig 4.

Fig 4 Solution explorer for the ASP.NET MVC web application

Step 3. Add the controller files. Right-click on the controller folder in the solution explorer -> Select Add -> Controller.

Fig 5

Step 4. Select the MVC 5 Controller Empty -> “Add” button. The controller name sets the “HomeController.”

Fig 6 Create MVC 5 controller

Fig 7 Controller name

After Visual Studio creates the controller files, the Solution Explorer will see the new controller files under the Controller folder. The Solution Explorer will also generate the Home folder under the Views folder.

Fig 8 Solution explorer for new controller files.

Step 5. Open the HomeController.cs file, then modify the source code.

Fig 9 HomeController source code

 using System;
 using System.Collections.Generic;
 using System.Linq;
 using System.Web;
 using System.Web.Mvc;
 namespace Enterprise_MVC_WebApplication.Controllers
 {
     public class HomeController : Controller
     {
         // GET: Home
         public string Index()
         {
             return "Hello World, this is ASP.Net MVC Tutorials";
         }
     }
 }

Now, we try to run the project under the debug model. You will see these messages on your browser.

Fig 10 Firs running the project without the view files.

We have entirely created a simple project. Now, we start to build the enterprise project architecture. We will have four projects in this case, such as the core project, the Infrastructure project, the test project, and the web project.