学习ASP.NET Core Blazor编程系列二——第一个Blazor应用程序(上)
一、概述
Blazor 是一个生成交互式客户端 Web UI 的框架:
- 使用 C# 代替 JavaScript 来创建信息丰富的交互式 UI。
- 共享使用 .NET 编写的服务器端和客户端应用逻辑。
- 将 UI 呈现为 HTML 和 CSS,以支持众多浏览器,其中包括移动浏览器。
- 与新式托管平台(如 Docker)集成。
- 使用 .NET 和 Blazor 生成混合桌面和移动应用。
使用 .NET 进行客户端 Web 开发可提供以下优势:
- 使用 C# 代替 JavaScript 来编写代码。
- 利用现有的 .NET 库生态系统。
- 在服务器和客户端之间共享应用逻辑。
- 受益于 .NET 的性能、可靠性和安全性。
- 使用开发环境(例如 Visual Studio 或 Visual Studio Code)保持 Windows、Linux 或 macOS 上的工作效率。
- 以一组稳定、功能丰富且易用的通用语言、框架和工具为基础来进行生成。
二、开始学习第一个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应用程序(上)的更多相关文章
- 学习ASP.NET Core Razor 编程系列二——添加一个实体
在Razor页面应用程序中添加一个实体 在本篇文章中,学习添加用于管理数据库中的书籍的实体类.通过实体框架(EF Core)使用这些类来处理数据库.EF Core是一个对象关系映射(ORM)框架,它简 ...
- 学习ASP.NET Core Blazor编程系列二——第一个Blazor应用程序(中)
学习ASP.NET Core Blazor编程系列一--综述 学习ASP.NET Core Blazor编程系列二--第一个Blazor应用程序(上) 四.创建一个Blazor应用程序 1. 第一种创 ...
- 学习ASP.NET Core Blazor编程系列二——第一个Blazor应用程序(下)
学习ASP.NET Core Blazor编程系列一--综述 学习ASP.NET Core Blazor编程系列二--第一个Blazor应用程序(上) 学习ASP.NET Core Blazor编程系 ...
- 学习ASP.NET Core Blazor编程系列二——第一个Blazor应用程序(完)
学习ASP.NET Core Blazor编程系列一--综述 学习ASP.NET Core Blazor编程系列二--第一个Blazor应用程序(上) 学习ASP.NET Core Blazor编程系 ...
- 学习ASP.NET Core Razor 编程系列十四——文件上传功能(二)
学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...
- 学习ASP.NET Core Razor 编程系列十二——在页面中增加校验
学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...
- C#中的函数式编程:递归与纯函数(二) 学习ASP.NET Core Razor 编程系列四——Asp.Net Core Razor列表模板页面
C#中的函数式编程:递归与纯函数(二) 在序言中,我们提到函数式编程的两大特征:无副作用.函数是第一公民.现在,我们先来深入第一个特征:无副作用. 无副作用是通过引用透明(Referential ...
- 学习ASP.NET Core Razor 编程系列四——Asp.Net Core Razor列表模板页面
学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...
- 学习ASP.NET Core Razor 编程系列五——Asp.Net Core Razor新建模板页面
学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...
随机推荐
- 写selenium常用到的js代码
selenium可以运行JavaScript代码,可以用一些JavaScript来辅助编写Selelnium代码. 1.scrollIntoView - 向下拉滚动条,使得某元素可见 IWebElem ...
- Ubuntu 配置 .NET 使用环境
本文迁移自Panda666原博客,原发布时间:2021年3月29日. 说明 测试使用的环境 Linux版本:Ubuntu Server 20.04 LTS x64 .NET SDK版本:5.0 其他版 ...
- 『忘了再学』Shell基础 — 32、Shell中test测试命令详解
目录 1.test测试命令 (1)test命令介绍 (2)test命令使用方式 (3)示例 2.按照文件类型进行判断 3.按照文件权限进行判断 4.两个文件之间进行比较 5.两个整数之间比较 6.字符 ...
- Weakmap详解
先看一个例子 let obj = { name: 'toto' } // { name: 'toto' }这个对象能够被读取到,因为obj这个变量名有对它的引用 // 将引用覆盖掉 obj = nul ...
- 重学ES系列之新型数据结构Map应用
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Android 12(S) 图像显示系统 - HWC HAL 初始化与调用流程
必读: Android 12(S) 图像显示系统 - 开篇 接口定义 源码位置:/hardware/interfaces/graphics/composer/ 在源码目录下可以看到4个版本的HIDL ...
- SQL Server数据库 备份A库,然后删除A库,再还原A库,此时数据库一直显示“正在还原”的解决方法
SQL Server数据库 备份A库,然后删除A库,再还原A库,此时数据库一直显示"正在还原"的解决方法: A库一直显示"正在还原". 在这种状态下,由于未提交 ...
- 013(oulipo)
题目:http://ybt.ssoier.cn:8088/problem_show.php?pid=1455 题目描述:在母串里找子串出现的次数 题目思路:与字符串的搜索有关那就立刻找到哈希 从s[1 ...
- HMS Core 机器学习服务打造同传翻译新“声”态,AI让国际交流更顺畅
2022年6月,HMS Core机器学习服务面向开发者提供一项全新的开放能力--同声传译,通过AI语音技术减少资源成本,加强沟通交流,旨在帮助开发者制作丰富多样的同声传译应用. HMS Core同声传 ...
- 各大厂的语音识别Speech To Text API使用体验
最近发现有声读物能极大促进我的睡眠,但每个前面都有一段开场语,想把它剪掉,但是有多个开场语,所以就要用到语音识别判断一下再剪. 前两年在本地搭建过识别的环境,奈何识别准确率不行,只能找找API了,后面 ...