Skip to content

Overview

Static Components is a minimalistic ASP.NET Core library that allows you to write UI components while maintaining full compatibility with Razor Pages and MVC. With this library you can create your own static components, which makes it synergize perfectly with AlpineJS, HTMX, and the “low-JS” approach to building web applications.

Component-driven

Build reusable UI components using familiar Razor syntax — no JavaScript framework required.

Razor-native

Works seamlessly with Razor Pages and MVC. Your components are tag helpers under the hood.

Composable

Support for child content, named slots, and nested component hierarchies.

Script management

Built-in tools for teleporting scripts, deduplicating them, and injecting server-side state.

A component consists of two files: a C# code-behind class that inherits from StaticComponent, and a Razor view (.cshtml) that serves as its template. The class is automatically available as a tag helper in your Razor pages.

~/Pages/Components/HelloWorldComponent.cshtml.cs
using Microsoft.AspNetCore.Razor.TagHelpers;
using TechGems.StaticComponents;
namespace Sample.Views.Components;
public class HelloWorldComponent : StaticComponent
{
public HelloWorldComponent()
{
}
public string GreetMessage { get; set; }
}
~/Pages/Components/HelloWorldComponent.cshtml
@using Sample.Views.Components;
@model HelloWorldComponent
<div>Hello world! @Model.GreetMessage</div>