作者介紹
陳超超
Ant Design Blazor 項目貢獻者
擁有十多年從業經驗，長期基於.Net技術棧進行架構與開發產品的工作，Ant Design Blazor 項目貢獻者，現就職於正泰集團
第一次寫專欄，開頭不知道說什么，所以……先來段廣告😁
《進擊吧！Blazor！》是本人與張善友老師合作的Blazor零基礎入門系列視頻，此系列能讓一個從未接觸過Blazor的程序員掌握開發Blazor應用的能力。
視頻地址：https://space.bilibili.com/483888821/channel/detail?cid=151273
本系列文章是基於《進擊吧！Blazor！》直播內容編寫，升級.Net5，改進問題，講解更全面。
系列文章目錄
第一章 初出江湖 —— ToDo應用開發練手
初識 Blazor
Hello Blazor
頁面制作
數據交互
組件開發
安全
第二章 仗劍江湖 —— 企業組織績效數據管理平台開發實戰
項目框架搭建
指標維護：增刪改查
組織機構維護：樹
數據采集：自定義表格
指標分析：Chart
賬號與權限
站點部署
Blazor是什么
Blazor 是一個使用 .NET 生成交互式客戶端 Web UI 的框架。
第一次看到這句話的感受是不是What？.NET和Web UI啥時候在一起了？
現狀
我們暫且先把Blazor放一邊，一起看看目前Web開發的技術棧。
上圖是目前最常用的前后端分離開發模式下所使用的技術棧和配備的人員結構。
我們大家天天按照這個模式進行着各類項目開發，不知道大家在工作中有沒有碰到一下面的問題。
- 技術棧復雜
做一個項目前后端需要用到兩套完全不同的語言，兩套完全不同的框架，不管是對團隊還是對個人無形中增加了技術復雜度和成本。 - 無法重用應用邏輯和代碼
表單驗證，DTO（數據傳輸對象）等代碼需要前端和后端分別寫一份，增加重復勞動，當一端做了修改后，如另一端未能及時更新，一個新鮮的BUG就出現了。 - 資源生態獨立不能共享
當下每一個項目下面都擺着一堆的”輪子“（庫），充分利用第三方資源對開發價值不可估量，但是因為語言問題，前后端的生態資源不能共享。 - 增加協作成本
大家回憶一下，前后端遇到問題時經常熱（hu）情（xiang）交（si）流（bi）的場景歷歷在目，“接口返回格式錯了”，“請求數據缺字段了”，“流程不是這樣的”…………總是有事前沒有想到的問題
如果遇上 “一個不懂后端的前端” vs “一個不懂前端的后端”，簡直就是災難。 - 人員利用率低
每個項目前后端開發量是不平衡的，時常旱澇不定，即影響項目進度，又影響員工心態平衡。
Blazor是什么，由能帶來什么
首先Blazor是微軟最新推出的Web UI框架，目前.Net5中包含的版本已是它第二個可以商用的版本，它的出現就很好的解決上面產生的問題，下面是他部分特性：
- 語言優秀
Blazor 使用 C# 代替 JavaScript 來編寫代碼，因此我們可以使用靜態類型檢查、泛型、Linq、async/await、以及美味的語法糖等所有C#語言的優秀特性。
看到這里，估計不少讀者會有疑問，瀏覽器上能運行C#行嗎？答案是：行！
為了解答這個問題，這里就要介紹Blazor的兩種模式：Blazor WebAssembly和Blazor Server。
- Blazor WebAssembly
這是個單頁應用 (SPA) 框架，使用WebAssembly技術實現無插件的方式在 Web 瀏覽器內運行 .NET 代碼，通過 JavaScript訪問瀏覽器的完整功能。
關於WebAssembly介紹推薦閱讀這篇文章：https://www.smashingmagazine.com/2017/05/abridged-cartoon-introduction-webassembly/
- Blazor Server
將Blazor組件托管在ASP.NET Core服務器上，通過SignalR把UI事件從瀏覽器發送到服務器，並由服務器處理完后將已呈現的組件發送回的客戶端
看似這個模式和當年的ASP.Net Web Forms有些相似，其實他們有着本質的區別
所以雖然.Net代碼托管在服務商執行，但是頁面的響應體驗非常好。
共享生態
可以使用現有的 .NET 庫生態系統。比如EF Core，AutoMapper等優秀的庫可以直接使用。
共享代碼
現在我們可以在服務器和客戶端使用相同的代碼編寫應用邏輯，所以可以直接共享應用邏輯，比如Dto、驗證特性、加密等。
工具完備
在 Windows、Linux 和 macOS 上使用 Visual Studio 保持高效工作。
未來
有了Blazor加持的Web開發的技術棧變成下圖的模式
在這個模式中我們一起看看有什么優勢
- 技術統一
- 應用邏輯和代碼共享
- 共享.Net庫生態資源
- 易於團隊協作
- 靈活調配人員
次回預告
我將通過一個Hello Blazor示例來體驗Blazor項目