Blazor now in official preview!

Daniel Roth

With this newest Blazor release we’re pleased to announce that Blazor is now in official preview! Blazor is no longer experimental and we are committing to ship it as a supported web UI framework including support for running client-side in the browser on WebAssembly.

A little over a year ago we started the Blazor experimental project with the goal of building a client web UI framework based on .NET and WebAssembly. At the time Blazor was little more than a prototype and there were lots of open questions about the viability of running .NET in the browser. Since then we’ve shipped nine experimental Blazor releases addressing a variety of concerns including component model, data binding, event handling, routing, layouts, app size, hosting models, debugging, and tooling. We’re now at the point where we think Blazor is ready to take its next step.

Blazor icon

Simplifying the naming and versioning

For a while, we’ve used the terminology Razor Components in some cases, and Blazor in other cases. This has proven to be confusing, so following a lot of community feedback, we’ve decided to drop the name ASP.NET Core Razor Components, and return to the name Server-side Blazor instead.

This emphasizes that Blazor is a single client app model with multiple hosting models:

  • Server-side Blazor runs on the server via SignalR
  • Client-side Blazor runs client-side on WebAssembly

… but either way, it’s the same programming model. The same Blazor components can be hosted in both environments.

Also, since Blazor is now part of .NET Core, the client-side Blazor package versions now align with the .NET Core 3.0 versions. For example, the version number of all the preview packages we are shipping today is 3.0.0-preview4-19216-03. We no longer use separate 0.x version numbers for client-side Blazor packages.

What will ship when

  • Server-side Blazor will ship as part of .NET Core 3.0. This was already announced last October.
  • Client-side Blazor won’t ship as part of the initial .NET Core 3.0 release, but we are now announcing it is committed to ship as part of a future .NET Core release (and hence is no longer an “experiment”).

With each preview release of .NET Core 3.0, we will continue to ship preview releases of both server and client-side Blazor.

Today’s preview release

New features in this preview release:

  • Templates updated to use the .razor file extension
  • _Imports.razor
  • Scope components with @using
  • New component item template
  • New Blazor icons
  • Blazor support in Visual Studio Code

Check out the ASP.NET Core 3.0 Preview 4 announcement for details on these improvements. See also the Blazor release notes for additional details on this preview release.

Get the Blazor preview

To get started with the Blazor preview install the following:

  1. .NET Core 3.0 Preview 4 SDK (3.0.100-preview4-011223)
  2. The Blazor templates on the command-line:

    dotnet new -i Microsoft.AspNetCore.Blazor.Templates::3.0.0-preview4-19216-03
    
  3. Visual Studio 2019 Preview with the ASP.NET and web development workload selected as well as the latest Blazor extension from the Visual Studio Marketplace, or Visual Studio Code with the latest C# extension (now with Blazor support!).

You can find getting started instructions, docs, and tutorials for Blazor at our new Blazor home page at https://blazor.net.

Blazor home page

Upgrade to the Blazor preview:

To upgrade your existing Blazor apps to the new Blazor preview first make sure you’ve installed the prerequisites listed above then follow these steps:

  • Update all Microsoft.AspNetCore.Blazor.* package references to 3.0.0-preview4-19216-03.
  • Remove any package reference to Microsoft.AspNetCore.Components.Server.
  • Remove any DotNetCliToolReference to Microsoft.AspNetCore.Blazor.Cli and replace with a package reference to Microsoft.AspNetCore.Blazor.DevServer.
  • In client Blazor projects remove the <RunCommand>dotnet</RunCommand> and <RunArguments>blazor serve</RunArguments> properties.
  • In client Blazor projects add the <RazorLangVersion>3.0</RazorLangVersion> property.
  • Rename all _ViewImports.cshtml files to _Imports.razor.
  • Rename all remaining .cshtml files to .razor.
  • Rename components.webassembly.js to blazor.webassembly.js
  • Remove any use of the Microsoft.AspNetCore.Components.Services namespace and replace with Microsoft.AspNetCore.Components as required.
  • Update server projects to use endpoint routing:
// Replace this:
app.UseMvc(routes =>
{
    routes.MapRoute(name: "default", template: "{controller}/{action}/{id?}");
});

// With this:
app.UseRouting();

app.UseEndpoints(routes =>
{
    routes.MapDefaultControllerRoute();
});
  • Run dotnet clean on the solution to clear out old Razor declarations.

Blazor community page is now Awesome Blazor

As part of updating the Blazor site, we’ve decided to retire the Blazor community page and instead direct folks to the community driven Awesome Blazor site. Thank you Adrien Torris for maintaining this truly “awesome” list of Blazor resources!

