Blazor Server 从头开始:01 创建项目
2023-03-31 10:55:57 时间
最近手痒,正好阳性在家,就打算把代码再捡起来看看,学习下这些年来都有什么新东西出现。就看到了微软出的.Net 7 Blazor相关的内容。
走了一遍微软官方的教程,发现用处不大,(可能是年纪已高,也可能是断代太久),所以给这段时间立个小目标,从头开始学习一下这个Blazor。
有关Blazor Server 和Web WebAssembly 的区别已经有大把的人在说,就不再赘述(其实对于新手来说,选定一个研究就是了,没必要纠结)。
准备工作
- 根据自己的操作系统,从官网下载最新版本的 Visual Studio (我的是Mac Arm64 17.4 版本);
- 在Visual Studio安装程序中,将 Web相关的组件都够选上(因为我已安装好,不想卸载重装,就不罗列具体哪些组件了)
- 等待安装程序完成更新后,即可。
创建项目
- 打开安装好的Visual Studio,选择「新建」
- 依次选择「Web控制台 -- 应用」-->「ASP.NET Core -- Blazor Server应用空 (C#」,点击继续
- 目标框架「.Net 7」,取消勾选「高级:配置HTTPS」,点击继续
- 输入项目名称(这里我使用“BlazorServerDemo”),选择位置文件夹(这里我使用默认),点击创建
- Visual Studio 会自动打开项目窗口,点击上方「调试 -- 开始调试」,此时弹出浏览器窗口,并显示 “Hello World”字样
- 创建项目完成
项目结构
默认自动创建的项目结构:
- Pages 视图文件,Razor组件
- _Host.cshtml 实现为 Razor 页面的应用的根页面,指定根
App
组件 (App.razor
) 的呈现位置。 - Index.razor Razor组件
- _Host.cshtml 实现为 Razor 页面的应用的根页面,指定根
- Properties
- launchSettings.json
- wwwroot 静态文件
- CSS
- site.css
- CSS
- _Imports.razor 包括要包含在应用组件 (
.razor
) 中的常见 Razor 指令,如用于命名空间的 @using 指令。 - App.razor 应用的根组件,用于使用 Router 组件来设置客户端路由。 appsettings.json 基本应用参数
- appsettings.Development.json
- MainLayout.razor UI 布局
- Program.cs 应用的入口点,用于设置 ASP.NET Core 主机 并包含应用的启动逻辑,其中包括服务注册和请求处理管道配置
自定义创建的其他目录:
- Data 向应用的组件提供示例数据。
- Shared 包含共享组件和样式表
总结思考
- .razor 文件是Razor组件文件,内涵描述组件的所有内容(HTML以及对应的逻辑代码)
- Blazor 相对于其他Web框架而言,比较友好的是可以直接使用C#写页面逻辑
- 与当前很多应用较广泛的前端框架(JS语言)类似的组件编写风格
- 空白模板相对更适合作为Blazor项目的起点,而不是Blazor Server模板
相关文章
- Flask中的请求上下文和应用上下文
- 腾讯入资东方金信数亿元,共建大数据生态体系
- 浅谈大数据开发工程师的两年工作经验总结
- 大数据应用案例:Dealer Tire通过大数据预测消费者何时需要轮胎
- 医疗大数据:如何实现商业化变现?
- 大数据分析建模及其应用建议
- 招聘行业大数据应用场景分析
- 大数据入门学习必读好书推荐,请收藏!
- 区块链与大数据的整合,未来必然趋势
- 如今的大数据究竟发展到了什么阶段
- InterSystems IRIS医疗版助力东华医为推动中国医疗行业数字化转型
- 大数据产业进入提质增效关键期
- 社交网络大数据的应用有多大的价值
- 大数据安全防护方法研究与建议
- InterSystems IRIS 数据平台通过AWS云应用商店认证
- 大数据在医疗行业中的5种应用
- 中国大地保险数据管理应用中心大数据应用平台案例分析
- 大数据在应急管理中的应用
- 大数据:产业链条将更为完备
- 2019年大数据发展将走向何方