ASP.NET’s RazorComponent model is intuitive and brings productivity to web development. In this session we’ll learn how RazorComponents aren’t just for Blazor apps and how we can integrate the best part of Blazor with existing ASP.NET applications using: Razor Pages, MVC, and even other front-end technologies.
Blazor from MVC, Blazor from Razor Pages
Because Blazor is part of ASP.NET Core it is possible to mix UI frameworks such as: ASP.NET MVC (Razor Views), Razor Pages, and Blazor. ASP.NET Core’s modular middleware system configures how ASP.NET Core responds to requests and routing, this means we can opt into each UI framework and several routing options.
For instructions on setting up Blazor in an existing app, you can look at the official docs.
The following example application uses a different configuration which predates the documentation linked above. This configuration reuses the existing application’s layout making it easier to transition code to Blazor without duplicating the main applications layout and instead uses a _Host.cshtml file to host Blazor (vs. App.razor).
This example also includes usage of the
<component> tag helper. The
<component> tag helper allows Razor Views and Pages to display Blazor content. The example incorporates both Telerik UI for Blazor and Telerik UI for ASP.NET Core. The Telerik UI libraries work together with seamless theme capabilities, and support for .NET 8. The Telerik UI libraries require a license to run the application, a free trial of Telerik DevCraft is available.
Blazor from Angular, Blazor from React
This example uses the ASP.NET Core React template and Blazor Custom Elements to render a Blazor element from React.
This example uses the ASP.NET Core Angular template and Blazor Custom Elements to render a Blazor element from Angular.
Another .NET Conf session covered React Migration in detail. If you are coming from a React application to ASP.NET Core then this session will be interesting to you.
Blazor from WebForms
Similar to the approach above that uses Blazor Custom Elements, WebForms can also take advantage of this technology. Using Blazor Custom Elements in addition to the System Web Adapaters library and a YARP proxy a Razor Component can be rendered within a WebForms app. This is a nice stepping stone in migrating existing WebForms apps to Blazor.
If you’re interested in rewriting your app from scratch using Blazor instead of migrating piecemeal, then give the Blazor Migration workshop using Telerik UI for Blazor a try.
Blazor from Web API
Razor Components can also be rendered directly from Web API, docs on how this is accomplished can be found below.
Telerik UI for Blazor
Make sure you check out the full range of capabilities possible with Telerik UI for Blazor. There are over 100 components to help build your next Blazor app. In addtion, Telerik UI for Blazor includes scaffolding tools, document processing libraries, theme options, and templates to enhance productivity.
.NET 8 Day 1 Support
Progress Software is proud to announce that multiple Telerik products support NET 8 on day 0! Get started using the next generation of .NET today with support from Progress.