Logo
☆☆☆☆☆
0.0
Intermediate
24h

使用 Blazor WebAssembly 构建真实应用场景

Blazor WebAssembly 是基于广受欢迎且功能强大的 ASP.NET 框架构建的。它允许你使用 C# 在客户端开发单页 Web 应用程序,而无需使用 JavaScript。Blazor WebAssembly 不依赖插件或扩展,仅需浏览器支持 WebAssembly。 在本课程中,你将完成一系列实践项目,学习 Blazor WebAssembly 的核心知识。每一章都包含一个独立的项目,并配有详细的分步指导。每个项目旨在突出展示一个或多个重要概念。在第一个项目中,你将学习模板化组件;随后,你将掌握 JavaScript 互操作、渐进式 Web 应用、应用状态管理、事件处理,以及使用 Web API 的 ASP.NET Core 托管应用。最后,你将学习内置组件,如 EditForm 及其验证功能。 课程结束时,你将具备开发简单独立的 Web 应用程序以及带有 SQL Server 后端的托管 Web 应用程序的实际经验。

11 Lessons
Included in Subscription Plan
Personalized Learning
Powered by AI
使用 Blazor WebAssembly 构建真实应用场景
Blazor WebAssembly 是基于广受欢迎且功能强大的 ASP.NET 框架构建的。它允许你使用 C# 在客户端开发单页 Web 应用程序,而无需使用 JavaScript。Blazor WebAssembly 不依赖插件或扩展,仅需浏览器支持 WebAssembly。 在本课程中,你将...

WHAT YOU'LL LEARN

对Blazor及其在Web开发中应用的理解

Content

11 Lessons • 0 Quizzes • 0 Challenges

Blazor WebAssembly 简介
  1. 1

    Blazor 简介

  2. 2

    使用 Blazor 框架的优势

  3. 3

    托管模式

  4. 4

    什么是 WebAssembly?

  5. 5

    Blazor WebAssembly 的核心特点

  6. 6

    自我测验:Blazor WebAssembly

构建你的第一个 Blazor WebAssembly 应用程序
  1. 1

    Blazor WebAssembly 应用简介

  2. 2

    Razor 组件

  3. 3

    组件结构

  4. 4

    Blazor WebAssembly 中的路由

  5. 5

    Razor 语法

  6. 6

    演示项目概述

  7. 7

    创建演示 Blazor WebAssembly 项目

  8. 8

    查看演示项目的结构

  9. 9

    检查共享的 Razor 组件

  10. 10

    检查可路由的 Razor 组件

  11. 11

    使用 Razor 组件

  12. 12

    向组件添加参数

  13. 13

    添加路由参数

  14. 14

    使用部分类将标记与代码分离

  15. 15

    创建自定义 Blazor WebAssembly 项目模板

  16. 16

    创建项目模板

  17. 17

    第一个 Blazor WebAssembly 应用程序概述

  18. 18

    自我测验:Blazor WebAssembly 基础知识

使用模板化组件构建模态对话框
  1. 1

    模板化组件简介

  2. 2

    Razor 组件中的参数(RenderFragment 参数)

  3. 3

    事件回调参数

  4. 4

    CSS 隔离

  5. 5

    模态对话框项目概述

  6. 6

    创建模态对话框项目

  7. 7

    添加对话框组件

  8. 8

    添加事件回调参数

  9. 9

    添加 RenderFragment 参数

  10. 10

    创建一个 Razor 类库

  11. 11

    向 Razor 类库添加组件

  12. 12

    使用模板化组件的总结

  13. 13

    自我测验:模态对话框基础

使用 JavaScript 互操作构建本地存储服务
  1. 1

    JavaScript 互操作性入门

  2. 2

    为什么使用 JavaScript?

  3. 3

    InvokeVoidAsync

  4. 4

    InvokeAsync

  5. 5

    从 .NET 同步调用 JavaScript

  6. 6

    理解本地存储

  7. 7

    本地存储项目概述

  8. 8

    创建 LocalStorage 项目

  9. 9

    向应用中添加 JavaScript 和服务以写入 localStorage

  10. 10

    从 LocalStorage 读取数据

  11. 11

    使用 JavaScript 互操作性的总结

  12. 12

    自我测试:JavaScript 互操作性

