# 4Gewinnt 🎮

Ein modernes **Vier-Gewinnt**-Projekt mit:

- **ASP.NET Core Web API + SignalR** (Backend)
- **Vue 3 + TypeScript + Vite** (Frontend)

Ziel ist ein flüssiges Online-Spielerlebnis mit Lobby/Spiel-Code, Echtzeit-Zügen und sauberer Trennung zwischen UI und Spiellogik.

## Features

- Online-Multiplayer über SignalR-Hub (`/api/gamehub`)
- Spielfelder mit variabler Größe
- Lobby-System mit 6-stelligem Spielcode
- Spielstatus-Events in Echtzeit (`GameStarted`, `FieldUpdated`, `GameEnded`)
- Lokaler Modus im Frontend

## Projektstruktur

```text
4Gewinnt/
├── API/                 # .NET 9 Backend (REST + SignalR)
│   ├── Controllers/     # HTTP- und Hub-Endpunkte
│   ├── Models/          # Domänenmodelle (Game, Player, Field, DTOs)
│   ├── Repository/      # In-Memory Datenhaltung
│   └── Services/        # GameManager mit Spielregeln/Use-Cases
├── GUI/                 # Vue 3 Frontend
│   ├── src/components/  # UI-Komponenten
│   ├── src/routes/      # Seiten (Local/Online)
│   └── src/scripts/     # Spiel- und SignalR-Logik
└── 4Gewinnt.sln
```

## Voraussetzungen

- **.NET SDK 9**
- **Node.js 20+** (laut `package.json`: `^20.19.0 || >=22.12.0`)
- npm

## Schnellstart (Entwicklung)

### 1) Backend starten

```bash
cd API
dotnet run
```

Backend läuft standardmäßig auf einem lokalen ASP.NET-Port (siehe Terminalausgabe).

### 2) Frontend starten

```bash
cd GUI
npm install
npm run dev
```

Danach Vite-URL im Browser öffnen (z. B. `http://localhost:5173`).

## Build für Produktion

### Frontend bauen

```bash
cd GUI
npm install
npm run build
```

### Backend bauen

```bash
cd API
dotnet build
```

## API/Hub-Überblick

- Healthcheck: `GET /api/status`
- SignalR Hub: `/api/gamehub`
  - `CreateGame(playerName, gFs)`
  - `JoinGame(playerName, gameCode)`
  - `RequestGameInformation(gameId)`
  - `Drop(gameId, column)`

## Hinweise

- Das Spiel verwendet derzeit eine In-Memory-Repository-Implementierung (kein persistenter Speicher).
- Bei Disconnects oder Spielende werden Spiele zeitgesteuert entfernt.