Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/Megabit/Blazorise
Blazorise is a component library built on top of Blazor with support for CSS frameworks like Bootstrap, Tailwind, Bulma, AntDesign, and Material.
https://github.com/Megabit/Blazorise
antdesign asp-net-core blazor blazor-components blazor-server blazor-webassembly blazorise bootstrap bootstrap4 bootstrap5 bulma charts component-library components datagrid material netcore tailwind wasm
Last synced: about 1 month ago
JSON representation
Blazorise is a component library built on top of Blazor with support for CSS frameworks like Bootstrap, Tailwind, Bulma, AntDesign, and Material.
- Host: GitHub
- URL: https://github.com/Megabit/Blazorise
- Owner: Megabit
- License: other
- Created: 2018-12-01T18:18:09.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2024-04-23T12:53:36.000Z (5 months ago)
- Last Synced: 2024-05-01T09:43:23.091Z (4 months ago)
- Topics: antdesign, asp-net-core, blazor, blazor-components, blazor-server, blazor-webassembly, blazorise, bootstrap, bootstrap4, bootstrap5, bulma, charts, component-library, components, datagrid, material, netcore, tailwind, wasm
- Language: C#
- Homepage: https://blazorise.com/
- Size: 72.7 MB
- Stars: 3,137
- Watchers: 77
- Forks: 505
- Open Issues: 390
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE.md
- Code of conduct: CODE_OF_CONDUCT.md
- Security: SECURITY.md
Awesome Lists containing this project
- awesome-csharp - Megabit.Blazorise - Blazorise is a component library built on top of Blazor and CSS frameworks like Bootstrap, Bulma and Material. Very easy to use. (Blazor)
- awsome-dotnet - Megabit.Blazorise - Blazorise is a component library built on top of Blazor and CSS frameworks like Bootstrap, Bulma and Material. Very easy to use. (Blazor)
- awesome-dotnet - Megabit.Blazorise - Blazorise is a component library built on top of Blazor and CSS frameworks like Bootstrap, Bulma and Material. Very easy to use. (Blazor)
- awesome-blazor - Blazorise -   Components for Blazor with support for Bootstrap, Bulma, AntDesign and Material CSS. ([Bootstrap Demo](https://bootstrapdemo.blazorise.com/)), ([Bulma Demo](https://bulmademo.blazorise.com/)), ([AntDesign Demo](https://antdesigndemo.blazorise.com/)), ([Material Demo](https://materialdemo.blazorise.com/)). (Libraries & Extensions / Component bundles)
README
# Components for Blazor
[](https://www.nuget.org/profiles/Megabit)
[](https://discord.gg/cVmq8xBSnG)
[](LICENSE.md)
[](https://www.paypal.me/mladenmacanovic)
[](https://www.patreon.com/mladenmacanovic)
Blazorise is the only [Blazor](https://blazor.net/) component library offering development independent of CSS frameworks, exclusively using C#. It provides support for various frameworks including Bootstrap, Tailwind and Material.
## Commercial usage
Blazorise, as a commercial product, offers a range of subscription plans that include premium support. When you choose a commercial license, you gain several advantages:
The benefits of the commercial licenses are:
- Access to [Blazorise Themes](https://blazorise.com/themes).
- Access to [Blazorise Blocks](https://blazorise.com/blocks).
- Premium support via [Blazorise Support](https://blazorise.com/support) forum.
- Dedicated customer support with swift response times of either 24 or 16 hours.
- Priority fixes and feature requests.
> \* Some features may be exclusive to specific subscription tiers.
## Supporting Blazorise
Blazorise is an open source project with its ongoing development made possible entirely by the support of these awesome backers.
### Special Partners
## Demos
### Blazor WebAssembly
- [Tailwind Demo](https://tailwinddemo.blazorise.com)
- [Bootstrap 4 Demo](https://bootstrapdemo.blazorise.com)
- [Bootstrap 5 Demo](https://bootstrap5demo.blazorise.com)
- [Material Demo](https://materialdemo.blazorise.com/)
- [Bulma Demo](https://bulmademo.blazorise.com/)
- [AntDesign Demo](https://antdesigndemo.blazorise.com/)
- [Fluent 2 Demo](https://fluentui2demo.blazorise.com/)
### Blazor Server
- [Bootstrap Demo](https://rcbootstrapdemo.blazorise.com/)
## Documentation
For full documentation, with code samples and a detailed explanation of each component please visit the Blazorise [official documentation pages](https://blazorise.com/docs/).
Continuing reading below for a quick start guide.
## Installations
### Prerequisites
Before you continue, please make sure you have the latest version of Visual Studio and .NET installed. Visit an official [Blazor](https://dotnet.microsoft.com/apps/aspnet/web-apps/client) site to learn more.
### Available packages
There are currently 6 different NuGet packages for each of the supported CSS frameworks.
Available Blazorise packages are:
```
1. Blazorise.Tailwind
2. Blazorise.Bootstrap
3. Blazorise.Bootstrap5
4. Blazorise.Bulma
5. Blazorise.Material
6. Blazorise.AntDesign
7. Blazorise.FluentUI2
```
This guide will show you how to setup Blazorise with **Bootstrap 5** and **FontAwesome 6** icons. To setup Blazorise for other CSS frameworks, please refer the [Usage](https://blazorise.com/docs/usage/) page in the documentation.
### 1. NuGet packages
First step is to install a Bootstrap 5 provider for Blazorise:
```bash
dotnet add package Blazorise.Bootstrap5
```
And FontAwesome icon package:
```bash
dotnet add package Blazorise.Icons.FontAwesome
```
### 2. Source files
Add the following to `index.html` (Blazor WebAssembly), or `_Host.cshtml` (Blazor Server), or `App.razor` (.NET 8) in the `head` section.
```html
```
Please note, that these are the Blazorise explicit dependencies, you still need to add framework specific dependencies.
#### 2.1 JavaScript resources
Blazorise loads any additional JavaScript it needs dynamically once a component needs it. This means that Blazorise expects that the resources are available and placed relative to the app root. You can configure this by using the `app.UseStaticFiles();` and it does not need any other additional configuration from your part.
If you're having any difficulties, please refer to the following issues:
- [#3122](https://github.com/Megabit/Blazorise/issues/3122)
- [#3150](https://github.com/Megabit/Blazorise/issues/3150)
We are also aware that there might need to be extra setup when dealing with PWA and offline capabilities if you want your app to remain responsive. Please check our [PWA docs](https://blazorise.com/docs/pwa) for more information.
### 3. Using's
In your main `_Imports.razor` add:
```cs
@using Blazorise
```
### 4. Registrations
Add the following lines to the relevant sections of `Program.cs`.
```cs
using Blazorise;
using Blazorise.Bootstrap5;
using Blazorise.Icons.FontAwesome;
```
```cs
builder.Services
.AddBlazorise()
.AddBootstrap5Providers()
.AddFontAwesomeIcons();
```
## Usage
```razor
@page "/counter"
Counter
Current count: @currentCount
Click me
@code {
int currentCount = 0;
void IncrementCount()
{
currentCount++;
}
}
```
## Development version
We release a development version of Blazorise on a regular basis. This version is available on the [MyGet](https://www.myget.org/gallery/blazorise) feed.
This release is not recommended for production use, but it's a great way to test the latest features, bug fixes and gives us some feedback ahead of the upcoming release.
## Contributing
We welcome contributions and any suggestions or feature requests you might have. Contributions require you to agree to a Contributor License Agreement (CLA) declaring that you have the right to, and actually do, grant us the rights to use your contribution. This will be signed once you submit a PullRequest on our repository. For details about our CLA, please visit: [Contributor License Agreement](https://gist.github.com/stsrki/abfa5ce0f4a5cf1e6ac67b92f8eb5d63).
For our code conventions and guidelines please visit: [Contributing Guide](https://github.com/Megabit/Blazorise/wiki/Contributing)