diff --git a/Defensio/04_Praesentation_Adam_Gaiswinkler.md b/Defensio/04_Praesentation_Adam_Gaiswinkler.md index a2f071f..35397ad 100644 --- a/Defensio/04_Praesentation_Adam_Gaiswinkler.md +++ b/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 -- Ziel: Moderne, responsive Website für den HTL-Absolventenverein - - +- **Schwerpunkt**: + - Oqtane-Theme + - Hall-of-Fame-Modul + - 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). - +::: 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. -![Theme Burger Ansicht](Images/ThemeBurgerMenu.png) - - +- Cookie‑Consent (erforderlich für dsgvo konformität und gesamtheit der website ). +:::: + +:::: 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. -![Screenshot eines generierten PDFs](Images/HallOfFameBeispiel.png) -![Screenshot HallOfFame](Images/HallOfFame.png) - - - +:::: + +:::: column +\begin{tikzpicture} +\node[inner sep=0pt, rounded corners=5pt, clip] {\includegraphics[width=0.55\columnwidth]{Images/HallOfFameBeispiel.png}}; +\end{tikzpicture} +:::: + +::: --- -## Umsetzung: Anmeldetool -- 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. +## Hall of Fame – Workflow & Export - - +::: columns + +:::: 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. -- **Hosting-Ausfall** (Hetzner, Sommer 2025): kurz vor einem Event → schnelle **Node.js/HTML-Übergangslösung** sicherte Event-Anmeldung. - - +- **Plattformwechsel** Windows → macOS + - Oqtane stark an Windows gebunden + - → **Visual Studio Code** als plattformübergreifende Lösung +- **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. -- **Persönlich**: Eigeninitiative & Verantwortung. + +\vspace{1cm} +\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. -- **Erweiterungen**: Teilnehmer‑Auswertung, Anmelde‑Limit, automatische E‑Mail‑Erinnerungen. - - - +- **Ergebnis**: + - Theme final & mobil-optimiert + - Hall of Fame funktionsfähig + - Anmeldetool einsatzbereit diff --git a/Defensio/Images/BurgerMenuLiveDesign.png b/Defensio/Images/BurgerMenuLiveDesign.png new file mode 100644 index 0000000..5aca188 Binary files /dev/null and b/Defensio/Images/BurgerMenuLiveDesign.png differ diff --git a/Defensio/Images/Technologien.png b/Defensio/Images/Technologien.png new file mode 100644 index 0000000..b0d8d00 Binary files /dev/null and b/Defensio/Images/Technologien.png differ diff --git a/Defensio/Images/ThemeBurgerMenu.png b/Defensio/Images/ThemeBurgerMenu.png deleted file mode 100644 index 4244a49..0000000 Binary files a/Defensio/Images/ThemeBurgerMenu.png and /dev/null differ