Bootstrap Blazor Component

Bootstrap Blazor is an enterprise-level UI component library based on Bootstrap and Blazor.

English | 中文

.NET Foundation

This project is part of the .NET Foundation and operates under their code of conduct.

Online Examples

Environment

Install .net core sdk Official website
Install Visual Studio 2022 latest Official website

Quick Installation Guide

Install Package

dotnet add package BootstrapBlazor

Add the following to `_Imports.razor`

@using BootstrapBlazor.Components

Add the following to the `MainLayout.razor`

<BootstrapBlazorRoot>
    @Body
</BootstrapBlazorRoot>

Add the following to your HTML head section

it's either index.html or _Layout.cshtml/_Host.cshtml/App.razor depending on whether you're running WebAssembly or Server

<link rel="stylesheet" href="_content/BootstrapBlazor/css/bootstrap.blazor.bundle.min.css" />

Add the following script at the end of the body

<script src="_content/BootstrapBlazor/js/bootstrap.blazor.bundle.min.js"></script>

Add the following to the relevant sections of `Program.cs`

builder.Services.AddBootstrapBlazor();

Usage

<Display Value="@_text"></Display>
<Button Text="Button" OnClick="@ClickButton"></Button>

@code {
    private string? _text;
    private void ClickButton(MouseEventArgs e)
    {
        _text = DateTime.Now.ToString();
    }
}

Install CLI Template

Install the template

dotnet new install Bootstrap.Blazor.Templates::*

Create the Boilerplate project with the template

dotnet new bbapp

Contribution

Fork
Create Feat_xxx branch
Commit
Create Pull Request

Code of Conduct

This project has adopted the code of conduct defined by the Contributor Covenant to clarify expected behavior in our community. For more information see the .NET Foundation Code of Conduct.

Donate

If this project is helpful to you, please scan the QR code below for a cup of coffee.

Thanks to JetBrains for providing free open source license