用.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演示网站

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/309331.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

2021年度训练联盟热身训练赛第五场F题Group Project

题意: 有n个人,其中有m组,两两互斥,现在要分成两个班,但最终求的确是最多有多少对不互斥的。 题目: 链接:https://ac.nowcoder.com/acm/contest/16741/F 来源:牛客网 The big day…

[JavaWeb-XML]XML约束概述

约束:规定xml文档的书写规则 * 作为框架的使用者(程序员):1. 能够在xml中引入约束文档2. 能够简单的读懂约束文档* 分类:1. DTD:一种简单的约束技术2. Schema:一种复杂的约束技术

在Asp.NET Core中如何优雅的管理用户机密数据

在Asp.NET Core中如何优雅的管理用户机密数据背景回顾在软件开发过程中,使用配置文件来管理某些对应用程序运行中需要使用的参数是常见的作法。在早期VB/VB.NET时代,经常使用.ini文件来进行配置管理;而在.NET FX开发中,我们则倾向…

食物链 POJ - 1182

题目: 动物王国中有三类动物A,B,C,这三类动物的食物链构成了有趣的环形。A吃B, B吃C,C吃A。 现有N个动物,以1-N编号。每个动物都是A,B,C中的一种,但是我们并不知道它到底是哪一种。 有人用两种…

[XML-Jsoup]Jsoup_解析_快速入门

xml常见的解析器: 1. JAXP:sun公司提供的解析器,支持dom和sax两种思想2. DOM4J:一款非常优秀的解析器3. Jsoup:jsoup 是一款Java 的HTML解析器,可直接解析某个URL地址、HTML文本内容。它提供了一套非常省力…

基于 abp vNext 和 .NET Core 开发博客项目 - Blazor 实战系列(三)

系列文章使用 abp cli 搭建项目给项目瘦身,让它跑起来完善与美化,Swagger登场数据访问和代码优先自定义仓储之增删改查统一规范API,包装返回模型再说Swagger,分组、描述、小绿锁接入GitHub,用JWT保护你的API异常处理和…

计蒜客 逃生+动态规划

题目: 蒜头君在玩一款逃生的游戏。在一个 nmn \times mnm 的矩形地图上,蒜头位于其中一个点。地图上每个格子有加血的药剂,和掉血的火焰,药剂的药效不同,火焰的大小也不同,每个格子上有一个数字&#xff0…

[XML-Jsoup]Jsoup_对象的使用(Jsoup工具类,Document,Elements,Element,Node)

对象的使用: 1. Jsoup:工具类,可以解析html或xml文档,返回Document* parse:解析html或xml文档,返回Document* parse​(File in, String charsetName):解析xml或html文件的。* parse​(String ht…

别了,Docker Swarm !你好,K8s !

毫无疑问,Kubernetes已经成为容器编排事实标准。除了已经拥抱Kubernetes的Google、BAT、京东、奇虎360等巨头大厂外,更多的企业也都在向Kubernetes迁移。容器技术大势所趋,是互联网企业目前急需的技术人才之一,已成为运维工程师、…

01背包+概率问题 计蒜客 offer

题目: 蒜头君很早就想出国,现在他已经考完了所有需要的考试,准备了所有要准备的材料,于是,便需要去申请学校了。要申请国外的任何大学,你都要交纳一定的申请费用,这可是很惊人的。蒜头君没有多…

[JavaWeb-XML]XML_解析_解析方式

解析:操作xml文档,将文档中的数据读取到内存中 * 操作xml文档1. 解析(读取):将文档中的数据读取到内存中2. 写入:将内存中的数据保存到xml文档中。持久化的存储* 解析xml的方式:1. DOM:将标记语言文档一次性…

【翻译】.NET 5 Preview5发布

今天,发布了.NET 5.0 Preview5。主要对它进行了一小部分新功能和性能的改进。.NET 5.0 Preview 4包含了一些计划和.NET 5.0要交付的内容。现在,大多数的功能都已经包含在里面,但是有许多功能还未到最终状态。预计这个版本在Preview 7中完善。…

构造前缀贪心+ 计蒜客 子矩阵求和

题目: 给出一个 nn 行 mm 列的矩阵,矩阵的每个位置有一个非负整数 a[i][j],有 qq 次询问,每次询问求一个左上角为 (a,b),右下角为 (c,d) 的子矩阵的所有数之和。 输入格式 第一行两个整数 n,m,表示矩阵的…

[JavaWeb-XML]约束(DTD,Schema)

DTD&#xff1a; * 引入dtd文档到xml文档中* 内部dtd&#xff1a;将约束规则定义在xml文档中* 外部dtd&#xff1a;将约束的规则定义在外部的dtd文件中* 本地&#xff1a;<!DOCTYPE 根标签名 SYSTEM "dtd文件的位置">* 网络&#xff1a;<!DOCTYPE 根标签名 …

[跨平台系列三Docker篇]:ASP.NET Core应用

如果你是老张的忠实读者的话&#xff0c;如果是从博客园就开始看我的文章的话&#xff0c;如果后期也一直看我公众号的话&#xff0c;应该就知道其实我一直在根据一条无形的教学线路来讲解的&#xff0c;&#xff0c;如果你真的是想好好学的话&#xff0c;请好好看看我之前的文…

2020牛客国庆集训派对day2 F题 Java大数处理

题目&#xff1a; 链接&#xff1a;https://ac.nowcoder.com/acm/contest/16913/F 来源&#xff1a;牛客网 The following code snippet calculates the sum of the areas of all the sub rectangular grid in a rectangular grid from (0,0) to (N,N)\ .(N,N) . Find an eff…

[JavaWeb-XML]XML_快捷查询方式(selector选择器,XPath)

快捷查询方式&#xff1a; 1. selector:选择器* 使用的方法&#xff1a;Elements select​(String cssQuery)* 语法&#xff1a;参考Selector类中定义的语法2. XPath&#xff1a;XPath即为XML路径语言&#xff0c;它是一种用来确定XML&#xff08;标准通用标记语言的子集&#…

[壹刊]Azure AD(四)知识补充-服务主体

一&#xff0c;引言又到了新的一周了&#xff0c;也到了我新的分享的时间了&#xff0c;还记得上一周立得Flag&#xff0c;其中 “保证每周输出一篇文章” &#xff0c;让我特别“在意”&#xff08;这里用词不太恰当&#xff09;。主要是我的一个大学舍友&#xff0c;他突然问…

前缀和优化+计蒜客 泡咖啡

题目: 蒜头君想泡咖啡喝。现在他得到了 nn 份菜谱&#xff0c;每个菜谱上都给了两个数l,rl,rl,r代表温度区间在[l,r][l,r][l,r] 度泡出来的咖啡会很好喝。 可是菜谱太多了&#xff0c;蒜头君一度感到疑惑。经过思考之后他得出了一个结论&#xff1a;某个温度只要有 k 份或者更…

[JavaWeb-Servlet]Servlet_执行原理

执行原理&#xff1a; 1. 当服务器接受到客户端浏览器的请求后&#xff0c;会解析请求URL路径&#xff0c;获取访问的Servlet的资源路径2. 查找web.xml文件&#xff0c;是否有对应的<url-pattern>标签体内容。3. 如果有&#xff0c;则在找到对应的<servlet-class>全…