Razor Pages

Razor Pages is a page-centric programming model for building web UI with ASP.NET Core. It provides a simpler, more organized way to build Razor-based web applications compared to traditional MVC. Each Razor Page is represented by a single `.cshtml` file and an optional backing class (a Page Model) that inherits from `PageModel`.

Key Concepts

Page Model

A Page Model is a C# class that is associated with a Razor Page (`.cshtml` file). It contains properties and methods that are relevant to the Razor Page, such as data binding, handler methods for HTTP requests, and logic for preparing data to be rendered.

The Page Model class is typically named after the Razor Page file with a Model suffix (e.g., Index.cshtml would have a IndexModel class).

// Pages/Index.cshtml.cs
using Microsoft.AspNetCore.Mvc.RazorPages;

public class IndexModel : PageModel
{
    public string Message { get; set; }

    public void OnGet()
    {
        Message = "Welcome to Razor Pages!";
    }
}
            

Razor Page File

The Razor Page file (e.g., .cshtml) contains the HTML markup and Razor syntax for rendering the user interface. It can directly access properties and invoke methods defined in its associated Page Model using the @Model directive.

// Pages/Index.cshtml
@page
@model IndexModel
@{
    ViewData["Title"] = "Home page";
}

@Model.Message
This is a simple Razor Page.
            

Request Handling

Razor Pages use specific handler methods to respond to HTTP requests. These methods are named using the On[Verb] convention, where [Verb] is the HTTP verb (e.g., OnGet, OnPost, OnPut).

• `OnGet()`: Handles GET requests to the page.
• `OnPost()`: Handles POST requests to the page.
• `OnGetAsync()` / `OnPostAsync()`: Asynchronous versions of the handlers.
• Named Handlers: You can define multiple handlers for the same verb (e.g., OnGetDetails(int id)) which can be invoked via URL routing.

Data Binding

Razor Pages supports model binding for properties in the Page Model. You can bind form data, query string parameters, and route values directly to properties in your Page Model.

// Pages/Contact.cshtml.cs
using Microsoft.AspNetCore.Mvc.RazorPages;
using System.ComponentModel.DataAnnotations;

public class ContactModel : PageModel
{
    [Required]
    [Display(Name = "Your Name")]
    public string Name { get; set; }

    [Required]
    [EmailAddress]
    [Display(Name = "Your Email")]
    public string Email { get; set; }

    [Required]
    [Display(Name = "Message")]
    public string MessageText { get; set; }

    public void OnGet()
    {
    }

    public IActionResult OnPost()
    {
        if (!ModelState.IsValid)
        {
            return Page(); // Re-render the page if validation fails
        }
        // Process the form data (e.g., send an email)
        return RedirectToPage("./Success");
    }
}
            

// Pages/Contact.cshtml
@page
@model ContactModel
@{
    ViewData["Title"] = "Contact Us";
}

Contact Us
Please fill out the form below to contact us.


    

    

        

        
        
    
    

        

        
        
    
    

        

        
        
    
    

        Send Message
    


@section Scripts {
    
}
            

Layouts and Partial Views

Razor Pages can leverage shared layouts for consistent branding and navigation, similar to MVC. You can also use partial views for reusable UI components.

The default layout is typically defined in Pages/_Layout.cshtml and can be overridden on a per-page basis using the Layout property in the @page directive.

Advantages of Razor Pages

• Simplicity: Easier to learn and use for page-centric scenarios.
• Organization: Code and UI are co-located, making it easier to manage.
• Reduced Boilerplate: Less code is needed compared to MVC for common tasks.
• Testability: Page Models are plain C# classes, making them easy to unit test.

When to Use Razor Pages

Razor Pages are ideal for:

• Applications with a strong page-centric UI.
• Forms, data entry, and display scenarios.
• Developers who prefer a simpler, more organized approach than MVC.
• New ASP.NET Core projects that don't require the full complexity of MVC.