ASP.NET Core

Building Your First ASP.NET Core Web App

Building Your First ASP.NET Core Web App

Building Your First ASP.NET Core Web App

Create Project
Open Visual Studio 2022 and create an ASP.NET Core Empty Project.


Adding MVC Services
To make our project work with MVC, First, we need to add the MVC Related services. Open the ConfigureServices method and add the AddMvc() extension method.

public void ConfigureServices(IServiceCollection services){
    services.AddMvc();
}



Adding MVC Middleware
Next, we need to add the MVC Middleware to the request pipeline. This is done by calling the app.UseMvcWithDefaultRoute(). The Middleware must be registered inside the Configure method of the Startup class.
UseMvcWithDefaultRoute is is an extension method found in the Microsoft.AspNetCore.Mvc.Core namespace. This Package is part of the Microsoft.AspNetCore.All meta package and already gets installed.

public void Configure(IApplicationBuilder app, IHostingEnvironment env){
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }
    app.UseStaticFiles();
    app.UseMvcWithDefaultRoute();
}
// The UseMvcWithDefaultRoute installs MVC Middleware with the default Route.




Adding the Controllers
The Controllers in the MVC pattern are responsible for responding to the user input. They are responsible to build the model and pass it to the View.
Right Click on the solution folder and Create a Folder called Controllers.
Right-click on the Controller’s folder and select Add -> Controller.
Enter the name as HomeController and click ok.



Adding the View
The view is a visual representation of the model. It is the responsibility of the Controller to pass the model to the View. It is the responsibility of the View is to render the model given to it and present it to the user.
Now, Right Click on Views and click on Add View.
Keep the View name as Index. Template Empty (without model). Remove the selection from Create as Partial Views and Use a Layout Page as shown below.
Click on Add to create the View.
This Creates the View Under the Views/Home folder. This is the convention followed by the ASP.NET MVC core.


Adding the Model
The Model represents the data that needs to be shown to the user and some associated logic. It is an object or just another c# class with properties and methods.
Create Models folder in the root of the application. Now, add a class with the name HomeModel.cs


Update the Controller to inject model to the View

public IActionResult Index()
{
    HomeModel message = new HomeModel();
    return View(message);
}





Update the View to Receive the model

@model MVCCoreApp.Models.HomeModel;
@{
    Layout = null;
}
 
<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="width=device-width" />
        <title>Index</title>
        <p> @Model.Message</p>
    </head>
    <body>
    </body>
</html>








Related Post

About Us

Community of IT Professionals

A Complete IT knowledgebase for any kind of Software Language, Development, Programming, Coding, Designing, Networking, Hardware and Digital Marketing.

Instagram