Getting Started with Blazor WebAssembly Standalone

What Is Blazor WebAssembly?

Blazor is a Microsoft framework that allows you to build interactive web user interfaces using C# and .NET instead of JavaScript. With Blazor WebAssembly (WASM), your application runs entirely in the browser using WebAssembly.

A standalone Blazor WebAssembly app is deployed as static files (HTML, CSS, JavaScript, and WebAssembly) and does not require a server-side runtime once published.

Prerequisites

• Visual Studio 2026 Community Edition
• ASP.NET and Web Development workload installed
• .NET SDK 9 or later
• Modern web browser (Chrome, Edge, Firefox)

Create a Blazor WebAssembly Standalone App

1. Open Visual Studio 2026 Community.
2. Select File → Create a new project.
3. Search for Blazor.
4. Select Blazor WebAssembly StandaloneApp.
5. Click Next.
6. Enter a project name (for example: MyBlazorWasmApp).
7. Choose the target .NET version.
8. Leave authentication set to None.
9. Click Create.

Project Structure Overview

• wwwroot/ – Static assets such as CSS, images, and JavaScript
• Pages/ – Razor pages (Index, Counter, FetchData)
• App.razor – Root application component
• Program.cs – Application startup and service configuration

Run the Application

Press F5 or click the Run button. The application will launch in your default browser using a local development server.

Edit the Counter.razor Component

Edit Pages/Counter.razor and replace its contents with:

@page "/counter"

<PageTitle>Counter</PageTitle>

<h1>Counter</h1>

<p role="status">Current count: @currentCount</p>

<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
<br />
<br />
<br />
<br />
<Button @onclick="IncrementCount">Click Me</Button>
@code {
    private int currentCount = 0;

    private void IncrementCount()
    {
        currentCount++;
    }
}

This demonstrates client-side interactivity using only C#.

Using Smart.Blazor

Smart.Blazor provides a set of ready-made UI components for Blazor, like buttons, grids, lists, and inputs.

1. Install the Package

dotnet add package Smart.Blazor

2. Import the Namespace

Add this at the top of your Razor pages (or in _Imports.razor for global use):

@using Smart.Blazor

3. Add Required Assets

Edit wwwroot/index.html and include:

<link href="_content/Smart.Blazor/css/smart.default.css" rel="stylesheet" />
<script src="_content/Smart.Blazor/js/smart.blazor.js"></script>
<script src="_content/Smart.Blazor/js/smart.elements.js"></script>

4. Use a Smart.Blazor Component

<Button OnClick="@(() => message = "Smart button clicked!")">
    Smart UI Button
</Button>

<p>@message</p>

@code {
    string message = "Not clicked yet";
}

5. Edit Program.cs and add the Smart.Blazor

using BlazorApp9;
using Microsoft.AspNetCore.Components.Web;
using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
using Smart.Blazor;

var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add("#app");
builder.RootComponents.Add("head::after");
builder.Services.AddSmart();
builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });

await builder.Build().RunAsync();
		

6. _Imports.razor

@using System.Net.Http
@using System.Net.Http.Json
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web
@using Microsoft.AspNetCore.Components.Web.Virtualization
@using Microsoft.AspNetCore.Components.WebAssembly.Http
@using Microsoft.JSInterop
@using BlazorApp9
@using BlazorApp9.Layout
@using Smart.Blazor
		 

Tip: You can explore other components like Grid, ListBox, and Input in the Smart.Blazor documentation.

Deployment

Blazor WebAssembly standalone apps can be deployed as static files to:

• Azure Static Web Apps
• GitHub Pages
• Netlify
• Any static web hosting provider

Conclusion

Blazor WebAssembly allows you to build modern, high-performance web applications using C# and .NET. Combined with Smart.Blazor, you can quickly create rich, interactive user interfaces without writing JavaScript.