Content Websites

In its simplest form #Script is just plain HTML marked up with variable place holders, coupled with partials just being HTML pages themselves and the intuitive Cascading Layout Selection and using #Script becomes a natural solution for building complete websites without any code.

The flexibility of #Script allows for several different solutions for generating websites:

Website Sub Directory

A lightweight solution that can be embedded in any existing ASP.NET or ASP.NET Core Web Application is to embed and maintain an entire Website in a stand-alone sub directory. To showcase an example we've ported the content in the .NET Core Razor Rockstars into the /usecases/rockstar-files sub directory with the entire website viewable from:

/rockstar-files

Porting an existing Razor Website

Porting an existing Razor Website is fairly straight-forward, to port Razor Rockstars we needed to rename all .cshtml files back to .html and replace all their C# code. Using /cobain page as an example we needed to replace:

@{
    Layout = "DeadLayout";
    ViewBag.Title = "Kurt Cobain";
}

To use the equivalent page metadata:

<!--
title: Kurt Cobain
-->

You won't need to specify a custom layout as Sharp Pages will automatically select the closest layout from the page at: /rockstar-files/dead/_layout.html. You'll also no longer need to maintain your Layout pages and partials in /Views/Shared separate from your views as they all get to all live cohesively in the same logical folder structure.

The declarative {{ page }} is used to embed a page in a layout instead of the imperative @RenderBody(). Likewise the syntax for partials changes to {{ "menu-alive" | partial }} from @Html.Partial("MenuAlive"). Sharp Pages also alleviates the need for bespoke partials like @Html.PartialMarkdown("Content") as it can instead leverage the flexibility of chaining existing filters to achieve the same result like {{ "content.md" | includeFile | markdown }}.

To get a feel for what an equivalent Razor Website looks like compared to Sharp Pages checkout:

type before after
Layout /Views/Shared/DeadLayout.cshtml /dead/_layout.html
Partial /Views/Shared/MenuAlive.cshtml /menu-alive.html
Page /alive/vedder/default.cshtml /alive/vedder/index.html

Embedding Remote Content

A useful alternative to embedding static file content in pages is to source the content from a external url. Using the includeUrlWithCache method this is easy to do with great performance where you can embed remote url content, cache it for 1 minute and convert from markdown with:

{{ url | includeUrlWithCache | markdown }}

As seen in /grohl-url/index.html which is viewable at:

/rockstar-files/alive/grohl-url/

made with by ServiceStack