Version: 19.2.2
Copyright © 2006-2020 Developer Express Inc

DevExpress UI Components for Blazor

The DevExpress UI components featured in this demo are available for free download and can be used in your next Blazor app.

Review our GitHub Guide for details on how to set up your environment.

How to run this demo on your machine

  1. Ensure that you have .NET Core 3 installed.
  2. Download the "demo" and "tools" directories from the GitHub repository.
  3. Open demo/BlazorDemo.ServerSide/BlazorDemo.ServerSide.sln in Visual Studio 2019.

  4. Go to nuget.devexpress.com, log in or sign up and click Obtain Feed URL. This redirects you to a page's section that displays a development account's NuGet Feed URL.

    Register the DevExpress NuGet feed in Visual Studio's NuGet Package Manager.

    https://nuget.devexpress.com/{your feed authorization key}/api

    See the Setup Visual Studio's NuGet Package Manager topic for more information.

  5. Start the application.
See also:

How to create a new project

Follow the steps below to try our Blazor in your own application.

  1. Create a new solution using the "Blazor App" template in Visual Studio 2019.

  2. Go to nuget.devexpress.com, log in or sign up and click Obtain Feed URL. This redirects you to a page's section that displays a development account's NuGet Feed URL.

    Register the DevExpress NuGet feed in Visual Studio's NuGet Package Manager.

    https://nuget.devexpress.com/{your feed authorization key}/api

    See the Setup Visual Studio's NuGet Package Manager topic for more information.

  3. Install the "DevExpress.Blazor" NuGet package.
  4. Build the project.

  5. Link the following file to your layout’s HEAD section:

    • For server-side Blazor, add the line below to the _Host.cshtml file.

      
<head>
    ...
    <link href="_content/DevExpress.Blazor/dx-blazor.css" rel="stylesheet" />
</head>

    • For client-side Blazor, add the line below to the Index.cshtml file.

      
<head>
    ...
    <link href="_content/DevExpress.Blazor/dx-blazor.css" rel="stylesheet" />
</head>

      Call the AddDevExpressBlazor(IServiceCollection) method from your project's Startup.ConfigureServices() method:

      
using Microsoft.Extensions.DependencyInjection;

public class Startup {
    public Startup(IConfiguration configuration) {
        Configuration = configuration;
    }

    public IConfiguration Configuration { get; }

    public void ConfigureServices(IServiceCollection services) {
        ...
        services.AddDevExpressBlazor();
    }
}
  6. Register our tag namespace and helper in _Imports.razor file: 
    
@using DevExpress.Blazor
  7. Your application is ready to use DevExpress UI for Blazor.
See also:

Included Demo Modules
An error has occurred. This application may no longer respond until reloaded. Reload 🗙