DevExpress UI for Blazor - What's new in Preview 5

ASP.NET Team Blog
10 May 2019

Preview 5 of the DevExpress UI for Blazor is now available. It includes support for ASP.NET Core 3 Preview 5 and also two new Blazor components!

Support for ASP.NET Core 3 Preview 5

The Blazor team at Microsoft are releasing updates at a rapid pace as they get closer to the September .NET Core 3.0 final release. For example, Microsoft released the ASP.NET Core 3 Preview 5 only a few days ago.

So I'm happy to report that our latest Blazor release supports the ASP.NET Core 3 Preview 5 update. For simplicity, we're calling our Blazor update Preview 5 too. Our Blazor Nuget package also uses a similar versioning system:

.NET Core 3.0 version DevExpress.Blazor.nuget version
.NET Core 3.0 Preview 3 0.0.3
.NET Core 3.0 Preview 4 0.0.4
.NET Core 3.0 Preview 5 0.0.5

This lets you quickly see the version compatibility with the .NET Core preview versions.

New Components

We're also introducing two new Blazor components: Form Layout and Tabs! This brings us to a total of nine powerful DevExpress Blazor components before we've even reached our upcoming v1.0 release.

Remember, all of our Blazor components are native and written exclusively for the Blazor framework. Now, let's take a look at the new components:

New Form Layout Component

The DevExpress Form Layout component for Blazor helps you to easily create edit forms which are responsive and automatically-aligned:

This component uses the responsive features provided by the underlying Bootstrap framework. We've also added functionality to align the labels and editors on the form.

Save time by using our Blazor Form Layout component to create simple or complex form layouts.

Check out the online demo: DevExpress Blazor UI - Form Layout Demo

New Tabs Component

We've also added the new Tabs component to our set of Blazor components:

DevExpress Blazor - Tabs

With our Tabs component, you can provide views with a simple tab strip or use it as a navigation component made up of multiple tabbed pages.

Test drive the online demo here: DevExpress Blazor UI - Tabs Demo

Blazor Name Change - Breaking Changes

In a previous update, Microsoft announced the following:

  • Client-side Blazor on WebAssembly now in official preview
  • Razor Components renamed back to server-side Blazor

First, dropping the 'experimental' label on client-side Blazor is good news as it shows the progress they're making. However, client-side Blazor is still not officially recommended by Microsoft.

Note: While not recommended, they do use client-side Blazor on one known production website: Try .NET. You can hear the story of "Try .NET" directly from the Microsoft Blazor PM, Dan Roth. Simply sign up for our upcoming Blazor webinar.

Microsoft also renamed "Razor Components" back to "server-side Blazor". Now Blazor's hosting models will be known as "Blazor (client-side)" and "Blazor (server-side)". Therefore, we've also decided to standardize on "Blazor" for our components too.

Honestly, I prefer this name change because it's simpler. But, it has created a few breaking changes. To address these issues we've made the following changes in this Preview 5 release:

  1. We've changed the namespace from DevExpress.RazorComponents to DevExpress.Blazor
  2. We've also changed the NuGet package name from DevExpress.RazorComponents to DevExpress.Blazor
  3. The DevExpress.RazorComponents.dll assembly has been renamed to DevExpress.Blazor.dll
  4. These two static resources have been appropriately renamed too:
    • dx-razor-components.css -> dx-blazor.css
    • dx-razor-components.js -> dx-blazor.js
  5. The demo site is now located at: https://demos.devexpress.com/blazor/
  6. Microsoft's preview 5 has changed the Blazor template structure. Before, you needed to register the namespace and tag helpers in the /Components/_ViewImports.cshtml file. Now, you'll need to register from the _Imports.razor file, but you'll only need to register the namespace: @using DevExpress.Blazor

Updated Guide and Demo Project

To see the changes mentioned above, please take a look at our updated github demo project and "How to create a new project" guide.

There's also a set of "Getting Started" training videos which help you learn about the Blazor framework.

Download the preview from NuGet

If you wish to test the DevExpress UI for Blazor, download the DevExpress.Blazor.nupkg from the DevExpress NuGet Early Access feed. Once you've added this feed to Visual Studio 2019, you'll see the DevExpress.BlazorComponents package:

This preview is made available under the DevExpress Preview end-user license. To gain access to the build free of charge, you will need a DevExpress.com account. You can either create a free account to test our NuGet package or you can get a free 30-day trial of all our components.

Join the Webinar

Sign up for the upcoming "Blazor - Getting Started" webinar:

Join Dan Roth, Microsoft PM for Blazor, and Mehul Harry, DevExpress Web PM, to learn about how to get started with Blazor. Dan will explain the fundamentals, discuss client vs. server, introduce the roadmap, and create a simple Blazor app. Mehul will then demonstrate the new Developer Express Blazor controls and go into the roadmap for our future Blazor development. Finally they will manage a Q&A session with the attendees. Don't miss this extensive webinar about the exciting Blazor framework!

Register today

Give us your feedback

Although we have many plans for more components within this new ecosystem, as with all of our future projects we rely on feedback from you, our customers, on what we should be looking at and considering. Send us emails, open up support tickets, let us know.

Along those lines, please take a moment to complete this short survey:

Thanks!

8 comment(s)
Mojo
Mojo

Blazor is the most exiting feature I've seen in a long time.

10 May, 2019
Manuel Grundner [DevExpress MVP]
Manuel Grundner [DevExpress MVP]

Awesome :)

11 May, 2019
Dalibor Stys
Dalibor Stys

Keep up the great work :) We are looking forward to test your (client-side) components with preview 5 :)

11 May, 2019
Peter CaoZheng
Peter CaoZheng

Good!

11 May, 2019
Gabriel Phaiphai
Gabriel Phaiphai

Great,

Under which subscription will "DevExpress UI for Blazor" be under when it comes out?

Regards

12 May, 2019
Stephen J White
Stephen J White

Oh sweet, you added the layout control. Wow, that was fast. Man, you guys rock!

12 May, 2019
Blago Culjak
Blago Culjak

Hy there Mehul. I just wanted to thank you and Microsoft for keeping an eye on developers that around for long time, developing Desktop apps, and for those people who didn't get on new Javascript train. Now we have an opportunity - to stay relevant.

That being said, I have been testing and using Blazor with Devexpress, and altogether gained some insight last couple of months.

First of all, hope you will get that grid much nicer, it looks like something from first version on Bootstrap. I also hope that theming will be added later.

So far Blazor on server side loaded quickly and I seems light.

Learing curve for Blazor is not that steep, although if someone didn't develop MVC/Razor apps, curve will be steeper.

Lastly, I hope that gap between Devextreme and Blazor components can be managed in reasonable time, since to make some app to production I need reports and dashboards. I know that you have your own roadmap, I just keep saying my experince.

Thanks again.

13 May, 2019
Marco Kummer
Marco Kummer

For anyone being excited about Blazor.. I don't mean to be a party-pooper, but I have decided to ignore Blazor for the next few years due to the following considerations:

1. Javascript interop is terrible within Blazor when compared to mature products like Bridge.NET

2. The open source web community has a tradition of rejecting everything that has a touch of being monolithic and proprietary... which Blazor clearly is. That's why Microsoft will never win over "regular" full stack developers to Blazor. Once again, a product like Bridge.NET makes a lot more sense, as it only addresses one problem (C# in the browser), while still allowing room for all existing and great UI frameworks like angular, Vue, etc.

3. The open source web community clearly prefers UI frameworks that use HTML5 compliant attributes and custom tags (components), such as angular, vue etc. Blazor - being a Razor spinn-off - grossely violates this principle by introducing custom @syntax not recognizable by standard HTML editors / WYSIWYG design products. While this was acceptable for server-side processing (like PHP), I don't think it belongs in a client-side SPA.

4. Microsoft once proclaimed that Silverlight will be the clear standard way to go, replacing flash and javascript. Need I say more? Ok, then try: Winforms, WPF, Universal plattform, Windows Phone, WCF... I don't mean to bash Microsoft, I love their products, obviously. But a colleague of mine once summarized it so perfectly: With Microsoft, you have to stick to the absolute core libs and skip everything that is remotely specialized, as it will be abandonded shortly after.

5. Mono for WASM is immature and slow in loading. AFAIK essential features are still missing, like AoT compilation and garbage collection. That's no reason to ignore the product, but it might just have been a good reason for MS to hold off on making Blazor an official framework, which they have.

6. Did I mention the fact that Bridge.NET has offered highly performant, reliable and configurable support for C# in the browser? And that they don't depend on WASM, therefore providing compatibility with virtually every JS device and browser out there? And that their product has matured over more than 4 years? Within my company we have developed HUGE SPA apps using C# with Bridge.NET, and we see absolutely no need to switch a substantially slower and less flexible Blazor.

BTW, I'm in no way affiliated with Bridge.NET; but I do feel that the community is ignoring the product for no justified reason while praising something that is still completely immature.

22 May, 2019

Please login or register to post comments.