构建一个作为渐进式网络应用(PWA)的天气应用
  1. 1

    渐进式网页应用简介

  2. 2

    理解渐进式网络应用(PWAs)

  3. 3

    使用清单文件

  4. 4

    使用服务工作者

  5. 5

    使用 CacheStorage、Geolocation 和 OpenWeather One Call API

  6. 6

    天气预报项目概述

  7. 7

    创建 Blazor WebAssembly 项目

  8. 8

    添加一个 JavaScript 函数并使用地理定位 API

  9. 9

    添加一个预测类

  10. 10

    将天气预报应用转换为PWA

  11. 11

    测试服务工作线程

  12. 12

    安装和卸载 PWA

  13. 13

    总结

  14. 14

    在 Blazor WebAssembly PWA 上自我测验

使用应用状态构建购物车
  1. 1

    应用状态简介

  2. 2

    应用状态与依赖注入的理解

  3. 3

    购物车项目概述

  4. 4

    创建购物车项目

  5. 5

    添加产品类

  6. 6

    添加商店页面

  7. 7

    创建 ICartService 接口和 CartService 类

  8. 8

    将购物车总额添加到所有页面

  9. 9

    使用应用状态概述

  10. 10

    应用状态基础知识测验

使用事件构建看板
  1. 1

    事件简介

  2. 2

    事件处理

  3. 3

    看板项目概述

  4. 4

    创建看板项目

  5. 5

    添加类

  6. 6

    创建看板面板

  7. 7

    创建 NewTask 组件

  8. 8

    事件使用总结

  9. 9

    在 Blazor WebAssembly 中测试你的事件处理知识

使用 ASP.NET Web API 构建任务管理器
  1. 1

    ASP.NET Web API 简介

  2. 2

    理解托管应用

  3. 3

    使用 HttpClient 服务

  4. 4

    使用 JSON 辅助方法

  5. 5

    任务管理器项目概述

  6. 6

    创建 TaskManager 项目

  7. 7

    清空解决方案

  8. 8

    添加 TaskItem 类和 API 控制器

  9. 9

    设置 SQL Server

  10. 10

    显示任务

  11. 11

    完成任务

  12. 12

    删除任务

  13. 13

    添加新任务

  14. 14

    ASP.NET Web API 是一个用于构建 HTTP 服务的框架,适用于构建支持多种客户端(如浏览器、移动设备等)的 RESTful 服务。它基于 ASP.NET 框架,能够轻松地处理 HTTP 请求和响应,支持 JSON 和 XML 等数据格式的序列化与反序列化。 Web API 的核心特性包括: - **REST 支持**:遵循 REST 架构风格,使用标准 HTTP 方法(GET、POST、PUT、DELETE)来操作资源。 - **路由机制**:通过灵活的路由配置,将 URL 映射到控制器和动作方法。 - **模型绑定与验证**:自动将请求数据绑定到方法参数,并支持数据验证。 - **内容协商**:根据客户端请求头(如 Accept)自动选择返回的数据格式(JSON 或 XML)。 - **依赖注入**:内置对依赖注入的支持,便于管理服务和组件的生命周期。 - **过滤器**:提供全局或局部的过滤器,用于实现日志记录、异常处理、身份验证等功能。 - **OData 支持**:可集成 OData,使 API 支持查询、筛选、排序等高级功能。 - **跨域支持**:通过 CORS(跨域资源共享)支持跨域请求,方便前端应用调用后端 API。 Web API 通常与 MVC 框架共存于同一个项目中,也可独立部署。它广泛应用于构建现代 Web 应用、移动应用后端以及微服务架构中的服务接口。

  15. 15

    自我测验:托管的 Blazor WebAssembly 应用

使用 EditForm 组件构建一个费用跟踪器
  1. 1

    内置组件简介

  2. 2

    EditForm 组件概述

  3. 3

    使用验证组件

  4. 4

    费用追踪器项目概述

  5. 5

    创建 ExpenseTracker 项目

  6. 6

    删除演示项目

  7. 7

    添加类

  8. 8

    添加 API 控制器

  9. 9

    创建 SQL Server 数据库

  10. 10

    查看支出

  11. 11

    添加 ExpenseEdit 组件

  12. 12

    添加输入组件

  13. 13

    使用 EditForm 组件的总结

  14. 14

    自我测验:Blazor 内置组件

结论
  1. 1

    总结!

本地安装
  1. 1

    Visual Studio、.NET 和 SQL Server 的安装

Certificate of Completion

Showcase your accomplishment by sharing your certificate of completion.

Course Author:Anonymous User

Reviews

Read reviews from students who have taken this course and share your own experience.

Reviews & Comments (0)