Tuxboard -Beispiele
Tuxboard ist eine leichte Dashboard -Bibliothek speziell für die ASP.NET -Kernplattform. Es sollte ein Lego-Stil sein, um Dashboards zu bauen.
Ich füge ständig weitere Beispiele über die Artikel in meinem Blog hinzu und verwende dieses Repository für die "Dropzone". (Mach dir keine Sorgen ... da kommt noch mehr)
Die Bibliothek befindet sich hier und ist hier über Nuget erhältlich.
Technologiestapel
- ASP.NET CORE 6.0 oder höher (mit C#)
- Entity Framework Core
Beispiele
Das Repository enthält die folgenden Beispiele:
- 01-Simpledashboard
Der einfachste Weg, um ein statisches Dashboard zu erstellen. Sehr einfach; Kein JavaScript ohne Funktionen (verwandter Beitrag)
- 02-WidgetSexample
Ein einfaches Dashboard mit einem einfachen Widget (zugehöriger Beitrag)
- 03-Dragwidgets
Verwenden von TypeScript, um Widgets auf dem Dashboard zu verschieben (zugehöriger Beitrag)
- 04-Tuxbar
Zeigt, wie man eine kostenlose Symbolleiste für Tuxboard erstellt (verwandter Beitrag).
- 05-Layout-1
Erstellen Sie ein einfaches Layout -Dialog, damit Benutzer die Art und Weise anpassen können, wie ihr Dashboard strukturiert ist (zugehöriger Beitrag).
- 06-Layout-2
Erstellen Sie ein erweitertes Layout -Dialog für komplexere Layouts (zugehöriger Beitrag).
- 07-add-Widgets
Erstellen Sie ein Dialogfeld Widget hinzufügen (zugehöriger Beitrag)
- 08-Widget-Toolbar
Hinzufügen von Schaltflächen und Dropdowns in den Header eines Widgets (verwandter Beitrag)
- 09-User-Diashboard
Erstellen Sie benutzerspezifische Dashboards, wenn sich Benutzer anmelden (zugehöriger Beitrag)
- 10-Default-Dashboards
Erstellen Sie rollenspezifische Dashboards, wenn sich ein Benutzer anmeldet (zugehöriger Beitrag)
- 11-Default-Widgets
Rollenspezifische Widgets erstellen (verwandter Post)
- 12-erstellte Widgets
Erstellen Sie verschiedene Arten von Widgets (bald kommen)
Ausführungsbeispiele in Docker -Containern
Jedes Beispiel hat eine Dockerfile, mit der ein Docker -Bild erstellt werden kann, mit dem die Beispiele in einem Docker -Container ausgeführt werden können.
Hier erfahren Sie, wie Sie diese Beispiele ausführen, indem Sie das einfache Dashboard als Beispiel verwenden.
- Legen Sie eine Umgebungsvariable TuxboardConfig__ConnectionString ein. In Linux/Mac -Terminals wäre dies so, wie dies die IP -Adresse, den Datenbanknamen, den Benutzernamen und das Kennwort Ihrer SQL -Server -Datenbank ersetzt:
export TUXBOARDCONFIG__CONNECTIONSTRING='Data Source=IP_ADDRESS;Initial Catalog=DATABASE_NAME;Integrated Security=false;MultipleActiveResultSets=True;TrustServerCertificate=True;User Id=USERNAME;Password=PASSWORD' - Gehen Sie in den 01-Sampledashboard-Ordner und erstellen Sie eine neue Datei namens Development.EnV, die Folgendes enthält:
TUXBOARDCONFIG__CONNECTIONSTRING=CONNECTION STRING FROM STEP 2
ASPNETCORE_ENVIRONMENT=Development
- Gehen Sie in den 01 -Simpledashboard -Ordner und führen Sie den folgenden Befehl
docker build -t simpledashboard -f Dockerfile . - Führen Sie
dotnet ef migrations add InitialCreate um die Datenbankmigrationen initial zu initiieren. - Führen Sie
dotnet ef database update aus, um die Datenbankmigrationen auf die Datenbank anzuwenden. - Führen Sie den Docker -Container mit dem folgenden Befehl
docker run --name dash -d --env-file development.env -p 8080:8080 simpledashboard
Um ein anderes Beispiel auszuführen, löschen Sie die in Schritt 3 erstellte Datenbank und führen Sie die Schritte Nr. 2 aus - #6 Ändern des Namens des Docker -Containers von Simpledashboard zu einem anderen Namen, um mit dem Beispiel übereinzustimmen.
