_Layout And _ViewStart And _ViewImports In ASP.NET MVC Core 3.0

Today in this article I will discuss about _Layout, ViewStart, and ViewImports files in ASP.Net MVC Core 3.0. These are the files placed in the views folder. We will understand all 3 files step by step.

Step 1. Start up your Visual Studio 2019. Choose ASP.NET Core Web Application and click on “Next”.

Visual Studio 2019

After clicking next another wizard will open. Under project name give a meaningful name for your project and click on create.

Configure project

That will open up another new wizard. Select ASP.Net Core 3.0 from dropdown if not select default. Choose an empty template and click on create -- that will create your first ASP.Net Core Application.

Select ASP.Net

Step 2. Visual Studio 2019 will generate a program and startup class. Now open the startup file and configure ASP.Net MVC Core Application development. Under app.UseEndpoints method just Map endpoints.MapControllerRoute.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Http;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Hosting;

namespace TagHelperMvcCore
{
    public class Startup
    {
        public void ConfigureServices(IServiceCollection services)
        {
            services.AddControllersWithViews();
        }

        public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
        {
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }

            app.UseRouting();
            app.UseStaticFiles();

            app.UseEndpoints(endpoints =>
            {
                endpoints.MapControllerRoute(
                    name: "default",
                    pattern: "{controller=Home}/{action=Index}/{id?}");
            });
        }
    }
}

What is _Layout.cshtml?

This is used for common layout in web pages; it is like the master page. The layout typically includes common user interface elements such as the app header, navigation or menu elements, and footer. Common HTML structures such as scripts and stylesheets are also frequently used by many pages within an app. All of these shared elements may be defined in a layout file, which can then be referenced by any view used within the app. Layouts reduce duplicate code in views.

Step 3. Right-click on the project and create a folder called "Views" if you don't already have it.

Step 4. Right-click on the created views folder "Add" another folder under the views folder name it shared folder. Now right-click on a shared folder and choose “Add New Item.” A window wizard will appear from the window wizard; from that choose _Layout.cshtml razor file click on the “Add” button. _Layout file will be added under the shared folder.

Add

Razzor layout

What is _ViewStart.cshtml?

It's a special file in ASP.NET Core MVC. The code in this file is executed before the code in an individual view is executed. Instead of setting the Layout property in each individual view, we can move that code into the _ViewStart.cshtml file. By setting the Layout property in _ViewStart.cshtml file maintaining our application becomes much easier. In the future, if we want to use a different layout file we just need to change the code in one place in _ViewStart.cshtml.

Step 5. Right-click on the view folder and _ViewStart.cshtml file similar to _Layout.cshtml file but this file should be placed outside the shared folder.

ViewStart

What is _ViewImports.cshtml?

_ViewImports.cshtml file is usually placed in the Views folder. It is used to include the common namespaces so we do not have to include them in every view that needs those namespaces.

Step 6. Right-click on the view folder and _ViewImports.cshtml file similar to _Layout.cshtml file but this file should be placed outside the shared folder.

ViewImports