用.NET进行客户端Web开发？看这个Bootstrap风格的BlazorUI组件库

点击上方“Dotnet9”添加关注哦

Blazor

一、前言

今天在下班的路上（地铁上），站长习惯性的掏出手机，就收到知乎向站长推送的一篇BlazorUI组件库推荐文章，是码云官方的：原文链接[1]，于是我立即打开码云了解，才知道这款BlzaorUI组件库(BootstrapBlazor)是如此优秀，已完成的组件是如此丰富，应用实战开发也是可以的。

该库十分优秀，所谓酒香不怕巷子深，今天我还是来简单介绍下，希望能让更多的人知道它、使用它。

下面是码云官方推荐文章截图（本文标题照搬，并且大部分荐文参考该仓库README.MD而来）：

码云官方知乎推荐

下面是BootstrapBlazor在码云上的截图：

BootstrapBlazor项目情况

二、Blazor是什么？

Blazor为数百万.NET开发人员带来了WebAssembly的世界，允许他们编写在浏览器上运行的C＃。

多年来，如果您想编写代码以在浏览器中运行，您的选择是JavaScript。对于某些浏览器上的几个短暂时期，您可以使用其他语言，但它们并不重要：IE上的VBScript和特殊版Chrome上的Dart。

还有一些语言可以编译成JavaScript（TypeScript，CoffeeScript，...），但它们仍然是真正的JavaScript。JavaScript单一文化的日子随着WebAssembly（Wasm）的出现而打破。对于.NET开发人员，Wasm以Blazor的形式到达。

...

三、关于BootstrapBlazor UI组件库

一个使用 .NET 生成交互式客户端 Web UI 的框架，如果你想学习学习的话不妨接着往下看。

项目名称： BootstrapBlazor

项目作者： Longbow

作者QQ号： 5196060（技术交流，欢迎勾兑）

微信号： 可添加站长微信号，给你搭桥

开源许可协议： LGPL-3.0

项目地址： https://gitee.com/LongbowEnterprise/BootstrapBlazor

四、项目简介

4.1 使用.NET

Blazor 是一个使用 .NET 生成交互式客户端 Web UI 的框架：

1. 使用 C# 代替 JavaScript 来创建丰富的交互式 UI。

2. 共享使用 .NET 编写的服务器端和客户端应用逻辑。

3. 将 UI 呈现为 HTML 和 CSS，已支持众多浏览器，其中包括移动浏览器。

4.2 使用.NET的优势

使用 .NET 进行客户端 Web 开发可提供以下优势：

1. 使用 C# 代替 JavaScript 来编写代码。

2. 利用现有的 .NET 库生态系统。

3. 在服务器和客户端之间共享应用逻辑。

4. 受益于 .NET 的性能、可靠性和安全性。

5. 始终高效支持 Windows、Linux 和 macOS 上的 Visual Studio。

6. 以一组稳定、功能丰富且易用的通用语言、框架和工具为基础来进行生成。

本项目是利用 Bootstrap 样式进行封装的 UI 组件库。

4.3 组件

Blazor应用基于组件。Blazor 中的组件是指 UI 元素，例如页面、对话框或数据输入窗体。

组件是内置到 .NET 程序集的 .NET 类，用来：

1. 定义灵活的 UI 呈现逻辑。

2. 处理用户事件。

3. 可以嵌套和重用。

4. 可以作为 Razor 类库或 NuGet 包共享和分发。

4.4 内置组件

内置组件 传送门[2]

4.5 分支说明

1. master 稳定分支

2. dev 开发功能分支

3. publish 与演示网站同步

4. 其他 均为临时分支

4.6 演示地址

blazor.sdgxgz.com

点击跳转 BootstrapBlazor[3]

4.7 项目截图

下面是部分截图，欲了解更多，请点击上面链接查看。

1. Toggle开关

Toggle开关

1. Toast轻量弹窗

Toast轻量弹窗

1. 卡片式预览

卡片式预览

1. 堆栈式文件上传进度

堆栈式文件上传进度

1. Bar图

Bar图

1. Pie图

Pie图

1. Doughnut图

Doughnut图

目前这个项目仍然在不断地完善中， 如果你想参与进来，或者想看看这个项目更详细的情况，那就点击后面的链接去项目主页看看吧。

[1]

原文链接: https://zhuanlan.zhihu.com/p/147193082?utm_source=wechat_session&utm_medium=social&utm_oi=714039936084344832

[2]

传送门: http://blazor.sdgxgz.com/alerts

[3]

BootstrapBlazor: http://blazor.sdgxgz.com

不妨点个“在看”或者转发朋友圈

????点击查看Bootstrap Blazor演示网站