Blazor WebAssembly初嘗試

這是一個微軟在推行的新框架,雖然跟三大主流(Angular、Vue、React)相比有點晚起步的感覺,但對於一個嘗鮮工程師,卻是可以練習一下的

學習門檻低
只需要C#、Html、css

可以離線端運行

仰賴SignalR溝通Server

該技術尚未火熱

介紹一下如何使用Blazor WebAssembly

專案建立

點選Blazor WebAssembly

不裝載Asp Net Core,純前端
 

方案總管的情況

本機運行

本機開啟運行,可以看到下載9.06MB 的resources

按下功能按鈕,無往伺服器端溝通的情況

Razor頁面

可以看到有各@code{}框起的範圍,類似JavaScript的使用方式

將本頁面加一個減號動作Countdown,運行觀看

JavaScript能達成的,替換為C#,達成效果

資料參考來源

  1. Blazor Server Vs Blazor WebAssembly
  2. Kat Holder
  3. 官網說明