Giters

riganti / dotvvm-samples-businesspack4

Demos from DotVVM Virtual Conference presenting news in DotVVM Business Pack 4.0

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Screenshot

DotVVM Business Pack 4 enhancements

This sample shows some new features introduced in DotVVM Business Pack 4.0.

Prerequisites

How to run the sample

  1. Open the GitHub repo in Visual Studio or git clone https://github.com/riganti/dotvvm-samples-businesspack4.git

  2. Open src/BPSamples/BPSamples.sln Open the solution file

  3. Make sure you have a license for DotVVM Business Pack or you have requested a free 30-days trial.

  4. Open the Tools > NuGet Package Manager > Package Manager Settings and make sure you have the DotVVM Private NuGet Feed configured. If not, follow the steps to Configure DotVVM Private NuGet Feed. Open the NuGet Package Manager menu Open the NuGet Package Manager menu

Sample 1: Customize Business Pack theme using CSS variables

  1. Right-click the BPSamples.CustomProperties project and select View > View in Browser View BPSamples.CustomProperties in Browser

  2. You can see the Business Pack components using the default style. Click on the checkbox to see the overriden style. You can find the overriden styles in the src\BPSamples.CustomProperties\wwwroot\css\style.css file.

Default and overriden look of the application

  1. You can try switching to the Bootstrap 4 theme by changing the theme in the src\BPSamples.CustomProperties\DotvvmStartup.cs file in the ConfigureServices method.

Default and overriden look of the application with the Bootstrap4 theme

Sample 2: Customize Excel exports from the GridView

  1. Right-click the BPSamples.GridViewExporting project and select View > View in Browser View BPSamples.GridViewExporting in Browser

  2. The application will auto-generate a sample data set. When you click the Export button, the Excel file will be generated. You can find the configuration of the export in src\BPSamples.GridViewExporting\ViewModels\DefaultViewModel.cs file.

Exported Excel file

Sample 3: Using the new DotVVM.BusinessPack.Messaging package

  1. Right-click the BPSamples.Chat project and select View > View in Browser View BPSamples.Chat in Browser

  2. Repeate the same action again to open the app in a second tab.

  3. Enter a different name in each tab.

  4. Write chat messages and see how they are synchronized between the two tabs in the real-time.

Chat application in action

What you can learn in the sample

  • Using CSS variables to override DotVVM Business Pack look & feel
  • How to customize Excel exports in GridView
  • How to use the new DotVVM.BusinessPack.Messaging package

Other resources

About

Demos from DotVVM Virtual Conference presenting news in DotVVM Business Pack 4.0

License:Apache License 2.0

Languages

Language:C# 89.7%Language:CSS 6.4%Language:SCSS 4.0%