neuste version meiner präsi

Defensio/04_Praesentation_Adam_Gaiswinkler.md

@@ -3,17 +3,18 @@
 ## Individueller Teil: Adam Gaiswinkler
 **Entwicklung von CMS‑Modulen & Frontend-Design**
 
-- Schwerpunkt: Oqtane-Theme, Hall-of-Fame-Modul & Anmeldetool
+- **Schwerpunkt**:
-- Ziel: Moderne, responsive Website für den HTL-Absolventenverein
+  - Oqtane-Theme
-
+  - Hall-of-Fame-Modul
-<!-- BILD: Logo HTL Ungargasse + Vereinslogo nebeneinander -->
+  - Anmeldetool
+- **Ziel**: Moderne, responsive Website für den HTL-Absolventenverein
 
 ---
 
 ## Ausgangslage & Motivation
 - **Ausgangssituation**: Moderne Frontend‑Plattform für den Absolventenverein (responsive, neue Features).
 - **Persönliche Motivation**:
-  - Team‑Verkleinerung (6 → 3) → mehr Verantwortung.
+  - Team‑Verkleinerung (6 → 3) → mehr Verantwortung.
   - Projektidentifikation & Praxis‑Blazor/ASP.NET.
 - **Ziele**:
   - Oqtane‑Module (Anmeldetool, Hall‑of‑Fame).
@@ -22,67 +23,138 @@
 ---
 
 ## Eingesetzte Technologien
-- **Tech‑Stack**: Bootstrap + Custom‑CSS, QuestPDF, Gitea, VS 2022 wechsel zu  VS Code (macOS).
 
-<!-- BILD: Logos der verwendeten Tools (Bootstrap, QuestPDF, Gitea, VS Code) nebeneinander -->
+::: columns
+
+:::: column
+- **Tech‑Stack**: 
+  - Bootstrap 
+  - Custom‑CSS
+  - QuestPDF
+  - Gitea
+  - Visual Studio 2022 → Visual Studio Code (macOS).
+::::
+
+:::: column
+\begin{tikzpicture}
+\node[inner sep=0pt, rounded corners=5pt, clip] {\includegraphics[width=0.8\columnwidth]{Images/Technologien.png}};
+\end{tikzpicture}
+::::
+
+:::
 
 ---
 
-## Umsetzung: Oqtane Theme
+## Oqtane Theme
+
+::: columns
+
+:::: column
 - Eigen‑Navigation (bootstrap Komponenten haben nicht gepasst ).
 - Systemseiten per LINQ ausblenden.
 - Responsive CSS‑Media‑Queries + reines CSS‑Burger‑Menu.
-- ControlPanel & Cookie‑Consent.
+- Cookie‑Consent (erforderlich für dsgvo konformität und gesamtheit der website ).
-![Theme Burger Ansicht](Images/ThemeBurgerMenu.png)
+::::
-<!-- BILD: Screenshot der Website-Navigation auf Desktop (volle Menüleiste) -->
+
-<!-- BILD: Screenshot des Burger-Menüs auf Mobile (aufgeklappt) -->
+:::: column
+\begin{tikzpicture}
+\node[inner sep=0pt, rounded corners=5pt, clip] {\includegraphics[width=0.55\columnwidth]{Images/BurgerMenuLiveDesign.png}};
+\end{tikzpicture}
+::::
+
+:::
 
 ---
 
-## Umsetzung: Hall of Fame
+## Hall of Fame
+
+::: columns
+
+:::: column
 - **Karten‑Grid**: Responsive Übersicht, Live‑Suche & Sortierung **in Echtzeit – kein Seitenreload** (Blazor).
 - **Detail‑Seite**: Glasmorphismus‑Design (halbtransparente Karten mit Blur-Effekt).
-- **Workflow**: Rich‑Text‑Editor, Bild‑Upload mit **Live-Vorschau** (max 5 MB), Status (Entwurf/Veröffentlicht) inkl. Eigentümer‑Check.
+::::
-- **PDF‑Export**: Professionelle Profil-PDFs server-seitig mit QuestPDF.
+
-- **Moderation**: Meldesystem über separates Interfaces‑Paket → saubere Logik-Trennung.
+:::: column
-![Screenshot eines generierten PDFs](Images/HallOfFameBeispiel.png)
+\begin{tikzpicture}
-![Screenshot HallOfFame](Images/HallOfFame.png)
+\node[inner sep=0pt, rounded corners=5pt, clip] {\includegraphics[width=0.55\columnwidth]{Images/HallOfFameBeispiel.png}};
-<!-- BILD: Screenshot des Karten-Grids mit mehreren Alumni-Einträgen -->
+\end{tikzpicture}
-<!-- BILD: Screenshot der Detailseite (Glasmorphismus-Design) -->
+::::
-<!-- BILD: Screenshot eines generierten PDFs -->
+
+:::
 
 ---
 