Try out preview Blazor UI offerings from Telerik, DevExpress, and Syncfusion

Blazor benefits from an active and supportive community that has contributed all sorts of sample apps, components, and libraries to the Blazor ecosystem. Recently popular component vendors like Telerik, DevExpress, and Syncfusion have joined in the fun and shipped previews of Blazor UI components. We encourage you to give these Blazor UI offerings a try and let them know what you think.

Give feedback

We hope you enjoy this latest preview release of Blazor. As with previous releases, your feedback is important to us. If you run into issues or have questions while trying out Blazor, file issues on GitHub. You can also chat with us and the Blazor community on Gitter if you get stuck or to share how Blazor is working for you. After you’ve tried out Blazor for a while please let us know what you think by taking our in-product survey. Click the survey link shown on the app home page when running one of the Blazor project templates:

Blazor survey

Thanks for trying out Blazor!

77 comments

Discussion is closed. Login to edit/delete existing comments.

  • Howard Richards 0

    Does this mean we have a go-live licence for Blazor server-side apps since it’s on .Net core 3

    • Daniel RothMicrosoft employee 0

      .NET Core 3.0 is still in preview as is server-side Blazor. It’s expected to ship in the second half of 2019. But once .NET Core 3.0 is go live that will include server-side Blazor

  • David Walker 0

    Is it possible to include both server side and client side balzor in a single project?

    • Daniel RothMicrosoft employee 0

      Yes, but it’s a bit non-trivial right now (https://github.com/aspnet/AspNetCore/issues/6882). It’s easier right now to have two separate projects for your client-side and server-side Blazor apps that both reference the same components.

  • Adrian Cockburn 0

    Great news!

    You should add that services.AddRazorComponents need to be changed to services.AddServerSideBlazor for server side startup.cs.

  • Ben Hayat 0

    Hi Dan;

    In the last .Net standup session, when you asked steve about the the direction of Auth, he said he is planning to piggypack on the existing [old] Auth system where we have to store user’s data/password in our database and be responsible for it. I’m sure many hackers were pleased to hear that, as lots opportunities will open up.

    That was disturbing to hear as security is very important, and it is still being neglected with the lastest technology from MSFT.

    My humble request is to at least give us an easy and clean way to use Azure B2C in both types of hostings, where we can use B2C from server side rendered code and how to deal with tokens and the client side Blazor to obtain tokens, send it to backend Web API.

    We either need to have a built in system in Blazor or the least a full guideline/best practices how to use Blazor with B2C.

    Thank you for your hard work Dan;
    ..Ben

    • Daniel RothMicrosoft employee 0

      Thanks for this feedback, Ben! It would be great if you could open an issue on the https://github.com/aspnet/aspnetcore repo so that we can track this request came from the community.

        • Ben Hayat 0

          Looks like some folks got scared of my suggestion, so they locked and closed my thread. You speak the truth, and you get kicked out… 🙂

  • Ben Hayat 0

    Hi Dan;

    Are we still missing tooling in the VS19 to create a Blazor page (xys.razor)? The included template to create “Razor” page seems to be creating the ASP.Net razor page and not for Blazor.
    I looked at the roadmap for Preview 6 and didn’t see any mention of this tooling.
    Thanks!
    ..Ben

    • Daniel RothMicrosoft employee 0

      We don’t have a component item template in Visual Studio yet, but we should have it soon. In this release we added the component item template to the .NET Core 3.0 SDK, which will then be used to add the item template in Visual Studio.

  • Anthony Spruyt 0

    Exciting times. Congratulations and looking forward to using Blazor.

  • Raffaello Damgaard 0

    Awesome!

  • Sarathlal Saseendran 0

    Hi, Thanks for the great information. How can we use HttpClient in this new Blazor? Any sample code available?

      • Sarathlal Saseendran 0

        Thank you very much Dan for the reply. One more doubt, for HttpClient, I have to use Blazor client template separately. right? That is the separate Blazor version 0.9, correct? Then what is the exact usage for this Blazor inclusion in Dotnet core 3.0 preview?

  • Jeremy Knaggs 0

    This is seriously fantastic. I’m really thinking this type of tech will be what brings about the next era of web development. Keep up the fantastic work and a million thanks to entire Blazor team!

  • æ–°æ°‘ 黄 0

    Why not give Server-side Blazor a brand new and unique name, such as Blazerver (Blazor + Server), this makes it short and recognizable, and the new name mostly helps when developers use search engine to solve problems. 
    And Client-side Blazor can named Blazent also. 🙂

Feedback usabilla icon