feat: create dev system

AGENTS.md

@@ -32,6 +32,13 @@ Für die weitere Umsetzung bedeutet das:
 - Ein kleines, eigenständiges TypeScript-Frontend ist hier voraussichtlich passender als eine große neue Framework-Schicht.
 - Backend- und Kalenderanbindung sollten entkoppelt geplant werden, damit ein späterer Wechsel von Google Kalender zu Exchange möglich bleibt, ohne das UI neu bauen zu müssen.
 
+## Lokales Entwicklungssystem
+
+- Das lokale Setup bildet die vermutete Komponentenfamilie mit Docker Compose nach: Apache/PHP 8.3, Contao Managed Edition 5.3, MariaDB 10.11 und Adminer.
+- Frontend-Abhängigkeiten für die angenommene Originalseite sind in `package.json` vorgesehen: Bootstrap 5, jQuery und Slick Carousel; die eigene Logik bleibt in TypeScript.
+- Start über `docker compose up --build`; CMS auf Port 8080, Adminer auf Port 8081, MariaDB zusätzlich auf Host-Port 3307.
+- Das Setup ist eine reproduzierbare Entwicklungsbasis und keine Kopie der Produktivinstallation. Exakte Contao-/PHP-Versionen, Templates, Erweiterungen und Hosting-Einstellungen der Originalseite müssen bei Zugriff auf die Produktivumgebung abgeglichen werden.
+
 ## Terminarten
 
 ### Projekt Perspektivwerk

development-system/.dockerignore

@@ -0,0 +1,7 @@
+.git
+.gitignore
+node_modules
+vendor
+var
+public/assets/js
+*.log

development-system/.env.example

@@ -0,0 +1,3 @@
+APP_ENV=dev
+DATABASE_URL=mysql://perspektivwerk:perspektivwerk@db:3306/perspektivwerk?serverVersion=mariadb-10.11
+# Für lokale Entwicklung bewusst keine echten Zugangsdaten eintragen.

development-system/.gitignore

@@ -0,0 +1,6 @@
+/vendor/
+/var/
+/public/assets/js/
+/node_modules/
+/.env
+/.idea/

development-system/README.md

@@ -0,0 +1,30 @@
+# Perspektivwerk Terminbuchung – lokales Entwicklungssystem
+
+Diese Ordner enthält eine lokale Annäherung an die öffentlich erkennbare technische Basis von `sufw.de`: Contao (PHP/Symfony), Apache, MariaDB sowie die im Frontend verbreiteten Komponenten Bootstrap 5, jQuery und Slick Carousel.
+
+## Start
+
+Voraussetzungen: Docker Desktop (Compose v2) und optional Node.js 20+ für die TypeScript-Assets.
+
+```powershell
+docker compose up --build
+```
+
+Danach:
+
+- Website/CMS: <http://localhost:8080>
+- Contao-Installation: <http://localhost:8080/contao/install>
+- Datenbankinspektor: <http://localhost:8081> (Server `db`, Benutzer `perspektivwerk`, Passwort `perspektivwerk`, Datenbank `perspektivwerk`)
+
+Für die Frontend-Logik:
+
+```powershell
+npm install
+npm run build
+```
+
+## Abgrenzung zur Originalseite
+
+Die genaue Contao-, PHP- und Template-Version der öffentlichen Seite ist nicht verlässlich aus dem ausgelieferten HTML ableitbar. Das Setup bildet daher die wahrscheinlichste Komponentenfamilie nach; es ist kein Dump der Produktivinstallation. IONOS/Hosting, Matomo-Konfiguration, Inhalte, Templates und Erweiterungen müssen bei Bedarf separat ergänzt werden.
+
+Die Terminlogik liegt zunächst in `src/booking.ts`. Eine spätere Google-Calendar- oder Exchange-Anbindung sollte über eine Backend-API erfolgen, damit keine Secrets im Browser landen.

development-system/composer.json

@@ -0,0 +1,23 @@
+{
+  "name": "perspektivwerk/terminbuchung",
+  "description": "Lokale Contao-Entwicklungsumgebung für die Perspektivwerk-Terminbuchung",
+  "type": "project",
+  "require": {
+    "contao/managed-edition": "^5.3"
+  },
+  "scripts": {
+    "post-install-cmd": [
+      "Contao\\ManagerPlugin\\Bundle\\Config\\ScriptHandler::initializeApplication"
+    ],
+    "post-update-cmd": [
+      "Contao\\ManagerPlugin\\Bundle\\Config\\ScriptHandler::initializeApplication"
+    ]
+  },
+  "config": {
+    "allow-plugins": {
+      "contao/manager-plugin": true,
+      "contao-components/installer": true
+    },
+    "sort-packages": true
+  }
+}

development-system/docker-compose.yml

