[{"_1":2,"_46":-5,"_47":-5},"loaderData",{"_3":4,"_14":15,"_44":-5,"_45":-5},"root",{"_5":-5,"_6":-5,"_7":-5,"_8":9,"_10":11},"user","shoppingCartId","toast","locale","en","constants",{"_12":13},"paypalClientId","AenrHU49peF-ZUH-Yq7AXLLNZYGUGlml474U16NCjB4ZznmQCEjiliN3whyuVZmkb7VxEzmTALgtKEKE","routes/_store+/_readers+/email_author.$slug/route",{"_16":17,"_43":-5},"book",{"_18":19,"_20":21,"_22":23,"_24":25,"_26":27,"_28":29},"id","Z2lkOi8vbGVhbnB1Yi9TdG9yZTo6Qm9va1Byb2R1Y3QvMzI1MzY","title",".NET 6.0 Blazor Server 開發快速體驗","state","published","contactAuthorMethod","email","aboutText","

關於本電子書

這是一本帶領對於 Blazor Server 有興趣的新手開發者，可以快速體驗這個微軟最新的網頁開發框架技術的開發過程教學，在這本書中，將不會講解枯澀的相關技術內容，而是設計一個應用情境，也就是一般常用的 CRUD (新增 Create, 查詢 Retrive, 更新 Update, 刪除 Delete) 的部落格文章管理應用程式需求開發，從無到有的帶領讀者透過 Visual Studio 2022 這個開發工具，設計出的 Blazor Server 伺服器端的這樣應用程式。

所以，購買本書的讀者，將會強烈建議讀者要跟著本書的內容，逐一進行專案的設計與練習，在每個練習階段，都會有不同要帶給讀者的學習方向；透過這樣的練習開發過程，就會明瞭 Blazor Server 這個開發框架技術究竟可以做到什麼樣的強大功能；這本書提供一個動手練習實作的說明操作步驟，體驗 Blazor 專案開發過程。因此，若您沒有這樣的興趣或者這樣的需求，請不要購買這本書。

因此，當讀者完成所有的專案練習開發，相信您對於 Blazor Server 這個優秀的開發框架必定有更清楚的認識，了解到不需要使用到繁雜的 JavaScript 程式語言，僅使用 Blazor 就可以做到那些網站設計上的功能。

這本書能提供什麼

在這本書裡面，將會提供 9 章的內容，分別是

建立 Blazor Server Side 伺服器端的專案

了解如何透過 Visual Studio 2022 開發工具，開始建立一個伺服器端的 Blazor 專案，並且從這個 Blazor Server 專案範本所產生的檔案與相關內容進行了解 Blazor Server 運作方式與特色，這裡也會介紹該專案內建的兩個 Razor 元件 Component 設計方式。

使用 Entity Framework Core 存取資料庫

在本書中所要設計的部落格文章管理紀錄，將會儲存在 Microsoft SQL Server 內，想要做到這樣的設計需求，最簡單的方式就是採用微軟提供的 Entity Framework Core 這套 ORM 套件，在這裡將會說明 Entity Framework Core 的基本架構與特色和核心運作機制，接著了解如何建立實體模型並且建立起一個資料庫與產生一些測試用的紀錄在資料表內；另外，針對資料庫處理要用到的 CRUD Create 新增、Retrive 查詢、Update 更新、Delete 刪除的計算方式，也會介紹如何使用 C# 程式碼來做到這些功能。

建立部落格文章頁面之 CRUD 功能

現在將要開始實際進行建立一個 Blazor 頁面元件，在這裡設計出一個具有 CRUD 功能的互動網頁，更令人驚豔的是，所有的設計過程，完全僅使用到 C# 程式語言就可以完成這樣的設計工作，沒有用到任何一行 JavaScript 程式碼，因此，只要是身為 .NET C# 開發者，不論之前從事 Windows Forms、Web Forms、WPF、Xamarin 等等，將會透過 Blazor 這套 UI 開發框架幫助，成為一個全端 Web 開發者，整個學習過程相當的輕鬆與容易，無須花費大量精力與時間就可以學會 Blazor Server 開發技術。

使用 Bootstrap 強制回應 Modal 對話窗

上一章所完成部落格文章管理頁面，是將資料表清單與紀錄編輯所用到的 HTML 透過元件內的布林型別屬性和資料綁定機制來動態變更瀏覽器上的 DOM 物件，如此做到切換網頁內容可以顯示不同操作畫面，在這一章中，將會使用 Bootstrap 5 所提供的強制回應對話窗樣式，讓紀錄表單編修的時候可以顯示一個流暢的對話窗，讓使用者在此對話窗中進行操作，形成一個流暢的操作體驗。

設計與使用修改與刪除 Blazor 元件

上一章所完成部落格文章管理頁面，是將 HTML / CSS 都設計在同一個 Razor 元件檔案 (.razor) 內，現在需要使用 Blazor UI 開發框架所提供的一個絕佳功能，那就是可以把許多 UI 畫面，切割成為不同的 Razor 子元件，並且在 Blazor 路由頁面元件中參考、使用這些子元件，讓這個網頁內容設計過程更加的容易與順暢，並且容易替換與維護。

將商業邏輯程式碼重構為 ViewModel

到現在為止，所有的 UI 宣告標記 (HTML / CSS) 和商業邏輯程式碼 (C#程式語言)都寫在同一個 Razor 元件檔案 (.razor) 內，在此將要學習與使用關注點分離的設計方法，把網頁畫面的 UI 保留在 Razor 元件檔案內，而把商業邏輯的 C# 程式碼分離到 ViewModel 類別內，藉由透過 ASP.NET Core 所提供相依性注入服務機制，把 ViewModel 物件動態注入到 Razor 元件檔案內。

將資料庫存取程式碼分離出來

成功的將 UI 與商業邏輯程式碼分離出來之後，接下來就是要把資料庫相關的程式碼，再度從 ViewModel 分離出來，讓 ViewModel 內要處理資料庫方面工作的時候，面對的是一個抽象介面，而在具體實作類別內，則是使用 Entity Framework Coew API 來存取資料庫，當然，這兩者之間還是要透過ASP.NET Core 所提供相依性注入服務機制結合在一起。

設計使用者身分驗證與授權功能

整個專案到現在僅剩下一個實務上經常會遇到的情境，那就是要能夠做到使用者的身分驗證與授權，在此將會使用 Cookie 來儲存使用者成功身分驗證之後的存取權杖，用來識別下次再度回到網站的時候，可以得知上次使用的使用者是哪位；另外也要控制僅有成功登入的使用者，可以使用剛剛設計的部落格文章管理頁面。

建立部落格文章 Web API

最後，將要學習如何在 Blazor Server 專案內，啟用 Web API 程式設計能力，在此將會要來設計一個部落格文章管理的 RESTful Web API

ASP.NET Core 6.0 Blazor Server 部署到 IIS

現在整個 Blazor Server 專案已經完全開發完成，最後將會需要把這個專案部署到遠端的 Web 伺服器主機上，這篇文章將會要來說明如何進行部署到 Windows Server IIS 上相關工作。

Email the Author