` element. Add a second markdown file under `Content/` and its file path becomes its URL — no router-table edit required. ``` > [!CHECKPOINT] > - `dotnet build` succeeds with no errors > - `dotnet run --urls http://localhost:5000` followed by visiting `http://localhost:5000/` returns the literal text `Hello World!` — the bare web template's response. Pennington takes over in the next section > - Stop the process with `Ctrl+C` before continuing --- ## 2. Wire Pennington, Blazor, and the markdown page Replace the `Program.cs` body with the host below, then add three Razor files: a `_Imports.razor` for shared `@using` lines, an `App.razor` root component that owns the document shell, and a `MarkdownPage.razor` catch-all that renders any URL to a markdown file. Two service registrations (`AddPennington` for the content pipeline, `AddRazorComponents` for Blazor SSR) and three middleware calls (`UsePennington`, `UseAntiforgery`, `MapRazorComponents()`) are all the host needs. > [!IMPORTANT] > `app.UsePennington()` must run before `app.MapRazorComponents()`. The Blazor catch-all `@page "/{*Path}"` would otherwise swallow Pennington's redirect, sitemap, and llms.txt routes. > [!NOTE] > The embeds come from the finished example, so they use its root namespace `GettingStartedBlazorPagesExample` (in `Program.cs` and `_Imports.razor`). Swap in your own — here, `MyBlazorPenningtonSite`. **Replace `Program.cs`** ```csharp:symbol using GettingStartedBlazorPagesExample.Components; using Pennington.FrontMatter; using Pennington.Infrastructure; var builder = WebApplication.CreateBuilder(args); // 1. Same Pennington wiring as the minimal-site tutorial: register the content // pipeline and point one markdown source at Content/. builder.Services.AddPennington(penn => { penn.SiteTitle = "My First Pennington Site"; penn.ContentRootPath = "Content"; penn.AddMarkdownContent(md => { md.ContentPath = "Content"; md.BasePageUrl = "/"; }); }); // 2. Add Blazor Server's static-rendering services. This is what unlocks // `MapRazorComponents()` below. builder.Services.AddRazorComponents(); var app = builder.Build(); // 3. Order matters: UsePennington registers redirect routes, llms.txt, and // sitemap endpoints. The Blazor catch-all `@page "/{*Path}"` would swallow // those routes if MapRazorComponents ran first. app.UsePennington(); // 4. Antiforgery middleware is required by MapRazorComponents — Blazor's // routed components opt into the [RequireAntiforgeryToken] metadata even // when no form ships in the page. app.UseAntiforgery(); // 5. Hand routing to Blazor. Components/App.razor's finds the // matching @page component (in this project: Components/Pages/MarkdownPage.razor). app.MapRazorComponents(); await app.RunOrBuildAsync(args); ``` **Add `_Imports.razor` at the project root** `_Imports.razor` provides the `@using` set every `.razor` file in the project sees. ```razor:symbol @using Microsoft.AspNetCore.Components @using Microsoft.AspNetCore.Components.Routing @using Microsoft.AspNetCore.Components.Web @using Pennington.Content @using Pennington.Pipeline @using Pennington.Routing @using GettingStartedBlazorPagesExample.Components ``` **Add `Components/App.razor`** `App.razor` is the root component `MapRazorComponents()` mounts. It owns the entire HTML document — ``, ``, `` (with `` so each routed page's `` flows in), and ``. The `` inside `` scans the assembly for `@page` components and routes each request to the matching one. ```razor:symbol @* Root component. Owns the entire HTML document — no MainLayout in this tutorial. The Router scans this assembly for [@page] components and routes each request to the matching one. from each routed page flows into via . *@

Not found.

``` **Add `Components/Pages/MarkdownPage.razor`** `MarkdownPage.razor` is the `@page "/{*Path}"` catch-all. Blazor binds the request path to the `Path` parameter; the component asks `IPageResolver` to resolve that URL to a rendered page and injects the HTML via `(MarkupString)`. It's the same `IPageResolver` the `MapGet` host used in the previous tutorial — only the call site has moved into a component. ```razor:symbol @* Catch-all that matches every URL and asks IPageResolver to resolve it to a markdown file. It's the same IPageResolver the MapGet host injected in the previous tutorial — the only thing that's changed is where it's called from. *@ @page "/{*Path}" @inject IPageResolver Resolver @if (_html is not null) { @_title

@_title

@((MarkupString)_html)

} else { Not found

No content matches @Path.

} @code { [Parameter] public string? Path { get; set; } private string? _title; private string? _html; protected override async Task OnInitializedAsync() { var requested = new UrlPath(Path ?? string.Empty).EnsureLeadingSlash(); if (await Resolver.ResolveAsync(requested) is { } page) { _title = page.Metadata.Title; _html = page.Content.Html; } } } ``` > [!CHECKPOINT] > - `dotnet run --urls http://localhost:5000` and visit `http://localhost:5000/` — the page renders `Content/index.md`. > - View source. The `` and `<h1>` both pull from `index.md`'s front-matter `title:`. --- ## 3. Add a second markdown file The file-path-to-URL convention is unchanged by routing through Blazor. Pennington's file watcher picks up new files in `Content/` while the host runs — no restart, no router-table edit. **Add `Content/about.md`** Leave `dotnet run` going from the previous section and drop this file in. ```markdown:symbol --- title: About description: Proves that adding a markdown file is enough to expose a new URL. --- This file is `Content/about.md` and the catch-all serves it at `/about`. The Blazor router didn't gain a new entry — `MarkdownPage.razor` matches every URL through `@page "/{*Path}"` and asks the content pipeline whether anything on disk corresponds to the requested path. Rename this file to `reach-out.md` and `/reach-out` works on the next request. The only thing routing the URL is the file's name. ``` **Navigate to `/about`** Open `http://localhost:5000/about` in the browser. The catch-all serves the new file on the first request — no restart needed. > [!CHECKPOINT] > - Visit `/about` — the page renders, served through the same catch-all as `/`. --- ## Summary - A Pennington host plus a Blazor Server router is two service registrations (`AddPennington`, `AddRazorComponents`) and three middleware calls (`UsePennington`, `UseAntiforgery`, `MapRazorComponents<App>()`). - `app.UsePennington()` must run before `app.MapRazorComponents<App>()` — the catch-all would otherwise swallow Pennington's redirect, sitemap, and llms.txt routes. - A single `@page "/{*Path}"` component (`MarkdownPage.razor`) handles every URL, resolves it through `IPageResolver`, and injects the rendered HTML via `(MarkupString)`. - The file-path-to-URL convention from the markdown pipeline still holds — adding or renaming a `.md` file under `Content/` is enough. [Previous Create your first Pennington site](https://usepennington.net/tutorials/getting-started/first-site.md)[Next Style the site with MonorailCSS](https://usepennington.net/tutorials/getting-started/styling.md)