♥️
Razor Pages and MVC
Use familiar, server-side rendering strategy that has been a foundation of .NET web development for many years.
Create .NET apps with SPA feeling without JS
Bring stateful and reactive components to ASP.NET Core without writing JavaScript
<!-- NameForm.cshtml -->
@model NameForm
<div>
<input asp-for="Name" bind:keydown />
<div>Hello @Model.Name</div>
</div>
<!-- NameForm.cshtml -->
@model NameForm
<div>
<input asp-for="Name" bind:keydown />
<div>Hello @Model.Name</div>
</div>
// NameForm.cs
public class NameForm : HydroComponent
{
public string Name { get; set; }
}
// NameForm.cs
public class NameForm : HydroComponent
{
public string Name { get; set; }
}
<!-- NameForm.cshtml -->
@model NameForm
<form on:submit="@(() => Model.Save())">
<input asp-for="Name" bind />
<span asp-validation-for="Name"></span>
<button type="submit">Save</button>
@if (Model.Message != null)
{
<div>@Model.Message</div>
}
</form>
<!-- NameForm.cshtml -->
@model NameForm
<form on:submit="@(() => Model.Save())">
<input asp-for="Name" bind />
<span asp-validation-for="Name"></span>
<button type="submit">Save</button>
@if (Model.Message != null)
{
<div>@Model.Message</div>
}
</form>
// NameForm.cs
public class NameForm : HydroComponent
{
[Required, MaxLength(50)]
public string Name { get; set; }
public string Message { get; set; }
public void Save()
{
if (!Validate())
{
return;
}
Message = "Success!";
Name = "";
}
}
// NameForm.cs
public class NameForm : HydroComponent
{
[Required, MaxLength(50)]
public string Name { get; set; }
public string Message { get; set; }
public void Save()
{
if (!Validate())
{
return;
}
Message = "Success!";
Name = "";
}
}
<!-- Counter.cshtml -->
@model Counter
<div>
Count: @Model.Count
<button on:click="@(() => Model.Add(10))">
Add
</button>
</div>
<!-- Counter.cshtml -->
@model Counter
<div>
Count: @Model.Count
<button on:click="@(() => Model.Add(10))">
Add
</button>
</div>
// Counter.cs
public class Counter : HydroComponent
{
public int Count { get; set; }
public void Add(int value)
{
Count += value;
}
}
// Counter.cs
public class Counter : HydroComponent
{
public int Count { get; set; }
public void Add(int value)
{
Count += value;
}
}