# JudoWeb Eine moderne Webanwendung für das Judoteam Stadtlohn - mit Vereinspräsentation und Verwaltungssystem. ## Projektbeschreibung JudoWeb ist eine Full-Stack-Webanwendung, die zwei Hauptzwecke erfüllt: - **Öffentliche Vereinswebsite**: Präsentation des Judoclubs mit Informationen zu Judo, Vereinswerten (Respekt, Disziplin, Selbstbehauptung) und Veranstaltungen - **Verwaltungssystem**: Benutzerverwaltung, Registrierung und Altersgruppenmanagement ### Features - Responsive Homepage mit Bildkarussell (Würfe, Haltetechniken, Stabilitätstraining) - Veranstaltungsübersicht (Nikolausturnier, Wettkämpfe, Kinoabende) - Benutzerauthentifizierung mit Registrierungsschlüsseln - Altersgruppenmanagement - Dark/Light Theme-Umschaltung - Mobile-optimiertes Design ## Technologie-Stack ### Backend - **.NET 9.0** mit ASP.NET Core Web API - **Entity Framework Core 9** - ORM - **ASP.NET Core Identity** - Authentifizierung - **Swagger/Swashbuckle** - API-Dokumentation ### Frontend - **Vue.js 3** mit TypeScript - **Vite** - Build-Tool und Entwicklungsserver - **Vuetify 3** - Material Design Komponenten - **Vue Router** - Client-seitiges Routing ### Datenbank - **SQLite** (Entwicklung) - **PostgreSQL** (Produktion) ### Zusätzliche Services - **Plunk** - E-Mail-Versand ## Projektstruktur ``` JudoWeb/ ├── API/ # Backend (.NET) │ ├── Controllers/ # API-Endpunkte │ │ ├── AgeGroupController.cs │ │ ├── AuthController.cs │ │ └── RegistrationKeyController.cs │ ├── Models/ │ │ ├── Internal/ # Domain-Modelle │ │ └── Outgoing/ # DTOs │ ├── Database/ # EF Core Kontext │ ├── Repository/ # Datenzugriff │ ├── Services/ # Business-Logik │ └── Migrations/ # Datenbank-Migrationen │ ├── GUI/ # Frontend (Vue.js) │ ├── src/ │ │ ├── routes/ # Seiten-Komponenten │ │ ├── components/ # Wiederverwendbare Komponenten │ │ ├── plugins/ # Vue-Plugins │ │ └── router/ # Router-Konfiguration │ └── public/static/ # Statische Assets │ └── JudoWeb.sln # Visual Studio Solution ``` ## Installation & Setup ### Voraussetzungen - [.NET 9.0 SDK](https://dotnet.microsoft.com/download) - [Node.js](https://nodejs.org/) (LTS-Version empfohlen) - Optional: [Visual Studio 2022](https://visualstudio.microsoft.com/) oder [VS Code](https://code.visualstudio.com/) ### Frontend einrichten ```bash cd GUI npm install ``` ### Backend einrichten ```bash cd API dotnet restore ``` ## Entwicklung starten ### Frontend (mit Hot-Reload) ```bash cd GUI npm run dev ``` Der Entwicklungsserver startet unter `http://localhost:5173` ### Backend ```bash cd API dotnet run ``` Die API ist verfügbar unter: - HTTP: `http://localhost:5246` - HTTPS: `https://localhost:7248` - Swagger UI: `https://localhost:7248/swagger` ## Verfügbare Scripts ### Frontend (GUI/) | Befehl | Beschreibung | |--------|--------------| | `npm run dev` | Startet Entwicklungsserver | | `npm run build` | Erstellt Produktions-Build | | `npm run test:unit` | Führt Unit-Tests aus | | `npm run type-check` | TypeScript-Typprüfung | | `npm run format` | Code-Formatierung mit Prettier | ### Backend (API/) | Befehl | Beschreibung | |--------|--------------| | `dotnet run` | Startet Entwicklungsserver | | `dotnet build` | Kompiliert das Projekt | | `dotnet publish -c Release` | Erstellt Produktions-Build | | `dotnet ef database update` | Wendet Migrationen an | ## Datenbank-Konfiguration Die Anwendung wählt automatisch die Datenbank basierend auf der Konfiguration: 1. **PostgreSQL** (Produktion): Wenn `PostgresConnection` in `appsettings.json` oder als Umgebungsvariable gesetzt ist 2. **SQLite** (Entwicklung): Standardmäßig wird `app.db` verwendet Datenbank-Migrationen werden beim Anwendungsstart automatisch ausgeführt. ### Beispiel PostgreSQL-Konfiguration ```json { "ConnectionStrings": { "PostgresConnection": "Host=localhost;Database=judoweb;Username=user;Password=pass" } } ``` ## API-Endpunkte | Endpunkt | Beschreibung | |----------|--------------| | `GET /api/ageGroups` | Alle Altersgruppen abrufen | | `POST /api/ageGroups` | Neue Altersgruppe erstellen | | `PUT /api/ageGroups/{id}` | Altersgruppe aktualisieren | | `DELETE /api/ageGroups/{id}` | Altersgruppe löschen | | `POST /api/account/register` | Benutzer registrieren | | `POST /api/account/login` | Benutzer anmelden | | `GET /api/registrationKey` | Registrierungsschlüssel abrufen | Vollständige API-Dokumentation ist über Swagger UI verfügbar. ## Produktion ### Frontend bauen ```bash cd GUI npm run build ``` Das Build wird in `../wwwroot/` ausgegeben und vom Backend als statische Dateien serviert. ### Backend publizieren ```bash cd API dotnet publish -c Release -o ./publish ``` ## Lizenz Dieses Projekt ist proprietär und gehört dem Judoteam Stadtlohn.