Sample Blazor project

This guide will help you run a sample Blazor project from GitHub. It is a ready-to-use application with several live Flexmonster demos. Get the sample project to try out Flexmonster.

To integrate Flexmonster into an existing Blazor project, see integration with Blazor.

Prerequisites

• Microsoft .NET Core 3.1 or later

Step 1. Get the sample Blazor project

To get our sample project, download it as ZIP or clone it with the following commands:

git clone https://github.com/flexmonster/pivot-blazor
cd pivot-blazor

Step 2. Run the project

Run the sample project from the console:

cd Flexmonster.Blazor.Sample
dotnet run

Open http://localhost:5000/ in your browser to see the result. The application can be shut down manually with Ctrl + C (Control + C on macOS).

Step 3. Check out the project’s structure

Our sample project is based on a Blazor WebAssemly template project, so most of the project’s files are the same as in the template. Learn more about the Blazor WebAssembly project structure.

Now take a look at the files specific to our sample project:

• Flexmonster.Blazor.Sample/Shared/ — menus and toggle elements used in the sample project.
• Flexmonster.Blazor.Sample/Pages/ — demos that cover different aspects of Flexmonster usage in Blazor:
  • Creating the pivot table (PivotTableDemo.razor)
  • Handling events (HandlingEvents.razor)
  • Using API calls (UsingApiCalls.razor)
  • Updating data at runtime (UpdatingData.razor)

Learn more about how these demos work: Usage examples.

Next steps

Integrate into an existing Blazor project or adjust the sample project to your needs:

• Connect to your data source
• Configure Flexmonster
• Save your configurations
• Apply a CSS theme
• Integrate with charting libraries