Create and execute Blazor WebAssembly projects
environment
- Visual Studio
-
- Visual Studio 2019
- .NET
-
- .NET 5.0
Getting and installing Visual Studio
Use Visual Studio to develop Blazor projects. Learn how to get and set up Visual Studio below.
Other steps can be tedious, but visual studio code also allows you to develop. (I will not explain here.)
Create a Blazor WebAssembly project
Select Visual Studio 2019 from the Start menu. The version is 2019 here, but later versions can also create projects.
Select Create a new project.
If you enter "Blazor" in the search input field above, a list will be displayed, so select "Blazor WebAssembly App" and click the "Next" button.
The project name can be anything, but here we are "BlazorWebAssemblySample". You can create projects wherever you are. The solution name is entered automatically, so you can leave it as is.
The target framework is ". NET Core 3.1 or later. Here is the latest ". NET 5.0" is selected. The rest is left to the default settings. When you are done, click the "Create" button.
The main visual studio window (IDE) is displayed and the project creation is complete. The layout of the window may vary depending on your preferences, but it does not affect development.
The specified folder contains files related to the project. The project does not affect the hierarchy above this folder (outside), so if you no longer need it, you can delete each folder and you can do nothing.
Run (debug execution)
A little sample is completed in the project creation state, so it is possible to execute it as it is. Click IIS Express on the toolbar to run it. A simple web server "IIS Express" is created in your own environment and you can run the Blazor app. This IIS Express exits automatically when you exit debugging.
By the way, blazor WebAssembly debugging runs use the web server only to download apps.
After the build starts and a certain amount of time has elapsed, the build is completed and the web browser starts. You'll see a Web screen, all of which are done by client (except for accessing server resources). While client-side processing for web apps is usually written in Javascript, Blazor can use WebAssembly's mechanism to create them in C#.
Here's how to increase the count each time you click: These non-screen refreshed operations are generally written in Javascript, but they are also implemented in C#.
This is the screen that downloads the JSON file from the server and displays the list.
Stop debugging execution
If the Web browser is launched by itself, closing the web browser will end debugging execution, but if you open it in a new tab in a Web browser that has already been launched, closing the tab will not end the debug run.
If this is the case, click the "Stop Debugging" button from the Visual Studio toolbar.
End of development
Basically, you should exit Visual Studio just like any other project. If any files have not been saved, a save confirmation is displayed.
When you develop again, you can open the "xxxxxxxx.sin" file or open the history when you start Visual Studio, so you can open it from there.