Architecture (Blazor)
This help article describes the structure and architecture of the typical Radzen client-side (WebAssembly) and server-side Blazor application.
Project structure
The Radzen server-side Blazor application has two top-level directories:
The Radzen client-side (WebAssembly) Blazor application has three top-level directories:
The meta directory contains JSON files that describe the application structure - data sources, pages, assets.
Server-side Blazor project
The server directory contains the server-side Blazor application. Radzen generates the contents of the server directory from the JSON files found in the meta directory.
The server\Data directory contains Entity Framework Core context classes. Radzen uses Entity Framework Core to connect to databases.
The server\Models directory contains model classes generated from the application data sources - database tables, REST responses etc.
The server\Pages directory contains Razor pages which Radzen has generated.
<page-name>.razor- the page markup - HTML and Blazor tags. This file is generated every time you run the application for Radzen. Any changes made to this file will be overwritten.<page-name>.razor.cs- C# partial class that is empty by default. This file is generated only once. Used for custom code.<page-name>.razor.designer.cs- C# class that implements the Blazor component - handles UI component events (e.g. button clicks), loads data, etc. This file is generated every time you run the application for Radzen. Any changes made to this file will be overwritten.
The server\Services directory contains service classes that communicate with a data source.
Client-side Blazor project
The server directory contains the server-side ASP.NET Core OData WebAPI application. The client directory contains the client-side (WebAssembly) Blazor application.
The server\Data directory contains Entity Framework Core context classes. Radzen uses Entity Framework Core to connect to databases.
The server\Models directory contains model classes generated from the application data sources - database tables, REST responses etc. They are shared/imported in the client-side (WebAssembly) Blazor project as well.
The client\Pages directory contains Razor pages which Radzen has generated.
<page-name>.razor- the page markup - HTML and Blazor tags. This file is generated every time you run the application for Radzen. Any changes made to this file will be overwritten.<page-name>.razor.cs- C# partial class that is empty by default. This file is generated only once. Used for custom code.<page-name>.razor.designer.cs- C# class that implements the Blazor component - handles UI component events (e.g. button clicks), loads data, etc. This file is generated every time you run the application for Radzen. Any changes made to this file will be overwritten.
The client\Services directory contains service classes that communicate with a data source.
Most of the generated classes are partial (EF contexts, models, services and pages). You can use partial methods to customize the default behavior. More info is available in the customization article.
FAQ
Here is a quick FAQ regarding Blazor support in Radzen:
Does Radzen support client-side or server-side Blazor?
Radzen supports both client-side (WebAssembly) and server-side Blazor applications.
Can I migrate my existing Radzen Angular application to Blazor?
Not automatically. Radzen can still scaffold the same database and create a fully working Blazor application.
What UI components are you using in Radzen Blazor applications?
We are developing a brand new suite of native Blazor components. Native means that we don’t wrap existing JS libraries - everything is 100% Blazor code compatible with Blazor data-binding, templates and event handling.
When will component X be available in Radzen Blazor applications?
We will gradually implement the remaining components from the Radzen toolbox.