Blazor now in official preview!

Daniel Roth

Daniel

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

Comments are closed. Login to edit/delete your existing comments

  • Avatar
    Michael Easterbrook

    I have a website built with Razor. How difficult would it be to convert it to Blazor? It uses C# and the backend is SQL Server.

    • Daniel Roth
      Daniel RothMicrosoft employee

      You should first consider if porting your existing app to Blazor is really necessary. Razor today is used for server-side rendering of HTML, while Blazor is intended for client-side web UI. The scenarios are different and complimentary. In ASP.NET Core apps, you can add Blazor components to your existing Razor Pages and MVC Views. There’s no need to rewrite your entire app using Blazor. In many cases, using server-side rendering is simpler and preferable. 

  • Avatar
    jorge arana

    unfortunately I have started learning blazor a week ago, using .net core 3.0 and official blazor preview where it is not possible to connect to a database using Microsoft.EntityFrameworkCore.SqlServer. Before it was very easy to connect in asp.net MVC. Now I see that this is not possible.
    The MSB3073 error appears
    I have seen your comment on github:”The issue you are seeing is due to the IL Linker complaining about a native dependency in your dependency graph (probably from microsoft.entityframeworkcore.sqlserver in this case). Native dependencies will not work when running on WebAssembly (for obvious reasons), so if you want to run client-side then you should clean up your dependencies to just the stuff that can work in a browser.
    I must understand that the case is closed and it is not possible to work with a data server.

    • Daniel Roth
      Daniel RothMicrosoft employee

      Hi Jorge, 

      Blazor for WebAssembly runs client-side in the browser in the normal browser security sandbox. You don’t typically connect directly to your database from the browser. Instead you build an HTTP service on the server that talks to the database that the browser app can then call.

      With server-side Blazor the situation is a bit different because your components are running on the server and can therefor can talk directly to a database. However, with server-side Blazor you also pay the cost on your servers of running the UI for each connected client, so it’s a tradeoff.

      I hope this helps!

  • Avatar
    Hitesh Davey

    Hi Daniel, I understand that C# & VB.NET compilers are based on common compiler platform called “Roslyn” and both languages compile code into common IL for execution; then what is so hard for MS to enable the development of Blazer/Xamarin/cross-platform apps using VB.NET? I am sure the entire VB.NET developer community would be interested to know more about this in detail. Pl don’t disappoint us!

    • Daniel Roth
      Daniel RothMicrosoft employee

      The .NET runtime used by Blazor runs normal .NET assemblies, so you can run code written in VB or other .NET languages from a Blazor app by factoring that code out into separate projects. However, the Blazor app project typically needs to be a csproj because the Razor files used to author components are a combination of C# and HTML that compile to C# classes. We don’t plan to support other languages in Razor files because of the cost involved with supporting multiple versions of the Razor compiler and related tooling.

  • Avatar
    Ra D

    Hi Dan, Blazor looks very promising. Can you include Authentication into .NetCore Preview3 VS2019 templates. I like the Blazor server-side model, it has a simple and clean code layout and foot print; however injecting authentication seem to be a pain so far. Having a solid individual user (user registration) code template would simplify our Blazor development.  Thanks

    • Daniel Roth
      Daniel RothMicrosoft employee

      Absolutely, we’re enabling authentication for Blazor, including enabling the authentication options for the server-side Blazor template, in .NET Core 3.0 Preview6, which ships later this month.

    • Avatar
      Mike-E

      +1 for the server-side WebSocket-based model.  IMO, this is an underrated and under-promoted/marketed feature.  WebAssembly is great and all, but it’s new and carries a lot of unknowns/risk/cost.  Not to mention the payload to download.  Having the ability to drop back into WebSockets is more traditional and familiar.  I’ve been studying Blazor for the past few days around this area and have been very impressed.  For all intents and purposes, .NET is truly back in the browser and all is right in the world again.  Super props, recognition, and respect to the entire team there — especially to Mr. Roth who has done an excellent job engaging customers and developers here on the blog and in GitHub.

  • Avatar
    Agung Buana

    I just downloaded vs 2019 16.2 preview 2 and netcore 3 preview6. I couldn’t find Razor Components template. So what is the official name of the template? is it Blazor (server-side) now?

    • Daniel Roth
      Daniel RothMicrosoft employee

      Correct, the Razor Components template was renamed to “Blazor (server-side)”.

      Also, just a heads up, we plan to rename it again (last time, I promise!) to Blazor Server App in a future update.

  • Mohammad M
    Mohammad M

    You guys are doing such an amazing job. 
    Much appreaciated 
    Thanks a lot.