https://github.com/aeagle/blazor-book
A Storybook like UI for Blazor components
https://github.com/aeagle/blazor-book
blazor components layout net storybook ui wasm webassembly
Last synced: about 1 year ago
JSON representation
A Storybook like UI for Blazor components
- Host: GitHub
- URL: https://github.com/aeagle/blazor-book
- Owner: aeagle
- License: mit
- Created: 2022-02-17T23:17:47.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2024-09-25T09:02:00.000Z (almost 2 years ago)
- Last Synced: 2025-04-07T00:12:19.484Z (about 1 year ago)
- Topics: blazor, components, layout, net, storybook, ui, wasm, webassembly
- Language: CSS
- Homepage:
- Size: 227 KB
- Stars: 5
- Watchers: 1
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# blazor-book
A Storybook like UI for hosting Blazor components
## Installation
The `BlazorBook` nuget package needs to be added to your Blazor WASM/Server app and your Razor Class library project containing your individual stories.
`Install-Package BlazorBook -ProjectName MyProject`
## Setup
In the startup of your Blazor WASM/Server app:
`app.RegisterAllStories(Assembly.Load("<>"));`
- In `_Imports.razor`
Add `@using BlazorBook.Components`
- In `App.razor`
1. Add to the top
2. Add an AdditionalAssemblies prop on the component as follows:
```html
...
```
The stories will be registered and the UI available on the path `/blazorbook`
## Stories
Create a Razor Class Library to contain your stories. This should also have the `BlazorBook` nuget package as a dependency.
For example a story can be as follows:
### HelloWorld.razor
```
@inherits BlazorBook.StoryComponent
@attribute [DisplayName("Story name")]
Hello @(world)!
@code {
string world = "World!";
}
```