To develop Blazor Web Assembly project on Ubuntu, first we need to install Visual Studio Code. Next, we need to add .NET Core repository and dependencies.

wget -q https://packages.microsoft.com/config/ubuntu/18.04/packages-microsoft-prod.deb -O packages-microsoft-prod.deb
sudo dpkg -i packages-microsoft-prod.deb

Install .NET Core SDK

sudo add-apt-repository universe
sudo apt-get update
sudo apt-get install apt-transport-https
sudo apt-get update
sudo apt-get install dotnet-sdk-3.1

Install the ASP.NET Core runtime

sudo add-apt-repository universe
sudo apt-get update
sudo apt-get install apt-transport-https
sudo apt-get update
sudo apt-get install aspnetcore-runtime-3.1

Install the .NET Core runtime

sudo add-apt-repository universe
sudo apt-get update
sudo apt-get install apt-transport-https
sudo apt-get update
sudo apt-get install dotnet-runtime-3.1

By now you should have .NET Core properly installed in your system. To test it, run the following command:

dotnet

It should return something like below:

Usage: dotnet [options]
Usage: dotnet [path-to-application]

Options:
  -h|--help         Display help.
  --info            Display .NET Core information.
  --list-sdks       Display the installed SDKs.
  --list-runtimes   Display the installed runtimes.

path-to-application:
  The path to an application .dll file to execute.

Next, we are going to install the Blazor Web Assembly project template by executing this command:

dotnet new -i Microsoft.AspNetCore.Blazor.Templates::3.1.0-preview4.19579.2

Now, let’s create a new Blazor Web Assembly project called HelloBlazor by executing this command:

dotnet new blazorwasm -o HelloBlazor

Folder HelloBlazor is now created. To start modifying the project, run below commands:

cd HelloBlazor
code .

Visual Studio Code will be launched and automatically opened HelloBlazor project.

To build the project, you can utilize Visual Studio Code’s terminal by pressing Ctrl + ` (hold Control key and back-tick together). Inside the terminal, execute this command:

dotnet build

You should have output similar to below:

Microsoft (R) Build Engine version 16.4.0+e901037fe for .NET Core
Copyright (C) Microsoft Corporation. All rights reserved.

  Restore completed in 48.35 ms for /home/hardono/Projects/DotNetCore/Blazor/HelloBlazor/HelloBlazor.csproj.
  HelloBlazor -> /home/hardono/Projects/DotNetCore/Blazor/HelloBlazor/bin/Debug/netstandard2.1/HelloBlazor.dll
  HelloBlazor (Blazor output) -> /home/hardono/Projects/DotNetCore/Blazor/HelloBlazor/bin/Debug/netstandard2.1/dist

Build succeeded.
    0 Warning(s)
    0 Error(s)

Time Elapsed 00:00:14.92

To publish the project, run command below:

dotnet publish

You should have output similar to below:

Microsoft (R) Build Engine version 16.4.0+e901037fe for .NET Core
Copyright (C) Microsoft Corporation. All rights reserved.

  Restore completed in 46.59 ms for /home/hardono/Projects/DotNetCore/Blazor/HelloBlazor/HelloBlazor.csproj.
  HelloBlazor -> /home/hardono/Projects/DotNetCore/Blazor/HelloBlazor/bin/Debug/netstandard2.1/HelloBlazor.dll
  HelloBlazor -> /home/hardono/Projects/DotNetCore/Blazor/HelloBlazor/bin/Debug/netstandard2.1/publish/

For my case, the static files was generated at /home/hardono/Projects/DotNetCore/Blazor/HelloBlazor/bin/Debug/netstandard2.1/publish/HelloBlazor/dist/ as shown below:

Now you can upload these files and folders to your Linux/Windows server. No .NET runtime is required on the server, but the client’s browser requires Web Assembly support (all modern browsers have it, btw). I’ve uploaded mine here. Check it out HERE.

But goodness me, Blazor Web Assembly project has quite big download size.

A total of 6.6 MB of resources need to be downloaded!

That’s it for now, I hope it helps. Cheers!

Incoming Search

.net core, blazor, c#, linux, ubuntu