All About Pages In ASP.NET Core 2.0

I hope while working on Razor pages, one thing you have noticed is @page.

Let’s say you added a new page (named Sample.cshtml) in Visual Studio Code in your existing application. Once the page is added, we will get an empty editor window on the right side pane where we are going to write code for our page.

In order to make things simple, I’m adding very simple HTML code:

<h1> Welcome to my page </h1>

Now, save and run the application.

Oh -- 404. Any idea why we end up looking at such a weird page?

Well, @page is holding this magic. Basically, none of the Razor pages will be considered as pages until and unless they are decorated as @page in the very first line.

But as soon as we append the @page in our newly added Sample.cshtml page, things will work as expected.

Next, we will quickly look at a few of the files which are added by default under a Pages folder with some pre-specified lines of code.

_ViewStart.cshtml

This file contains the code which runs for every View. By default, it contains only 1 line of code as shown below, which is showing the layout page for every page.

@{
Layout = "_Layout";
}

_ViewImports.cshtml

This file contains all the namespaces which are to be used by every view. So, rather than adding same reference on top of each and every View, it can be moved to _viewImports.cshtml. By default, this file contains the below lines of code where WebApplciation1 is the name of my application.

@using WebApplication1
@namespace WebApplication1.Pages
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers

_ValidationScriptsPartial.cshtml

This file contains validation scripts in the form of a partial view. By default, this file contains the below code:

<environment include="Development">
<script src="~/lib/jquery-validation/dist/jquery.validate.js"></script>
<script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.js"></script>
</environment>
<environment exclude="Development">
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/jquery.validate.min.js"
asp-fallback-src="~/lib/jquery-validation/dist/jquery.validate.min.js"
asp-fallback-test="window.jQuery && window.jQuery.validator"
crossorigin="anonymous"
integrity="sha384-Fnqn3nxp3506LP/7Y3j/25BlWeA3PXTyT1l78LjECcPaKCV12TsZP7yyMxOe/G/k">
</script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validation.unobtrusive/3.2.6/jquery.validate.unobtrusive.min.js"
asp-fallback-src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"
asp-fallback-test="window.jQuery && window.jQuery.validator && window.jQuery.validator.unobtrusive"
crossorigin="anonymous"
integrity="sha384-JrXK+k53HACyavUKOsL+NkmSesD2P+73eDMrbTtTk0h4RmOF8hF8apPlkp26JlyH">
</script>
</environment>

Now if this validation script has to be used in any View then it can be done using the RenderPartailAsync method as shown below:

@{await Html.RenderPartialAsync("_ValidationScriptsPartial"); }

_Layout.cshtml

This file is for layout of the application and contains a lot of code which is required to create a layout for our application. The most important method in this file is @RenderBody() which embeds other views into it.

I hope you enjoyed reading about Pages.