一、概述

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开发”。如下图红框。 

图2-1

4)如果已经安装了Visual Studio 2022,但在安装的时候,没有选择“ASP.NET 和Web开发”功能。请启动Visual Studio 2022,选择“继续但无需代码”,如下图红框所示。

图2-2

5) 在Visual Studio 2022主界面中的菜单栏上选择“工具—》获取工具和功能”,弹出界面如第4)步中的图2-1。

图2-3

6) 选择了之后,在安装程序中点击“修改”按钮。如下图。  

图2-4

学习ASP.NET Core Blazor编程系列二——第一个Blazor应用程序(上)的更多相关文章

  1. 学习ASP.NET Core Razor 编程系列二——添加一个实体

    在Razor页面应用程序中添加一个实体 在本篇文章中,学习添加用于管理数据库中的书籍的实体类.通过实体框架(EF Core)使用这些类来处理数据库.EF Core是一个对象关系映射(ORM)框架,它简 ...

  2. 学习ASP.NET Core Blazor编程系列二——第一个Blazor应用程序(中)

    学习ASP.NET Core Blazor编程系列一--综述 学习ASP.NET Core Blazor编程系列二--第一个Blazor应用程序(上) 四.创建一个Blazor应用程序 1. 第一种创 ...

  3. 学习ASP.NET Core Blazor编程系列二——第一个Blazor应用程序(下)

    学习ASP.NET Core Blazor编程系列一--综述 学习ASP.NET Core Blazor编程系列二--第一个Blazor应用程序(上) 学习ASP.NET Core Blazor编程系 ...

  4. 学习ASP.NET Core Blazor编程系列二——第一个Blazor应用程序(完)

    学习ASP.NET Core Blazor编程系列一--综述 学习ASP.NET Core Blazor编程系列二--第一个Blazor应用程序(上) 学习ASP.NET Core Blazor编程系 ...

  5. 学习ASP.NET Core Razor 编程系列十四——文件上传功能(二)

    学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...

  6. 学习ASP.NET Core Razor 编程系列十二——在页面中增加校验

    学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...

  7. C#中的函数式编程:递归与纯函数(二) 学习ASP.NET Core Razor 编程系列四——Asp.Net Core Razor列表模板页面

    C#中的函数式编程:递归与纯函数(二)   在序言中,我们提到函数式编程的两大特征:无副作用.函数是第一公民.现在,我们先来深入第一个特征:无副作用. 无副作用是通过引用透明(Referential ...

  8. 学习ASP.NET Core Razor 编程系列四——Asp.Net Core Razor列表模板页面

    学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...

  9. 学习ASP.NET Core Razor 编程系列五——Asp.Net Core Razor新建模板页面

    学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...

随机推荐

  1. 写selenium常用到的js代码

    selenium可以运行JavaScript代码,可以用一些JavaScript来辅助编写Selelnium代码. 1.scrollIntoView - 向下拉滚动条,使得某元素可见 IWebElem ...

  2. Ubuntu 配置 .NET 使用环境

    本文迁移自Panda666原博客,原发布时间:2021年3月29日. 说明 测试使用的环境 Linux版本:Ubuntu Server 20.04 LTS x64 .NET SDK版本:5.0 其他版 ...

  3. 『忘了再学』Shell基础 — 32、Shell中test测试命令详解

    目录 1.test测试命令 (1)test命令介绍 (2)test命令使用方式 (3)示例 2.按照文件类型进行判断 3.按照文件权限进行判断 4.两个文件之间进行比较 5.两个整数之间比较 6.字符 ...

  4. Weakmap详解

    先看一个例子 let obj = { name: 'toto' } // { name: 'toto' }这个对象能够被读取到,因为obj这个变量名有对它的引用 // 将引用覆盖掉 obj = nul ...

  5. 重学ES系列之新型数据结构Map应用

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. Android 12(S) 图像显示系统 - HWC HAL 初始化与调用流程

    必读: Android 12(S) 图像显示系统 - 开篇 接口定义 源码位置:/hardware/interfaces/graphics/composer/ 在源码目录下可以看到4个版本的HIDL ...

  7. SQL Server数据库 备份A库,然后删除A库,再还原A库,此时数据库一直显示“正在还原”的解决方法

    SQL Server数据库 备份A库,然后删除A库,再还原A库,此时数据库一直显示"正在还原"的解决方法: A库一直显示"正在还原". 在这种状态下,由于未提交 ...

  8. 013(oulipo)

    题目:http://ybt.ssoier.cn:8088/problem_show.php?pid=1455 题目描述:在母串里找子串出现的次数 题目思路:与字符串的搜索有关那就立刻找到哈希 从s[1 ...

  9. HMS Core 机器学习服务打造同传翻译新“声”态,AI让国际交流更顺畅

    2022年6月,HMS Core机器学习服务面向开发者提供一项全新的开放能力--同声传译,通过AI语音技术减少资源成本,加强沟通交流,旨在帮助开发者制作丰富多样的同声传译应用. HMS Core同声传 ...

  10. 各大厂的语音识别Speech To Text API使用体验

    最近发现有声读物能极大促进我的睡眠,但每个前面都有一段开场语,想把它剪掉,但是有多个开场语,所以就要用到语音识别判断一下再剪. 前两年在本地搭建过识别的环境,奈何识别准确率不行,只能找找API了,后面 ...