mirror of
https://gitee.com/LongbowEnterprise/BootstrapBlazor.git
synced 2024-12-02 03:59:14 +08:00
204 lines
11 KiB
Markdown
204 lines
11 KiB
Markdown
<h1 align="center">Bootstrap Blazor 组件库</h1>
|
||
|
||
<div align="center">
|
||
<h2>一套基于 Bootstrap 和 Blazor 的企业级组件库</h2>
|
||
|
||
[](https://github.com/ArgoZhang/BootstrapBlazor/blob/main/LICENSE)
|
||
[](https://www.nuget.org/packages/BootstrapBlazor/)
|
||
[](https://www.nuget.org/packages/BootstrapBlazor/)
|
||
[](https://github.com/ArgoZhang/BootstrapBlazor)
|
||
[](https://github.com/ArgoZhang/BootstrapBlazor)
|
||
[](https://github.com/ArgoZhang/BootstrapBlazor/actions?query=workflow%3A%22Build+Project%22+branch%3Amain)
|
||
[](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)
|
||
|
||
### 克隆代码
|
||
|
||
```shell
|
||
git clone https://gitee.com/LongbowEnterprise/BootstrapBlazor.git
|
||
cd BootstrapBlazor/src/BootstrapBlazor.Server
|
||
dotnet run
|
||
```
|
||
|
||
### CLI
|
||
|
||
**Install Template**
|
||
|
||
```c#
|
||
dotnet new -i Bootstrap.Blazor.Templates
|
||
```
|
||
|
||
**Create Project**
|
||
|
||
```shell
|
||
dotnet new bbapp
|
||
```
|
||
|
||
**Run**
|
||
|
||
```shell
|
||
dotnet run
|
||
```
|
||
|
||
### 项目模板
|
||
|
||
- [微软市场](https://marketplace.visualstudio.com/items?itemName=Longbow.BootstrapBlazorUITemplate)
|
||
- [码云镜像](https://gitee.com/LongbowEnterprise/BootstrapBlazorVsix/raw/master/dist/BootstrapBlazor.UITemplate.vsix)
|
||
|
||
### 更多文档
|
||
|
||
- [项目模板](https://www.blazor.zone/template)
|
||
- [快速上手](https://www.blazor.zone/install-server)
|
||
|
||
## 相关资源
|
||
|
||
- [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交流群
|
||
|
||
[](https://qm.qq.com/cgi-bin/qm/qr?k=1-jF9-5WA_3GFiJgXem2U_AQfqbdyOlV&jump_from=webapi) [](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 开发功能分支
|
||
- 其他 均为临时分支
|
||
|
||
## 演示地址
|
||
[](https://argozhang.github.io) [](https://www.blazor.zone)
|
||
|
||
## 浏览器支持
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
### 移动设备
|
||
|
||
|
||
|
||
|
||
|
||
| | **Chrome** | **Firefox** | **Safari** | **Android Browser & WebView** | **Microsoft Edge** |
|
||
| ------- | --------- | --------- | ------ | ------------------------- | -------------- |
|
||
| **iOS** | Supported | Supported | Supported | N/A | Supported |
|
||
| **Android** | Supported | Supported | N/A | Android v5.0+ supported | Supported |
|
||
| **Windows 10 Mobile** | N/A | N/A | N/A | N/A | Supported |
|
||
|
||
### 桌面设备
|
||
|
||
|
||
|
||
|
||
|
||
| | Chrome | Firefox | Internet Explorer | Microsoft Edge | Opera | Safari |
|
||
| ------- | --------- | --------- | ----------------- | -------------- | --------- | ------------- |
|
||
| Mac | Supported | Supported | N/A | N/A | Supported | Supported |
|
||
| Linux | Supported | Supported | N/A | N/A | N/A | N/A |
|
||
| Windows | Supported | Supported | Supported, IE11+ | Supported | Supported | Not supported |
|
||
|
||
|
||
## GVP 奖杯
|
||
|
||
|
||
## 项目截图
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
## 开源协议
|
||
[](https://gitee.com/LongbowEnterprise/BootstrapBlazor/blob/master/LICENSE)
|
||
|
||
## 特别鸣谢
|
||
|
||
### 上海智通建设发展股份有限公司
|
||
|
||
特别鸣谢胡总对本项目的鼎力赞助 **10000** 元
|
||
|
||
<img src="https://gitee.com/Longbow/Pictures/raw/master/BootstrapBlazor/Donate@x2.png" width="552px;" />
|
||
|
||
## 参与贡献
|
||
|
||
1. Fork 本项目
|
||
2. 新建 Feat_xxx 分支
|
||
3. 提交代码
|
||
4. 新建 Pull Request
|
||
|
||
## 捐助
|
||
|
||
如果这个项目对您有所帮助，请扫下方二维码打赏一杯咖啡。
|
||
|
||
<img src="https://gitee.com/Longbow/Pictures/raw/master/WeChat/BarCode@2x.png" width="382px;" />
|