Understanding Razor components

Although we developed and utilized Razor components in the previous two chapters, we have not yet delved deeply into them. In this section, we will continue refining the app from the last chapter while exploring Razor components more thoroughly, thereby gaining a better understanding of key concepts surrounding these components.

Blazor apps are constructed using Razor components. The first Razor component in our app is Main, and it is defined in Main.razor, as illustrated below:

<Router AppAssembly="@typeof(Main).Assembly">
  <Found Context="routeData">
    <RouteView RouteData="@routeData"
      DefaultLayout="@typeof(MainLayout)" />
    <FocusOnNavigate RouteData="@routeData" Selector="h1" />
  </Found>
  <NotFound>
    <LayoutView Layout="@typeof(MainLayout)">
      <p role="alert">
        Sorry, there's nothing...