mirror of
https://gitee.com/LongbowEnterprise/BootstrapBlazor.git
synced 2024-12-05 21:50:05 +08:00
089356fd68
* doc: update doc * test: 增加打印组件单元测试 * refactor: 重构打印组件代码
131 lines
7.6 KiB
Markdown
131 lines
7.6 KiB
Markdown
<h1 align="center">Bootstrap Blazor 组件库</h1>
|
||
|
||
<div align="center">
|
||
<h2>一套基于 Bootstrap 和 Blazor 的企业级组件库</h2>
|
||
|
||
[![License](https://img.shields.io/github/license/argozhang/bootstrapblazor.svg?logo=git&logoColor=red)](https://github.com/ArgoZhang/BootstrapBlazor/blob/main/LICENSE)
|
||
[![Nuget](https://img.shields.io/nuget/v/BootstrapBlazor.svg?color=red&logo=nuget&logoColor=green)](https://www.nuget.org/packages/BootstrapBlazor/)
|
||
[![Nuget](https://img.shields.io/nuget/dt/BootstrapBlazor.svg?logo=nuget&logoColor=green)](https://www.nuget.org/packages/BootstrapBlazor/)
|
||
[![Repo Size](https://img.shields.io/github/repo-size/ArgoZhang/BootstrapBlazor.svg?logo=github&logoColor=green&label=repo)](https://github.com/ArgoZhang/BootstrapBlazor)
|
||
[![Commit Date](https://img.shields.io/github/last-commit/ArgoZhang/BootstrapBlazor/main.svg?logo=github&logoColor=green&label=commit)](https://github.com/ArgoZhang/BootstrapBlazor)
|
||
[![Github build](https://img.shields.io/github/workflow/status/ArgoZhang/BootstrapBlazor/Build%20Project/main?label=main&logo=github&logoColor=green)](https://github.com/ArgoZhang/BootstrapBlazor/actions?query=workflow%3A%22Build+Project%22+branch%3Amain)
|
||
[![codecov](https://codecov.io/gh/dotnetcore/BootstrapBlazor/branch/main/graph/badge.svg?token=5SXIWHXZC3)](https://codecov.io/gh/dotnetcore/BootstrapBlazor)
|
||
</div>
|
||
|
||
<a href="README.md">English</a> | <span>中文</span>
|
||
|
||
---
|
||
|
||
## 项目介绍
|
||
Blazor 是一个使用 .NET 生成交互式客户端 Web UI 的框架:
|
||
|
||
- 使用 C# 代替 JavaScript 来创建丰富的交互式 UI。
|
||
- 共享使用 .NET 编写的服务器端和客户端应用逻辑。
|
||
- 将 UI 呈现为 HTML 和 CSS,以支持众多浏览器,其中包括移动浏览器。
|
||
|
||
使用 .NET 进行客户端 Web 开发可提供以下优势:
|
||
|
||
- 使用 C# 代替 JavaScript 来编写代码。
|
||
- 利用现有的 .NET 库生态系统。
|
||
- 在服务器和客户端之间共享应用逻辑。
|
||
- 受益于 .NET 的性能、可靠性和安全性。
|
||
- 始终高效支持 Windows、Linux 和 macOS 上的 Visual Studio。
|
||
- 支持 Net5
|
||
- 以一组稳定、功能丰富且易用的通用语言、框架和工具为基础来进行生成。
|
||
|
||
本项目是利用 Bootstrap 样式进行封装的 UI 组件库
|
||
|
||
## 生态伙伴
|
||
|
||
WTM 快速开发框架,设计的核心理念就是 "尽一切可能提高开发效率"。WTM框架把常规编码结构化,重复编码自动化,它不仅是一个框架,它是强有力的生产力工具!目前 WTM 快速开发框架已深度集成 Blazor 欢迎大家使用 [传送门](https://wtmdoc.walkingtec.cn)
|
||
|
||
<a href="https://wtmdoc.walkingtec.cn" target="_blank"><img src="http://images.gitee.com/uploads/images/2021/0718/194451_5b6cff04_554725.png" width="100px" /></a>
|
||
|
||
WTM 快速开发框架,设计的核心理念就是 "尽一切可能提高开发效率"。WTM框架把常规编码结构化,重复编码自动化,它不仅是一个框架,它是强有力的生产力工具!目前 WTM 快速开发框架已深度集成 Blazor 欢迎大家使用 [传送门](https://wtmdoc.walkingtec.cn)
|
||
|
||
## 开发环境搭建
|
||
|
||
1. 安装 .net core sdk 最新版 [官方网址](http://www.microsoft.com/net/download)
|
||
2. 安装 Visual Studio 2022 最新版 [官方网址](https://visualstudio.microsoft.com/vs/getting-started/)
|
||
3. 获取本项目代码 [BootstrapBlazor](https://gitee.com/LongbowEnterprise/BootstrapBlazor)
|
||
|
||
## 相关资源
|
||
|
||
- [Blazor 官方文档](https://docs.microsoft.com/zh-cn/aspnet/core/blazor/?WT.mc_id=DT-MVP-5004174)
|
||
- [生成 Blazor Web 应用](https://docs.microsoft.com/zh-cn/learn/modules/build-blazor-webassembly-visual-studio-code/?WT.mc_id=DT-MVP-5004174)
|
||
- [什么是 Blazor](https://docs.microsoft.com/zh-cn/learn/modules/build-blazor-webassembly-visual-studio-code/2-understand-blazor-webassembly?WT.mc_id=DT-MVP-5004174)
|
||
- [练习 - 配置开发环境](https://docs.microsoft.com/zh-cn/learn/modules/build-blazor-webassembly-visual-studio-code/3-exercise-configure-enviromnent?WT.mc_id=DT-MVP-5004174)
|
||
- [Blazor 组件](https://docs.microsoft.com/zh-cn/learn/modules/build-blazor-webassembly-visual-studio-code/4-blazor-components?WT.mc_id=DT-MVP-5004174)
|
||
- [练习 - 添加组件](https://docs.microsoft.com/zh-cn/learn/modules/build-blazor-webassembly-visual-studio-code/5-exercise-add-component?WT.mc_id=DT-MVP-5004174)
|
||
- [数据绑定和事件](https://docs.microsoft.com/zh-cn/learn/modules/build-blazor-webassembly-visual-studio-code/6-csharp-razor-binding?WT.mc_id=DT-MVP-5004174)
|
||
- [练习 - 数据绑定和事件](https://docs.microsoft.com/zh-cn/learn/modules/build-blazor-webassembly-visual-studio-code/7-exercise-razor-binding?WT.mc_id=DT-MVP-5004174)
|
||
- [总结](https://docs.microsoft.com/zh-cn/learn/modules/build-blazor-webassembly-visual-studio-code/8-summary?WT.mc_id=DT-MVP-5004174)
|
||
|
||
## QQ交流群
|
||
|
||
[![QQ](https://img.shields.io/badge/QQ-795206915-green.svg?logo=tencent%20qq&logoColor=red)](https://qm.qq.com/cgi-bin/qm/qr?k=1-jF9-5WA_3GFiJgXem2U_AQfqbdyOlV&jump_from=webapi) [![QQ](https://img.shields.io/badge/QQ-675147445-green.svg?logo=tencent%20qq&logoColor=red)](https://qm.qq.com/cgi-bin/qm/qr?k=Geker7hCXK0HC-J8_974645j_n6w0OE0&jump_from=webapi)
|
||
|
||
## 视频教程
|
||
|
||
B 站视频集锦 [传送门](https://space.bilibili.com/660853738/channel/index)
|
||
|
||
## 组件
|
||
|
||
Blazor 应用基于组件。 Blazor 中的组件是指 UI 元素,例如页面、对话框或数据输入窗体。
|
||
|
||
组件是内置到 .NET 程序集的 .NET 类,用来:
|
||
- 定义灵活的 UI 呈现逻辑。
|
||
- 处理用户事件。
|
||
- 可以嵌套和重用。
|
||
- 可以作为 Razor 类库或 NuGet 包共享和分发。
|
||
|
||
### 内置组件
|
||
|
||
内置组件 [传送门](https://www.blazor.zone/components)
|
||
|
||
## 分支说明
|
||
|
||
- master 稳定分支
|
||
- dev 开发功能分支
|
||
- 其他 均为临时分支
|
||
|
||
## 演示地址
|
||
[![website](https://img.shields.io/badge/Github-海外-success.svg?logo=buzzfeed&logoColor=red&color=red)](https://argozhang.github.io) [![website](https://img.shields.io/badge/linux-主站-success.svg?logo=buzzfeed&logoColor=green)](https://www.blazor.zone)
|
||
|
||
## GVP 奖杯
|
||
![项目奖杯](https://images.gitee.com/uploads/images/2021/0112/120620_e596ac3c_554725.png "GVP.png")
|
||
|
||
## 项目截图
|
||
|
||
![登录可查看](https://gitee.com/LongbowEnterprise/Pictures/raw/master/BootstrapBlazor/Toggle.png "Toggle.png")
|
||
![登录可查看](https://gitee.com/LongbowEnterprise/Pictures/raw/master/BootstrapBlazor/Toast.png "Toast.png")
|
||
![登录可查看](https://gitee.com/LongbowEnterprise/Pictures/raw/master/BootstrapBlazor/Upload.png "Upload.png")
|
||
![登录可查看](https://gitee.com/LongbowEnterprise/Pictures/raw/master/BootstrapBlazor/Upload2.png "Upload2.png")
|
||
![登录可查看](https://gitee.com/LongbowEnterprise/Pictures/raw/master/BootstrapBlazor/Bar.png "Bar.png")
|
||
![登录可查看](https://gitee.com/LongbowEnterprise/Pictures/raw/master/BootstrapBlazor/Pie.png "Pei.png")
|
||
![登录可查看](https://gitee.com/LongbowEnterprise/Pictures/raw/master/BootstrapBlazor/Doughnut.png "Doughnut.png")
|
||
|
||
## 开源协议
|
||
[![Gitee license](https://img.shields.io/github/license/argozhang/bootstrapblazor.svg?logo=git&logoColor=red)](https://gitee.com/LongbowEnterprise/BootstrapBlazor/blob/master/LICENSE)
|
||
|
||
## 特别鸣谢
|
||
|
||
### 上海智通建设发展股份有限公司
|
||
|
||
特别鸣谢胡总对本项目的鼎力赞助 **10000** 元
|
||
|
||
<img src="https://gitee.com/LongbowEnterprise/Pictures/raw/master/BootstrapBlazor/Donate@x2.png" width="552px;" />
|
||
|
||
## 参与贡献
|
||
|
||
1. Fork 本项目
|
||
2. 新建 Feat_xxx 分支
|
||
3. 提交代码
|
||
4. 新建 Pull Request
|
||
|
||
## 捐助
|
||
|
||
如果这个项目对您有所帮助,请扫下方二维码打赏一杯咖啡。
|
||
|
||
<img src="https://gitee.com/LongbowEnterprise/Pictures/raw/master/WeChat/BarCode@2x.png" width="382px;" />
|