天天看點

學習ASP.NET Core Blazor程式設計系列二——第一個Blazor應用程式(上)

在學習本教程之前,我随便說兩句,如果一直是在跟随微軟的技術路線的話,應該記得當初微軟用來跟flash打擂台的SilverLigth,也是一個富用戶端的開發架構,現在不知道在哪個犄角旮旯裡呆着。Blazor未來的錢景如何,暫時未知?從目前來看Blazor還是要學習一下的。本教程首先通過一個微軟提供的Blazor應用程式模闆示例,來簡單學習一下如何建立基于ASP.NET Core Blazor的Web應用程式。

學習ASP.NET Core Blazor程式設計系列一——綜述

一、概述

       Blazor 是一個生成互動式用戶端 Web UI 的架構:

  1.  使用 C# 代替 JavaScript 來建立資訊豐富的互動式 UI。
  2. 共享使用 .NET 編寫的伺服器端和用戶端應用邏輯。
  3. 将 UI 呈現為 HTML 和 CSS,以支援衆多浏覽器,其中包括移動浏覽器。
  4. 與新式托管平台(如 Docker)內建。
  5. 使用 .NET 和 Blazor 生成混合桌面和移動應用。

      使用 .NET 進行用戶端 Web 開發可提供以下優勢:

  1. 使用 C# 代替 JavaScript 來編寫代碼。
  2. 利用現有的 .NET 庫生态系統。
  3. 在伺服器和用戶端之間共享應用邏輯。
  4. 受益于 .NET 的性能、可靠性和安全性。
  5. 使用開發環境(例如 Visual Studio 或 Visual Studio Code)保持 Windows、Linux 或 macOS 上的工作效率。
  6. 以一組穩定、功能豐富且易用的通用語言、架構和工具為基礎來進行生成。

二、開始學習第一個ASP.NET Blazor應用程式

      在學習本教程之前,我随便說兩句,如果一直是在跟随微軟的技術路線的話,應該記得當初微軟用來跟flash打擂台的SilverLigth,也是一個富用戶端的開發架構,現在不知道在哪個犄角旮旯裡呆着。Blazor未來的錢景如何,暫時未知?從目前來看Blazor還是要學習一下的。本教程首先通過一個微軟提供的Blazor應用程式模闆示例,來簡單學習一下如何建立基于ASP.NET Core Blazor的Web應用程式。

三、正式開始之前,請先安裝以下軟體

1).NET Core SDK 6.0版本或更高版本

2)Visual Studio 2022版本17.3 或更高版本。

3)在安裝Visual Studio 2022的時候,必須選擇“ASP.NET和Web開發”。如下圖紅框。 

學習ASP.NET Core Blazor程式設計系列二——第一個Blazor應用程式(上)

圖2-1

  4)如果已經安裝了Visual Studio 2022,但在安裝的時候,沒有選擇“ASP.NET 和Web開發”功能。請啟動Visual Studio 2022,選擇“繼續但無需代碼”,如下圖紅框所示。

學習ASP.NET Core Blazor程式設計系列二——第一個Blazor應用程式(上)

圖2-2

5) 在Visual Studio 2022主界面中的菜單欄上選擇“工具—》擷取工具和功能”,彈出界面如第4)步中的圖2-1。

學習ASP.NET Core Blazor程式設計系列二——第一個Blazor應用程式(上)

圖2-3

6) 選擇了之後,在安裝程式中點選“修改”按鈕。如下圖。  

學習ASP.NET Core Blazor程式設計系列二——第一個Blazor應用程式(上)

圖2-4

繼續閱讀