Anpassbare Produktberichte mit Grafana und Postgres
Einführung
Die Berichterstellung zur Produktnutzung für Verbraucher kann für Unternehmen eine zeitaufwändige Aufgabe sein. Kleinere Unternehmen verfügen möglicherweise nicht über die Ressourcen, um eine eigene Berichtslösung zu entwickeln, und greifen stattdessen auf Tabellenkalkulationen zur Verfolgung der Produktnutzung zurück. Dieser Ansatz ist jedoch nicht nur zeitaufwändig, sondern auch fehleranfällig bei der Datenverwaltung.
In diesem Blog zeigen wir, wie Grafana genutzt werden kann, um visuell ansprechende und interaktive Dashboards für die Datenvisualisierung zu erstellen. Wir verwenden Postgres als Datenbank zur Speicherung der Produktnutzungsdaten. Darüber hinaus nutzen wir Keycloak als Identity Provider, um die Sicherheit zu erhöhen und den Zugriff auf Grafana zu verwalten. Mit einem NextJS-Frontend stellen wir den Kunden eine benutzerfreundliche Oberfläche zur Verfügung, um die Diagramme und Dashboards aufzurufen und zu erkunden, und ermöglichen ihnen so wertvolle Einblicke in die Daten.
Der Quellcode für das Beispiel in diesem Beitrag ist auf GitHub verfügbar.
Hintergrund
In unserem vorherigen Blog haben wir gezeigt, wie Grafana zur Visualisierung von Daten in einer Postgres-Datenbank eingesetzt werden kann. In diesem Blog zeigen wir einen Anwendungsfall dieses Setups, bei dem Grafana zur Visualisierung von Produktnutzungsdaten eingesetzt wird.
Viele Unternehmen haben Produkte, die von Kunden genutzt werden, und müssen die Nutzung dieser Produkte durch jeden Verbraucher verfolgen. Um den Verbrauchern wertvolle Einblicke zu bieten, ist es wichtig, diese Nutzungsdaten in Form von Diagrammen und Dashboards zu visualisieren. Hier sind zwei reale Beispiele solcher Unternehmen:
- Ein Autovermietungsunternehmen möchte die Nutzung seiner Fahrzeuge durch Kunden verfolgen. Es möchte die von jedem Kunden zurückgelegte Distanz erfassen und die Daten in Form von Diagrammen und Dashboards für die Kunden visualisieren.
- Eine Online-Lernplattform möchte die Nutzung ihrer Plattform durch Studenten verfolgen. Sie möchte die von jedem Studenten aufgewendeten Stunden erfassen und die Daten in Form von Diagrammen und Dashboards für die Studenten visualisieren.
In beiden Fällen haben wir folgende gemeinsame Anforderungen:
- Wir müssen jedem Nutzer Zugriff auf seine eigenen Daten gewähren, nicht auf die Daten anderer Nutzer.
- Wir möchten anpassbare Dashboards, bei denen der Nutzer den Zeitraum und die Art des Diagramms zur Datenvisualisierung auswählen kann.
- Wir haben verschiedene Datenquellen und möchten Daten aus unterschiedlichen Quellen im selben Dashboard visualisieren können.
Die Entwicklung einer individuellen Berichtslösung für jeden Anwendungsfall ist zeitaufwändig und ressourcenintensiv. Um das Rad nicht neu zu erfinden, können wir vorhandene Tools nutzen. Grafana ist ein Visualisierungstool, das alle oben genannten Anforderungen erfüllt.
- Grafana kann mit Keycloak integriert werden, um den Zugriff auf die Dashboards zu verwalten.
- Grafana verfügt über eine benutzerfreundliche Oberfläche zum Erstellen und Anpassen von Dashboards und Diagrammen.
- Grafana hat einen leistungsstarken Query-Editor zum Abfragen von Daten aus verschiedenen Quellen und viele Plugins zur Visualisierung von Daten aus unterschiedlichen Quellen.
Im nächsten Abschnitt führen wir eine Proof-of-Concept-Implementierung der Berichterstellung zur Produktnutzung für Verbraucher mit Grafana, Postgres und Keycloak durch.
Proof-of-Concept-Implementierung
Der Code für dieses Beispiel ist auf GitHub verfügbar. Laden Sie den Code mit dem folgenden Befehl herunter:
git clone https://github.com/optiop/customizable-product-reporting
Das Repository enthält eine docker-compose.yaml-Datei, die die für das Beispiel benötigten Dienste
definiert. Verwenden Sie den folgenden Befehl, um die Dienste zu starten:
docker compose up
Dadurch werden folgende Dienste gestartet:
| Dienst | Beschreibung | URL |
|---|---|---|
| Grafana | Visualisierungstool | http://localhost:3000 |
| Keycloak | Identity Provider | http://localhost:8080 |
| Postgres (keycloak) | Datenbank zur Speicherung von Nutzerdaten | http://localhost:5432 |
| Postgres (data) | Datenbank zur Speicherung von Nutzungsdaten | |
| NextJS | Frontend für den Zugriff auf die Dashboards | http://localhost:4000 |
Das folgende Diagramm zeigt die Architektur des Beispiels und wie die Dienste miteinander verbunden sind:
Wie im Diagramm dargestellt, wird das NextJS-Frontend für den Zugriff auf die Dashboards verwendet.
Das Frontend nutzt next-auth zur Authentifizierung der Nutzer, wobei Keycloak als Provider dient.
Ein Administrator in Keycloak kann neue Nutzer anlegen und ihnen verschiedenen Gruppen zuweisen.
Jede Gruppe hat Zugriff auf ein anderes Dashboard in Grafana. Auf der anderen Seite ist Grafana
mit der Postgres-Datenbank verbunden, um die Produktnutzungsdaten abzufragen. Die von Grafana
generierten Diagramme werden im Frontend über iframes angezeigt.
Hier ist das Dashboard, das im Frontend angezeigt wird und die Nutzung eines Verbrauchers pro Monat zeigt:
Fazit
Wir können die Leistungsfähigkeit von Grafana nutzen, um visuell ansprechende und interaktive Dashboards für die Produktnutzung zu erstellen. Der Einrichtungsaufwand ist minimal und die Dashboards lassen sich einfach an die Anforderungen der Verbraucher anpassen.
Wir bei Optiop GmbH verfügen über Expertise bei der Einrichtung von Grafana und können Ihnen dabei helfen, eine ähnliche Lösung für Ihr Unternehmen zu implementieren. Nehmen Sie gerne Kontakt mit uns auf, um weitere Informationen zu erhalten.