Clank-Dashboard - Dashboard eines Discord-Bots
Dies ist (m)ein modernes Web‑Dashboard, entwickelt mit TypeScript und Angular, das es ermöglicht, den Discord‑Bot „
Clank“ vollständig via grafischer Oberfläche zu konfigurieren – ganz ohne direkt Discord nutzen zu müssen. Das wurde sich sehr häufig von Usern hier gewünscht und daher wollte ich das (zumindest) das Frontend auch Open-Source machen.
🎯 ~ Ziel & Motivation
Das Dashboard zielt darauf ab, dem Bot-Admin (oder wer auch immer es einstellt) ein intuitives Interface zu bieten, um Einstellungen, Befehle und Funktionen schnell und visuell zu verwalten:
- ⚙️ Konfiguration im Frontend: Alle Bot-Einstellungen die auch in Discord durchgeführt werden können, sind hier ebenfalls möglich.
- 😎 Einfache Bedienung: Keine Notwendigkeit Discord-Befehle manuell einzugeben - das meiste erfolgt simpel über Klicks.
- 🤖 Automatisierung und Kontrolle: Alles, was sonst über Befehle erfolgen müsste, wird per GUI zugänglich und benutzerfreundlich.
✅ ~ Features
- 🖼️ Kreatives & wunderschönes Design: Ich habe einen HAUFEN an Arbeit daran investiert, dass das Design so ansprechend wie möglich für den Endnutzer aussieht und es sollte etwas besonderes sein.
- 💚 100% Unit-Test Coverage: Software-Testing ist ein sehr wichtiger Punkt wenn man "Coding" professionell tun möchte für Kunden - daher ist das gesamte Frontend auch mit JEST in Unit-Tests getestet.
- 🚩 Sprachwechsler integriert: Da der Bot auch international Discord-Server unterstützen soll, haben wir natürlich auch im Frontend darauf geachtet, dass alles auf Englisch/Deutsch sichtbar ist.
- 📱 Responsiv für alle Geräte: Auch dies war ein wichtiges Kriterium für uns, allerdings auch ein schweres. Natürlich ist das Design für Full-HD Monitore gedacht, aber man sollte in der Regel keine Probleme mit kleineren Monitoren haben.
- 👥 Discord-Login: Das 2. Mal in meinem Leben habe ich an einer externen Login-Funktionalität gewerkelt und es war sehr interessant zu sehen wie sie funktioniert.
- 🎈 Catchy Animationen: Viele Elemente auf dieser Webseite bieten viele Animationen an, wodurch die Webseite nicht so "statisch" aussieht.
- 🔺 Arbeiten mit APIs: Es basiert auf eine eigene entwickelte Rest-API, die das Frontend regelmäßig mit Daten versorgt.
und mehr, mehr, und noch viel mehr - Es ist bisher mein größtes Projekt, schaut es euch gerne auf Github an und lasst ein ⭐ da: https://github.com/RazzerDE/clank-dashboard🧩 Tech Stack - Frontend: Angular mit TypeScript - moderne Struktur, komponentenbasiert und optimal geeignet für Dashboards und generell große Projekte. - Externe Libraries: Tailwind, Animate.css, JEST werden ebenfalls verwendet. - Backend: REST-API in Java - hier gehe ich allerdings nicht so genau darauf ein, um die Sicherheit nicht negativ zu beeinflussen 😛 - Datenbank: MariaDB mit einem Fokus auf SQL Normalformen
GitHub
GitHub - RazzerDE/clank-dashboard: 🛠️ This dashboard allows yo...
🛠️ This dashboard allows you to configure & customize my own Discord bot "Clank" without needing to use Discord directly. - RazzerDE/clank-dashboard
10 Replies
Ich liebe das Design, Es is nicht wie bei den anderen Bots wo es unübersichtlich ist, hier ist es Aufgeräumt, Clean und Modern.
<3
sieht übetrieben scheiße aus :kappa:
lügen bringt im leben nicht weiter
Deswegen lüge ich nicht
Statt dumme Kommentare zu droppen, könntest du ja mal Verbesserungsvorschläge äußern 😛
wenn ich zeit hab uum anschauen ja
Also Backend in Java finde ich geil und das Design ist natürlich auch gut abgesehen davon dass die Server-Auswahl nicht direkt offensichtlich ist
Am Anfang wählst du ja sowieso einen Server und das das Hamburger Icon was aufklappt, ist ja schon intuitiv 😛
Ja anfangs schon aber ich dachte nicht dass das Menü dafür da ist die Server-Übersicht zu öffnen