How to reference remote C# code in 11ty

We write blog posts and we want to reference our GitHub project C# code or any code from our projects in 11ty. This is a great way to share and maintain code snippets with the community.

11ty and remote source code 🔗

I am new to 11ty so I asked the 11ty community here at GitHub Discussions and @pehann helped me out.

I have modified the original implementation for this post so it is more generic.

eleventyConfig.addAsyncShortcode("remote_include", async function (urlPath) {

    const sample = await EleventyFetch(url, {
        duration: "1d"
    });

    return sample;
});

Example remote C# code reference in markup.

```csharp
{% remote_include 'https://raw.githubusercontent.com/stride3d/stride/master/samples/Tutorials/CSharpIntermediate/CSharpIntermediate/CSharpIntermediate.Game/01_UI-Basics/UIByEditor.cs' %}
```

Result:

// Copyright (c) .NET Foundation and Contributors (https://dotnetfoundation.org/ & https://stride3d.net)
// Distributed under the MIT license. See the LICENSE.md file in the project root for more information.
using Stride.Engine;
using Stride.Graphics;
using Stride.UI;
using Stride.UI.Controls;
using Stride.UI.Events;

namespace CSharpIntermediate.Code
{
    public class UIByEditor : StartupScript
    {
        public SpriteFont Font;

        private TextBlock textBlock;
        private EditText editText;

        public override void Start()
        {
            // Retrieve the page property from the UI component
            var page = Entity.Get<UIComponent>().Page;

            // Retrieve UI elements by Type and name
            textBlock = page.RootElement.FindVisualChildOfType<TextBlock>("MyTextBlock");
            editText = page.RootElement.FindVisualChildOfType<EditText>("MyEditText");

            // When the text changes, update the textblock
            editText.TextChanged += (s, e) =>
            {
                textBlock.Text = "My name is: " + editText.Text;
            };

            // When the button is clicked, we execute a method that clears the textbox
            var button = page.RootElement.FindVisualChildOfType<Button>("MyButton");
            button.Click += ButtonClicked;
        }

        private void ButtonClicked(object sender, RoutedEventArgs e)
        {
            // Changing the text triggers the TextChanged event again
            editText.Text = "";

            // We also want to reset the text in the textblock
            textBlock.Text = "...";
        }
    }
}

C#.NET11tyAdvanced

Any comments? You can start 🗨 at GitHub Discussions. Edit this page on .