Die CMT Geschichte
Aus der Idee, die papiergeführte AWK-Auswertung zu modernisieren, entstand eine komplette Mitgliederverwaltung...
Das Ganze nahm seinen Lauf im Jahre 2015, einem WK in St-Maurice. Neben meiner Kadifunktion, welche AVs, Sport, Schiessen,
Bergerkundungen sowie AbVs durchführen beinhaltete, blieb noch reichlich Freizeit, denn das Büro musste von 0600 - 2300 besetzt sein.
Diese Bürozeit, die Arbeitsplanung war in 15 Minuten erledigt, kam somit wie gelegen.
In einer ersten Version, wie sie Ende 2015 online ging, diente dieses Tool lediglich der elektronischen Anwesenheitskontrolle.
Über die Dauer von drei WKs, sowie manch einer Pendlerfahrt kamen jedoch verschiedenste Funktionen dazu, sodass dieses Tool
zu einem kompletten Datenverwaltungstool umgebaut wurde.
Von jQuery Mobile zu Bootstrap (2015-2025)
Die erste Version des CMT wurde mit jQuery Mobile und jQuery entwickelt, was damals State-of-the-Art für mobile Webanwendungen war. Diese Version diente dem Verein treu von 2015 bis 2025. In dieser Zeit wurde die Anwendung stetig erweitert und verbessert, sodass aus der einfachen Anwesenheitskontrolle eine vollwertige Vereinsverwaltung wurde.
Die grosse Modernisierung (2025)
Nach 10 Jahren erfolgreichen Einsatz war es Zeit für eine komplette Modernisierung. Die Einstellung der Unterstützung von jQuery Mobile, sowie neue Anforderungen an Kompatibilität und Sicherheit machten eine Neuentwicklung notwendig.
Vorher (jQuery Mobile)
- • jQuery Mobile Framework
- • Monolithische Architektur
- • Veraltete UI-Patterns
- • Eingeschränkte Wartbarkeit
Nachher (Bootstrap 5.3)
- • Modern Bootstrap 5.3
- • Modulare API-Architektur
- • Vanilla JavaScript ES6+
- • Improved Performance & Security
Die Umstellung auf moderne Webtechnologien ermöglicht nun eine bessere Performance, höhere Sicherheit und eine zeitgemässe Benutzeroberfläche. Besonders die neue API-Architektur und das modulare Frontend verbessern die Wartbarkeit und Erweiterbarkeit erheblich.
Technologien
Backend
Das Backend basiert auf einer modernen PHP-Architektur mit RESTful APIs und implementiert eine sichere, sessionbasierte Benutzerverwaltung. Die Anwendung nutzt objektorientierte Prinzipien und folgt dem MVC-Pattern.
Frontend
Das Frontend nutzt modernes vanilla JavaScript mit ES6+ Features und Bootstrap 5.3. Die Benutzeroberfläche ist vollständig responsiv und folgt aktuellen Accessibility-Standards (WCAG).
Datenbank
Eine MySQL Datenbank bildet das Fundament der Anwendung. Der Datenbankzugriff erfolgt über Stored Procedures, was maximale Sicherheit und Performance gewährleistet. Die Datenintegrität wird durch referentielle Integrität sichergestellt.
Codebase Evolution
jQuery Mobile Version (2020)
| Language | Files | Code |
|---|---|---|
| JavaScript | 54 | 23,682 |
| CSS | 18 | 21,999 |
| PHP | 80 | 6,470 |
| SQL | 8 | 6,295 |
| Total | 160 | 58,446 |
Bootstrap 5.3 Version (2025)
| Language | Files | Trend |
|---|---|---|
| JavaScript | 73 | +35% |
| CSS | 1 | -94% |
| PHP | 91 | +14% |
| SQL | ~50 | +525% |
| Total | 215 | +34% |
Hinweis: Statistik exklusive Drittanbieter-Bibliotheken (PHPMailer: 126 Dateien, node_modules ausgeschlossen)
Sicherheitsarchitektur
Authentifizierung
Die Benutzerauthentifizierung erfolgt über ein mehrstufiges Sicherheitssystem. Passwörter werden mit modernsten Hashing-Algorithmen geschützt gespeichert. Ein automatisches Account-Sperrsystem schützt vor Brute-Force-Angriffen.
Autorisierung
Ein rollenbasiertes Zugriffskonzept (RBAC) mit verschiedenen Berechtigungsstufen (Administrator, Vorstand, Leiter, Mitglied) steuert den Zugriff auf Funktionen und Daten.
Session-Sicherheit
Sichere Session-Verwaltung mit automatischer ID-Regeneration, Fingerprint-Validierung und Timeout-Mechanismen. CSRF-Schutz und strikte Cookie-Sicherheit sind implementiert.
Datenbankzugriff
Der Datenbankzugriff erfolgt ausschliesslich über parametrisierte Stored Procedures mit rollenbasierten Berechtigungen. Alle API-Endpunkte sind durch Attribut-basierte Zugriffskontrolle geschützt.