Examine pizza page's structure

Examine the Razor page's structure

Open the new Pages/Pizza.cshtml Razor page. Examine the file's markup:

@page
@model RazorPagesPizza.Pages.PizzaModel
@{
}

The preceding Razor page contains reserved Razor keywords:

  • The @page directive is what makes the page a Razor page. It indicates the page can handle HTTP requests.

  • The @model directive specifies the model type made available to the Razor page. In this case, the type is the PageModel-derived class name, prefixed with its namespace. As you recall, that class is defined in Pages/Pizza.cshtml.cs.

The @page directive must be the first directive on a Razor page.

Render HTML and transition to C#

  • The following markup is an example of an @ symbol followed by C# code. The code sets the ViewData collection's Title key value to Pizza.

  • Razor syntax uses the @ symbol to transition from HTML to C#. If the @ symbol is followed by a Razor reserved keyword, it transitions into Razor-specific markup; otherwise, it transitions to C#.

  • Razor evaluates the C# expressions and renders them in the HTML output.

@{
    ViewData["Title"] = "Pizza";
}

Razor syntax uses the @ symbol to transition from HTML to C#. A Razor page supports Razor syntax, which is HTML and C# combined!

  • The C# code defines the dynamic rendering logic for the page on the server.

  • The default Razor language is HTML. Rendering HTML from Razor markup is no different than rendering HTML from an HTML file.

  • HTML markup in .cshtml Razor page files is rendered by the server unchanged.

  • In Razor Pages, HTML can be used as you're used to. At the same time, you can take advantage of powerful and time-saving Razor features as you learn to use them.

Last updated