-## Umsetzung: Anmeldetool
+## Hall of Fame – Workflow & Export
-- Klar getrennte Ja/Nein‑Buttons (grün/rot).
-- **Live‑Feedback via Blazor**: Statusänderungen sofort sichtbar – andere Teilnehmer sehen Updates direkt.
-- Mobile-optimiert: kein Overlay-Clipping, sauberes Touch-Handling.
-- Saubere Trennung: UI-Komponente & Backend-API getrennt.
 
-<!-- BILD: Screenshot Anmeldetool mit gruenem Ja- und rotem Nein-Button -->
+::: columns
-<!-- BILD: Screenshot auf Mobile (Overlay-Ansicht) -->
+
+:::: column
+- **Workflow**: Rich‑Text‑Editor, Bild‑Upload mit **Live-Vorschau** (max 5 MB), Status (Entwurf/Veröffentlicht) inkl. Eigentümer‑Check.
+- **PDF‑Export**: Professionelle Profil-PDFs server-seitig mit QuestPDF.
+- **Moderation**: Meldesystem über separates Interfaces‑Paket → saubere Logik-Trennung.
+::::
+
+:::: column
+\begin{tikzpicture}[
+  node distance=12mm,
+  every node/.style={font=\small},
+  state/.style={rectangle, rounded corners=3pt, draw=accent, fill=accent!10, minimum width=2.4cm, minimum height=8mm, align=center, font=\small\bfseries},
+  arr/.style={->,>=stealth,thick,accent}
+]
+\node[coordinate] (start) {};
+\node[state, right=10mm of start] (draft) {Entwurf};
+\node[state, below=18mm of draft] (pub) {Veröffentlicht};
+\draw[arr] (start) -- node[above] {\scriptsize Erstellen} (draft);
+\draw[arr] (draft) to[out=135, in=45, looseness=4] node[above] {\scriptsize Speichern} (draft);
+\draw[arr, bend left=25] (draft) to node[right] {\scriptsize Veröffentlichen} (pub);
+\draw[arr, bend left=25] (pub) to node[left] {\scriptsize Zurückziehen} (draft);
+\end{tikzpicture}
+::::
+
+:::
+
+---
+
+## Anmeldetool
+- **UI**: Ja/Nein‑Buttons (grün/rot)
+- **Live‑Feedback**: Sofortige Statusänderung via Blazor
+- **Mobile**: Sauberes Touch-Handling
+- **Architektur**: UI & Backend-API getrennt
 
 ---
 
 ## Herausforderungen & Lösungen
-- **Plattformwechsel** Windows → macOS: Oqtane stark an Windows gebunden → **Visual Studio Code** als plattformübergreifende Lösung.
+- **Plattformwechsel** Windows → macOS
-- **Hosting-Ausfall** (Hetzner, Sommer 2025): kurz vor einem Event → schnelle **Node.js/HTML-Übergangslösung** sicherte Event-Anmeldung.
+  - Oqtane stark an Windows gebunden
-
+  - → **Visual Studio Code** als plattformübergreifende Lösung
-<!-- BILD: Screenshot von Visual Studio Code auf macOS -->
+- **Keine funktionsfähige Website** (Sommer 2025)
+  - Kurz vor einem Event, kein funktionierendes CMS
+  - → Schnelle **Node.js/HTML-Übergangslösung** sicherte Event-Anmeldung
 
 ---
 
 ## Learnings
-- **Technisch**: Git, CSS‑Flexbox, Blazor.
+
-- **Methodisch**: Aufgabenverteilung, regelmäßige Meetings.
+\vspace{1cm}
-- **Persönlich**: Eigeninitiative & Verantwortung.
+\begin{tikzpicture}[remember picture, overlay]
+\node at (current page.center) {
+\renewcommand{\arraystretch}{1.5}
+\begin{tabular}{c c c}
+\textbf{Technisch} & \textbf{Methodisch} & \textbf{Persönlich} \\
+\hline
+Git & Aufgabenverteilung & Eigeninitiative \\
+CSS-Flexbox & Regelmäßige Meetings & Verantwortung \\
+Blazor & & \\
+\end{tabular}
+};
+\end{tikzpicture}
 
 ---
 
 ## Fazit & Ausblick
-- Theme final, mobil, Hall of Fame & Anmeldetool funktionsfähig.
+- **Ergebnis**:
-- **Erweiterungen**: Teilnehmer‑Auswertung, Anmelde‑Limit, automatische E‑Mail‑Erinnerungen.
+  - Theme final & mobil-optimiert
-
+  - Hall of Fame funktionsfähig
-<!-- BILD: Gesamtansicht der fertigen Website (Desktop) als Abschluss-Screenshot -->
+  - Anmeldetool einsatzbereit
-