Migrating from Radzen

Note

This article is meant for existing Radzen users. New Radzen Blazor Studio users should check the other resources instead.

Radzen Blazor Studio is our vision of how rapid Blazor application development should look like. There are some changes compared to Radzen Studio (a.k.a. Radzen) which are described in this article. Be sure to check the first before proceeding to the migration instructions.

Changes

Support for arbitrary Blazor applications

Radzen supports only applications created with it. This changes with Radzen Blazor Studio as it can open applications created by any tool - Visual Studio, the dotnet CLI and Radzen.

Automatic save

Radzen saves the current file on every change.

Radzen Blazor Studio does not save automatically. The developer has to save the file which is currently being edited. Radzen Blazor Studio saves all open files when you run the application.

Customize everything

Radzen is very strict about code customizations - the developer relies on partial classes or has to use the code generation ignore list which in turn disables the WYSIWYG designer.

Radzen Blazor Studio supports arbitrary code customizations without breaking the design time experience. Everything just works without additional hoops.

Code generation

Radzen generates code on every build. The actual UI is persisted in JSON files in the meta directory of the application. While this approach has its advantages Radzen Blazor Studio makes it obsolete. It does not generate code on every build and does not need additional metadata files.

Code editing

Radzen Blazor Studio has a built-in code editor with syntax highlighting, autocomplete and analysis.

Debugging

Radzen Blazor Studio has a built-in debugger.

Third party support

Radzen Blazor Studio supports third party component libraries as well as the built-in Blazor components.

Build errors

Radzen could in some cases display a page in design time even if the project itself has build errors and cannot run.

Radzen Blazor Studio requires the application to build and run successfully in order for design time to work.

Conceptual changes

We have made a few conceptual changes to make Radzen Blazor Studio feel more native to Blazor developers and to avoid introducing new terms.

Actions vs. Statements

The developer uses actions in Radzen to respond to user input, execute custom code or perform a DB query - set a property, invoke a data source method, navigate to a page.

Radzen Blazor Studio replaces this concept with methods and statements - the developer can use the new UI to visually edit the statements of a method, override Blazor lifecycle methods and create new methods. Some of the Radzen actions are available as Radzen Blazor Studio statements - invoke method, open dialog, set property etc. Some actions have been removed - invoke data source method is replaces by invoke method.

Expressions

Radzen uses ${} blocks to embed data in the UI e.g. ${customer.FirstName}. This is translated to @ during code generation - @customer.FirstName.

Radzen Blazor Studio does not use ${} blocks and does not recognize them. It relies on the native Blazor @ expressions only.

Template context

Radzen uses the special data implicit variable for the current template context. This is translated to context during code generation.

Radzen Blazor Studio relies on the Blazor default context.

Pages and Layouts vs. Files

In Radzen the developer works with pages and layouts. Radzen generates code in different files.

Radzen Blazor Studio behaves similar to a traditional IDE such as Visual Studio and lists all files in the application - .razor, .cs, .css, .js etc.

Page Load event

Radzen has a synthethic (not native to Blazor) event called Load. It is the rough equivalent of the OnInitializedAsync lifecycle method.

Radzen Blazor Studio no longer supports such synthethic events. The developer has to override one of the built-in Blazor lifecycle events instead e.g. OnInitializedAsync or OnInitialized.

Page properties

Radzen creates a property the first time the Set property action is used. This often feels like “magic”. It also initializes property values in the OnInitializedAsync method.

Radzen Blazor Studio requires explicit property declaration. Initial values are set at the time of declaration.

Page parameters

Radzen creates a parameter when a page is used from another page via Navigate or Open dialog action. There isn’t a way to explicitly declare a parameter.

Radzen Blazor Studio requires explicit parameter declaration.

Bootstrap version

Radzen applications use Bootstrap 4 by including a theme CSS file that bundles it.

New Radzen Blazor Studio applications use Bootstrap 5 as a standalone CSS include and use the base Radzen.Blazor themes.

UI look and feel

New pages and applications created with Radzen Blazor Studio have refreshed and improved look and feel. If you add pages to your existing Radzen application you may see visual difference compared to existing ones.

Partial files

Radzen applications have three files per page - Page.razor, Page.razor.designer.cs and Page.razor.cs.

New Radzen Blazor Studio applications have only two files (if partial classes is checked in the UI): Page.razor and Page.razor.cs. If you add new pages to existing Radzen application from Radzen Blazor Studio it will use the three file layout as before for compatibility reasons.

Custom themes

Radzen applications save custom themes as a CSS file by generating it from the source SASS.

Radzen Blazor Studio applications customize themes by overriding the corresponding CSS variables. The original theme CSS remains intact.

WebAssembly Security

WebAssembly applications created with Radzen used IdentityServer when configured for Default security. IndentityServer is no longer free for commercial use.

WebAssembly applications created with Radzen Blazor Studio no longer use IdentityServer. Enabling security for an existing Radzen application via Radzen Blazor Studio would migrate it to the new implementation.

Migrating

Migrating a Radzen application to Radzen Blazor Studio should be a straight-forward procedure. Follow these steps:

1. Open the existing Radzen application in Radzen Blazor Studio

Open the .sln file of your Radzen application in Radzen Blazor Studio. The application should build and run normally. Design time preview should also be available.

Important

If Radzen Blazor Studio cannot open your Radzen application in design time contact us at info@radzen.com.

2. Reapply the theme

If you are using a premium theme it is a good idea to reapply it to get the latest version. Pick a different theme and then again the one you were using.

If you are using a customized theme it is a good idea to reapply the changes.

3. WebAssembly security

If your application is Blazor WebAssembly and using security be aware of an important change: Radzen Blazor Studio does not use IdentityServer any more. If you decide to add security to your existing Radzen application you are likely to encounter errors. This is why we recommend one of the following instead:

Keep the existing IdentityServer security and never add security from Radzen Blazor Studio for this application.
Open the application in Radzen and remove security from the security option (set it to None). Then open the application in Radzen Blazor Studio and add security to use the newer implementation. You may have to add users and roles.

4. Ensure your application runs as expected

Test your application and make sure it works - try a few CRUD screens, security etc.

Angular applications

Radzen Blazor Studio cannot open Angular applications created with Radzen. We recommend creating a new application in Radzen Blazor Studio and scaffolding the application database. This will not migrate any custom code you may have but is a good start.

Final thoughts

Radzen Blazor Studio uses the existence of the meta directory to determine if it is opening a Radzen application and acts accordingly. For example it generates three files per page instead of two and hides the ability to create pages without code behind (partial class).

Changes made with Radzen Blazor Studio will not be recognized by Radzen and may get overwritten after code generation so be careful. We

Important Deleting the meta directory makes your application incompatible with Radzen. Do so only if you are 100% sure you will no longer use Radzen 2.x.

By Initiative