Tuxboard Examples

Tuxboard is a lightweight dashboard library specifically for the ASP.NET Core platform. It was meant to be a Lego-style way to build dashboards.

I'm continually adding more examples through the articles on my blog and using this repository for the "dropzone." (don't worry...there's more coming)

The library is located here and is available through NuGet here.

Technology Stack

• ASP.NET Core 6.0 or higher (using C#)
• Entity Framework Core

Examples

The repository contains the following examples:

• 01-SimpleDashboard
  The simplest way to create a static dashboard; VERY basic; no JavaScript with no features (related post)
  
  
• 02-WidgetsExample
  A simple dashboard with a simple widget (related post)
  
  
• 03-DragWidgets
  Using TypeScript to move Widgets around on the dashboard (related post)
  
  
• 04-Tuxbar
  Demonstrates how to create a complimentary toolbar for Tuxboard (related post)
  
  
• 05-Layout-1
  Create a simple layout dialog so users can adjust how their dashboard is structured (related post)
  
  
• 06-Layout-2
  Create an advanced layout dialog for more complex layouts (related post)
  
  
• 07-Add-Widgets
  Create an Add Widget dialog (related post)
  
  
• 08-Widget-Toolbar
  Adding buttons and dropdown to a widget's header (related post)
  
  
• 09-User-Dashboard
  Create user-specific dashboards when users log in (related post)
  
  
• 10-Default-Dashboards
  Create role-specific dashboards when a user logs in (related post)
  
  
• 11-Default-Widgets
  Create role-specific widgets (related post)
  
  
• 12-Creating-Widgets
  Create various types of widgets (coming soon)
  
  

Running Examples in Docker containers

Each example has a Dockerfile that can be used to build a Docker image that can be used to run the examples in a Docker container.

Here is how to run these examples, using the Simple Dashboard as an example.

1. Set an environment variable TUXBOARDCONFIG__CONNECTIONSTRING. On Linux/Mac terminals, this would be like this, replacing the IP address, database name, username and password of your SQL Server database: export TUXBOARDCONFIG__CONNECTIONSTRING='Data Source=IP_ADDRESS;Initial Catalog=DATABASE_NAME;Integrated Security=false;MultipleActiveResultSets=True;TrustServerCertificate=True;User Id=USERNAME;Password=PASSWORD'
2. Go into the 01-SampleDashboard folder and create a new file called development.env containing the following:

TUXBOARDCONFIG__CONNECTIONSTRING=CONNECTION STRING FROM STEP 2
ASPNETCORE_ENVIRONMENT=Development

3. Go into the 01-SimpleDashboard folder and run the following command docker build -t simpledashboard -f Dockerfile .
4. Run dotnet ef migrations add InitialCreate to initial the database migrations.
5. Run dotnet ef database update to apply the database migrations to the database.
6. Run the docker container with the following command docker run --name dash -d --env-file development.env -p 8080:8080 simpledashboard

To run a different example, delete the database created in step #3 and run steps #2 - #6 changing the name of the docker container from simpledashboard to another name to match the example.