@@ -0,0 +1,49 @@
+services:
+  app:
+    build:
+      context: .
+      dockerfile: docker/php-apache/Dockerfile
+    ports:
+      - "8080:80"
+    environment:
+      APP_ENV: dev
+      CONTAO_ENVIRONMENT: dev
+      DATABASE_URL: mysql://perspektivwerk:perspektivwerk@db:3306/perspektivwerk?serverVersion=mariadb-10.11
+    volumes:
+      - ./:/var/www/html
+      - contao_vendor:/var/www/html/vendor
+      - contao_var:/var/www/html/var
+    depends_on:
+      db:
+        condition: service_healthy
+
+  db:
+    image: mariadb:10.11
+    restart: unless-stopped
+    environment:
+      MARIADB_DATABASE: perspektivwerk
+      MARIADB_USER: perspektivwerk
+      MARIADB_PASSWORD: perspektivwerk
+      MARIADB_ROOT_PASSWORD: root
+    ports:
+      - "3307:3306"
+    volumes:
+      - mariadb_data:/var/lib/mysql
+    healthcheck:
+      test: ["CMD", "healthcheck.sh", "--connect", "--innodb_initialized"]
+      interval: 5s
+      timeout: 5s
+      retries: 20
+
+  adminer:
+    image: adminer:4
+    ports:
+      - "8081:8080"
+    depends_on:
+      db:
+        condition: service_healthy
+
+volumes:
+  mariadb_data:
+  contao_vendor:
+  contao_var:

development-system/package.json

@@ -0,0 +1,18 @@
+{
+  "name": "perspektivwerk-booking-frontend",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "tsc",
+    "dev": "tsc --watch"
+  },
+  "dependencies": {
+    "bootstrap": "^5.3.3",
+    "jquery": "^3.7.1",
+    "slick-carousel": "^1.8.1"
+  },
+  "devDependencies": {
+    "@types/jquery": "^3.5.32",
+    "typescript": "^5.7.2"
+  }
+}

development-system/php-apache/Dockerfile

@@ -0,0 +1,22 @@
+FROM php:8.3-apache
+
+RUN apt-get update \
+    && apt-get install -y --no-install-recommends \
+       git unzip libicu-dev libzip-dev libpng-dev libjpeg62-turbo-dev libfreetype6-dev \
+    && docker-php-ext-configure gd --with-freetype --with-jpeg \
+    && docker-php-ext-install -j"$(nproc)" intl gd mysqli pdo_mysql zip opcache \
+    && a2enmod rewrite headers expires \
+    && rm -rf /var/lib/apt/lists/*
+
+COPY --from=composer:2 /usr/bin/composer /usr/bin/composer
+COPY docker/php-apache/vhost.conf /etc/apache2/sites-available/000-default.conf
+
+WORKDIR /var/www/html
+
+COPY composer.json ./
+RUN if [ -f composer.json ]; then composer install --no-interaction --prefer-dist --no-progress; fi
+
+COPY . .
+
+RUN mkdir -p var public/assets \
+    && chown -R www-data:www-data var public

development-system/php-apache/vhost.conf

@@ -0,0 +1,12 @@
+<VirtualHost *:80>
+    DocumentRoot /var/www/html/public
+
+    <Directory /var/www/html/public>
+        AllowOverride All
+        Options FollowSymLinks
+        Require all granted
+    </Directory>
+
+    ErrorLog ${APACHE_LOG_DIR}/error.log
+    CustomLog ${APACHE_LOG_DIR}/access.log combined
+</VirtualHost>

development-system/src/booking.ts

@@ -0,0 +1,21 @@
+/**
+ * Dünne, frameworkfreie Buchungslogik. Sie kann später gegen eine Backend-API
+ * oder eine Kalender-Integration ausgetauscht werden, ohne das UI neu zu bauen.
+ */
+export type BookingProject = 'perspektivwerk' | 'produktionsschule';
+
+export interface BookingOption {
+  id: string;
+  project: BookingProject;
+  title: string;
+  duration: string;
+}
+
+export const bookingOptions: BookingOption[] = [
+  { id: 'pw-erstgespraech', project: 'perspektivwerk', title: 'Erstgespräch Perspektivwerk', duration: '1 Stunde' },
+  { id: 'pw-sozpaed', project: 'perspektivwerk', title: 'Soz. Päd. Modul Perspektivwerk', duration: '4 Stunden' },
+  { id: 'pw-psy', project: 'perspektivwerk', title: 'Psy Modul Perspektivwerk', duration: '4 Stunden' },
+  { id: 'pw-praxis', project: 'perspektivwerk', title: 'Praxis Modul Perspektivwerk', duration: '1 Woche, ab Montag 08:00 Uhr' },
+  { id: 'ps-kennenlernen', project: 'produktionsschule', title: 'Voranmeldung Kennenlerntermin Produktionsschule', duration: '1 Stunde, dienstags' },
+  { id: 'ps-probearbeiten', project: 'produktionsschule', title: 'Probearbeiten', duration: '1 Woche, ab Montag 08:00 Uhr' }
+];

development-system/tsconfig.json

@@ -0,0 +1,11 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "module": "ES2020",
+    "moduleResolution": "Bundler",
+    "strict": true,
+    "noEmitOnError": true,
+    "outDir": "public/assets/js"
+  },
+  "include": ["src/**/*.ts"]
+}