# Adam Gaiswinkler

## 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

---

## Ausgangslage & Motivation
- **Ausgangssituation**: Moderne Frontend‑Plattform für den Absolventenverein (responsive, neue Features).
- **Persönliche Motivation**:
  - Team‑Verkleinerung (6 → 3) → mehr Verantwortung.
  - Projektidentifikation & Praxis‑Blazor/ASP.NET.
- **Ziele**:
  - Oqtane‑Module (Anmeldetool, Hall‑of‑Fame).
  - Responsives UI/UX.

---

## Eingesetzte Technologien

::: 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}
::::

:::

---

## Oqtane Theme

::: columns

:::: column
- Eigen‑Navigation (bootstrap Komponenten haben nicht gepasst ).
- Systemseiten per LINQ ausblenden.
- Responsive CSS‑Media‑Queries + reines CSS‑Burger‑Menu.
- 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}
::::

:::

---

## 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).
::::

:::: column
\begin{tikzpicture}
\node[inner sep=0pt, rounded corners=5pt, clip] {\includegraphics[width=0.55\columnwidth]{Images/HallOfFameBeispiel.png}};
\end{tikzpicture}
::::

:::

---

## 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
- **Keine funktionsfähige Website** (Sommer 2025)
  - Kurz vor einem Event, kein funktionierendes CMS
  - → Schnelle **Node.js/HTML-Übergangslösung** sicherte Event-Anmeldung

---

## Learnings

\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
- **Ergebnis**:
  - Theme final & mobil-optimiert
  - Hall of Fame funktionsfähig
  - Anmeldetool einsatzbereit