With FSharp

Create a folder to host your code Nacara.Layout.Custom.

mkdir Nacara.Layout.Custom && cd Nacara.Layout.Custom

Create an FSharp project Nacara.Layout.Custom.fsproj

dotnet new library -lang f#

Add Nacara.Core to your project

dotnet add package Nacara.Core

By default you have access to Fable.React, if you prefer Feliz you can add it

dotnet add package Feliz

Change Library.fs content to:

module Layout

open Fable.Core.JsInterop
open Nacara.Core.Types
open Fable.React
open Fable.React.Props

// Your render function, it is responsible to transform a page into HTML
let render (rendererContext : RendererContext) (pageContext : PageContext) =
    promise {
        let! pageContent =
            rendererContext.MarkdownToHtml(
                pageContext.Content,
                pageContext.RelativePath
            )

        return div [ ]
            [
                str "Hello, from your custom layout"
                br [ ]
                div [ DangerouslySetInnerHTML { __html = pageContent} ]
                    [ ]
            ]
    }

// This is how we expose layouts to Nacara
exportDefault
    {
        Renderers = [|
            {
                Name = "my-layout"
                Func = render
            }
        |]
        Dependencies = [| |]
    }

Compile your project to JavaScript using Fable.

If you don't have Fable installed in your project you need to install it:

dotnet new tool-manifest
dotnet tool install fable

Launch the compilation:

dotnet fable --outDir dist --watch

Register your layout in the nacara.config.json

{
    // ...
    "layouts": [
        "nacara-layout-standard",
        "./Nacara.Layout.Custom/dist/Library.js"
    ]
}