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

ASP.NET Team Blog
11 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!

Free DevExpress Products - Get Your Copy Today

The following free DevExpress product offers remain available. Should you have any questions about the free offers below, please submit a ticket via the DevExpress Support Center at your convenience. We'll be happy to follow-up.
No Comments

Please login or register to post comments.