Setup, Build and Run Blazor WebAssembly App w/.NET Server on Linux

Download a supported desktop version of Ubuntu from here and install it (or another flavor of Debian Linux).

First, install Google Chrome for Linux (https://www.google.com/chrome/). It is used by the Visual Studio Code debugger.

Install .NET Core 3.1 SDK

.NET 5 is too unstable to use. Wait for .NET 6. To install .NET Core 3.1 on the Ubuntu machine, issue these commands (replacing 20.04 with the correct Ubuntu version) from a directory with write permissions (skip to VSCode installation steps):

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

Then issue this command:

sudo apt-get update; \
sudo apt-get install -y apt-transport-https && \
sudo apt-get update && \
sudo apt-get install -y dotnet-sdk-3.1

Install Visual Studio Code

Skip to the Blazor project creation steps.

Download Visual Studio Code (https://code.visualstudio.com/download) and install it.

Configure Visual Studio Code Extensions

Install C# by OmniSharp.

Install .NET Install Tool for Extension Authors.

Install Blazor WASM Debugging Extension.

Install the NuGet Gallery.

Create the Blazor WebAssembly Client and Server Projects

From the terminal, go to or create a directory in the home directory where the project's directory is to be created. Issue this command to create projects for the WASM client, WEBAPI REST server and a project shared between the two. DO NOT USE sudo TO ISSUE THIS COMMAND:

dotnet new blazorwasm -o BlazorWasmApplication1 -ho

Open Visual Studio Code

  1. Open the Visual Studio Code application and open the directory/folder that was created by the above dotnet command.
  2. When VSCode requests to add assets to build and debug the project, choose YES.
  3. Visual Studio Code should ask for the project to launch. Choose the server project.

Build the project by using the terminal window in VSCode. The server project relies on the other two projects to run, so change to the "Server" directory and issue this command to build all three projects:

dotnet build

Hit Ctrl+F5 to run the application. Chrome should warn that the site is not secure because the certificate is not from a trusted source. Click on the "Advanced" button to proceed to the Blazor app.

After accepting the security risk, this should be the result.

Publish the Project

Open a terminal window in Visual Studio Code and issue this command to publish the project:

dotnet publish -o output-directory-name

Contained in the output directory will be all the compiled server and Blazor WASM client files of the application.

Procedure Recap

  1. Install UBUNTU Linux desktop
  2. Install Google Chrome
  3. Install .NET Core 3.1 (because it is stable)
  4. Install Visual Studio Code
  5. Configure Visual Studio Code extensions
  6. Create the WASM and server Projects
  7. Open the folder for the three projects with Visual Studio Code
  8. Accept to add assets to the project when asked by VSCode
  9. Choose the project to launch with in VSCode
  10. Build the projects
  11. Run the application
  12. Publish the application

Cookies are simple text files stored on the user's computer. They are used for adding features and security to this site.
OK