# BootstrapBlazor
**Repository Path**: brucelut/BootstrapBlazor
## Basic Information
- **Project Name**: BootstrapBlazor
- **Description**: Bootstrap 样式的 Blazor UI 组件库,适配移动端支持各种主流浏览器,适配 ABP,同时支持 NET5/NET6 交流群 795206915 或者 675147445
- **Primary Language**: C#
- **License**: Apache-2.0
- **Default Branch**: main
- **Homepage**: https://www.blazor.zone
- **GVP Project**: No
## Statistics
- **Stars**: 0
- **Forks**: 752
- **Created**: 2023-03-17
- **Last Updated**: 2023-03-17
## Categories & Tags
**Categories**: Uncategorized
**Tags**: None
## README
Bootstrap Blazor 组件库
一套基于 Bootstrap 和 Blazor 的企业级组件库
[](https://github.com/ArgoZhang/BootstrapBlazor/blob/main/LICENSE)
[](https://github.com/ArgoZhang/BootstrapBlazor/blob/main/LICENSE)
[](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)
English | 中文
---
## 项目介绍
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)
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 install 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** 元
## 参与贡献
1. Fork 本项目
2. 新建 Feat_xxx 分支
3. 提交代码
4. 新建 Pull Request
## 捐助
如果这个项目对您有所帮助,请扫下方二维码打赏一杯咖啡。
