Projekte
Willkommen auf meiner Projektseite! Hier findest du eine Auswahl meiner bisherigen Arbeiten, die zeigen, was ich als Entwickler leisten kann. Die vorgestellten Projekte veranschaulichen meine Frontend-Webentwicklung Projekte und geben Einblicke in die Technologien und Fähigkeiten, die ich dabei einsetze.
Innovative Lösungen für moderne Herausforderungen
Einblick in meine Frontend-Webentwicklung Projekte
Diese Projektseite bietet dir einen umfassenden Einblick in meine bisherigen Frontend‑Webentwicklungsprojekte und zeigt, wie vielfältig meine Arbeit ist – von funktionalen Webanwendungen über interaktive Komponenten bis hin zu kreativen Webseiten mit besonderem Designanspruch. Dabei wird deutlich, dass jedes Projekt nicht nur meine technischen Fähigkeiten widerspiegelt, sondern auch, wie ich Benutzerführung, Ästhetik und Funktionalität sinnvoll miteinander verbinde, um moderne und nutzerfreundliche Weblösungen zu realisieren.
Dank meiner kontinuierlichen Weiterentwicklung nutze ich verschiedene Tools, Bibliotheken und Designansätze für unterschiedliche Projekte. Dadurch entsteht eine vielseitige Projektpalette, die zeigt, wie flexibel und zielgerichtet ich auf Anforderungen eingehe. Hier findest du sowohl klassische, responsive Landingpages als auch dynamische Anwendungen mit modernen JavaScript‑Frameworks wie Vue.js.
Gleichzeitig ist das erst der Anfang, weil ich ständig neue Fähigkeiten erlerne und bestehende Techniken vertiefe. Außerdem erschließe ich regelmäßig neue Themenfelder, um mein Wissen sinnvoll zu erweitern. Mein nächstes Ziel ist es, tiefer in moderne Webframeworks einzutauchen und zusätzlich Backend‑Entwicklung zu lernen. So kann ich künftig noch umfassendere und ganzheitlichere Weblösungen anbieten.
Auf diese Weise erhältst du einen klaren Einblick in meine bisherigen Arbeiten und meine Entwicklung als Webentwickler.
Liste von WordPress/CMS Projekte
Hier präsentiere ich verschiedene WordPress‑ und CMS‑Projekte, die unterschiedliche technische Schwerpunkte zeigen.
Durch das Akkordeon erhältst du einen klaren und gut gegliederten Zugriff auf alle Projektinformationen.
Blog
Blog - Erstellt mit WordPress und Astra Theme
- Beschreibung
Ein moderner und vollständig responsiver Blog, der mit WordPress und dem Astra Theme umgesetzt wurde. Durch das klare und ansprechende Design entsteht ein benutzerfreundliches Interface, das sowohl auf mobilen Geräten als auch auf dem Desktop überzeugt
- Funktionen
Der Blog bietet eine einfache Navigation sowie übersichtliche Kategorien und Tags, wodurch Inhalte schnell gefunden werden können. Zusätzlich ermöglichen Kommentare und die Integration sozialer Medien eine direkte Interaktion mit den Besuchern.
Herausforderungen:
- Anpassung des Astra Themes
Die individuelle Anpassung des Astra Themes an spezifische Anforderungen stellte eine Herausforderung dar, da Design und Funktionalität sorgfältig aufeinander abgestimmt werden mussten.
- Optimierung der Ladezeiten
Zusätzlich erforderte die Verbesserung der Ladezeiten gezielte Performance‑Optimierungen, um eine schnelle und reibungslose Nutzererfahrung sicherzustellen.
Linktree
Linktree
- Beschreibung
Eine moderne, Linktree‑ähnliche Seite, die mit WordPress und dem Astra Theme entwickelt wurde, um mehrere wichtige Links übersichtlich an einem zentralen Ort zu präsentieren. Durch das minimalistische Layout entsteht eine klare und leicht verständliche Oberfläche, die sowohl auf mobilen Geräten als auch auf dem Desktop überzeugt.
- Funktionen
Die Seite bietet eine einfach zu bedienende Oberfläche, wodurch Nutzer schnell auf alle wichtigen Links zugreifen können. Alle Links lassen sich flexibel anpassen, sodass Inhalte jederzeit erweitert oder aktualisiert werden können. Dank der vollständigen Mobile‑Optimierung funktioniert die Seite auf Smartphones besonders zuverlässig und lädt sehr schnell.
- Herausforderungen
Die größte Herausforderung bestand darin, ein minimalistisches Design zu entwickeln, das dennoch ansprechend wirkt und gleichzeitig eine klare, moderne Benutzerführung ermöglicht.
Sales Page
Sales Page
- Beschreibung
Eine moderne Verkaufsseite, die mit WordPress und dem Astra Theme entwickelt wurde, um Produkte wirkungsvoll zu präsentieren und gleichzeitig Marketing‑Kampagnen optimal zu unterstützen. Durch das klare Layout entsteht eine strukturierte und überzeugende Darstellung, die sowohl auf mobilen Geräten als auch auf dem Desktop zuverlässig funktioniert.
- Funktionen
Die Seite nutzt ein conversion‑optimiertes Layout, sodass Besucher schnell zu den wichtigsten Inhalten geführt werden.
Auffällige Call‑to‑Action‑Buttons erhöhen die Interaktionsrate, während Testimonials zusätzlich Vertrauen schaffen und die Kaufentscheidung positiv beeinflussen.
- Herausforderung
Die zentrale Herausforderung bestand darin, die Ladegeschwindigkeit deutlich zu steigern und gleichzeitig gezielte Maßnahmen zur Conversion‑Rate‑Optimierung umzusetzen.
Bistro-Ecke
Website mit kostenlose Domain und Hosting
Beschreibung
Ein Beispiel für eine vollständig kostenlose Webseite, die mit dem Webador Website Builder erstellt wurde und dadurch eine einfache Möglichkeit bietet, Inhalte ohne technische Vorkenntnisse online zu präsentieren. Durch das klare Layout entsteht eine übersichtliche Struktur, die sowohl auf mobilen Geräten als auch auf dem Desktop zuverlässig funktioniert.
Funktionen
Die Seite nutzt ein intuitives Drag‑and‑Drop‑Baukastensystem, sodass Inhalte schnell angepasst werden können. Dank des responsiven Designs passt sich die Darstellung automatisch an verschiedene Bildschirmgrößen an. Zusätzlich stehen grundlegende SEO‑Funktionen zur Verfügung, um die Sichtbarkeit in Suchmaschinen zu verbessern.
Herausforderung
Eine wesentliche Herausforderung bestand darin, mit den begrenzten Anpassungsmöglichkeiten und Tools von Webador zu arbeiten und dennoch ein überzeugendes Ergebnis zu erzielen.
Liste von online Shops
Diese Übersicht zeigt verschiedene Online‑Shop‑Projekte, die ich für unterschiedliche Anforderungen entwickelt habe.
Dadurch erhältst du einen klaren Eindruck meiner E‑Commerce‑Erfahrung.
Divishop
Vino – Webshop für Schönheit & Kosmetik
Beschreibung:
- Vino ist ein moderner Online‑Shop für hochwertige Beauty‑ und Kosmetikprodukte und wurde mit WordPress, Divi und WooCommerce umgesetzt.
Der Shop bietet ein elegantes, responsives Design und ermöglicht eine klare Navigation durch alle Produktbereiche.
Die Präsentation der Produkte wurde sorgfältig gestaltet, damit Nutzer schnell Vertrauen aufbauen können.
Der gesamte Shop ist auf eine optimale User Experience ausgerichtet und führt Besucher sicher durch den Bestellprozess.
Funktionen:
- Responsives Design: Das Layout passt sich automatisch allen Bildschirmgrößen an und sorgt auf Smartphones, Tablets und Desktops für ein optimales Einkaufserlebnis.
- Intuitive Navigation: Klar strukturierte Kategorien und ein benutzerfreundliches Suchsystem ermöglichen eine schnelle und einfache Produktsuche.
- WooCommerce‑Integration: Leistungsstarke Shop‑Funktionen wie Warenkorb, Bestellverwaltung und sichere Zahlungsabwicklung bilden das Herzstück des Systems.
- Individuelle Divi‑Theme‑Anpassung: Durch den Divi Page Builder wurde ein maßgeschneidertes Design umgesetzt, das die Markenidentität stärkt und flexible Gestaltungsmöglichkeiten bietet.
- Sicherheit & Performance: Optimierte Ladezeiten, regelmäßige Updates und eine solide Sicherheitsarchitektur gewährleisten einen stabilen, schnellen und geschützten Betrieb.
Herausforderungen:
- Theme‑Anpassung: Die individuelle Gestaltung mit dem Divi Theme erforderte eine präzise Abstimmung zwischen Design und Funktionalität, um ein harmonisches Erscheinungsbild ohne Performance‑Einbußen zu erreichen.
- E‑Commerce‑Integration: Die Einbindung von WooCommerce brachte komplexe Anpassungen mit sich, insbesondere bei Produktverwaltung, Zahlungsarten und Versandoptionen.
- Sicherheitsanforderungen: Zum Schutz sensibler Kundendaten waren umfangreiche Sicherheitsmaßnahmen sowie regelmäßige Tests notwendig, um einen stabilen und geschützten Betrieb sicherzustellen.
- Performance‑Optimierung: Trotz anspruchsvollem Design mussten Ladezeiten optimiert werden, um eine schnelle, flüssige Nutzererfahrung zu gewährleisten.
Liste von Web‑Applikationen (Coding‑Projekte)
Hier zeige ich dir Web‑Applikationen, die meine Programmierfähigkeiten und meinen Fokus auf moderne Webtechnologien widerspiegeln.
So erhältst du einen direkten Eindruck meiner technischen Entwicklung.
ToDo App
To-Do App
Beschreibung: Eine To-Do-App, die einfach auf das Handy heruntergeladen werden kann. Entwickelt mit HTML, CSS, JavaScript und Vue.js, um Aufgaben effizient zu verwalten.
Funktionen: Aufgaben hinzufügen/löschen/aktualisieren, Echtzeit-Datenaktualisierung, responsive Design.
- Herausforderungen: Datenpersistenz und Synchronisation über verschiedene Geräte.
Installieren Sie die Todo-App
Für Desktop-Nutzer:
- Öffnen Sie die Todo-App in Ihrem bevorzugten Webbrowser.
- Klicken Sie auf das Symbol „Zur Leseliste hinzufügen“ oder auf das Installationssymbol in der Adressleiste Ihres Browsers.
- Folgen Sie den Anweisungen auf dem Bildschirm, um die App auf Ihrem Desktop zu installieren.
- Nach der Installation können Sie die App direkt von Ihrem Desktop aus öffnen und nutzen.
Für Android-Nutzer:
- Öffnen Sie die Todo-App in Ihrem Chrome-Browser.
- Tippen Sie auf das Menü-Symbol (drei Punkte) in der oberen rechten Ecke des Browsers.
- Wählen Sie „Zum Startbildschirm hinzufügen“ aus dem Dropdown-Menü.
- Befolgen Sie die Anweisungen, um die App zu Ihrem Startbildschirm hinzuzufügen.
- Nach der Installation können Sie die App direkt von Ihrem Startbildschirm aus starten und verwenden.
DynamicData
Dynamische Tabelle
(Unter meinen Frontend Webentwicklung Projekten zählt DynamicData zu den herausforderndsten, da ich hier eine responsive Website auf Basis von HTML5 Boilerplate in Kombination mit dem Framework Vue.js entwickelt habe)
- Beschreibung: Eine einfache responsive Seite erstellt mit HTML, CSS, JavaScript und Vue.js
- Funktionen: Aufgaben hinzufügen/löschen/aktualisieren, Echtzeit-Datenaktualisierung, responsive Design.
- Herausforderungen: Integration des Vue.js-Frameworks für dynamische Inhalte.
Sandbox
🚧🚧 Frontend Sandbox 🚧🚧
Die Frontend Sandbox ist eine experimentelle Entwicklungsumgebung, in der moderne Webtechnologien wie HTML, CSS, JavaScript, GitHub‑Workflows und verschiedene Frameworks eingesetzt und getestet werden. Das Projekt dient als flexibler Raum für die Erprobung neuer Layout‑Techniken, UI‑Komponenten, Animationen, API‑Anbindungen und zeitgemäßer Frontend‑Patterns.
🚧🚧 Frontend Sandbox 🚧🚧
Die Sandbox befindet sich in aktiver Weiterentwicklung und zeigt einen strukturierten, modularen und performanceorientierten Frontend‑Workflow. Sie bietet einen transparenten Einblick in moderne Entwicklungsprozesse und demonstriert kontinuierliche technische Weiterentwicklung im Bereich der Webentwicklung.
Interne Systeme & Spezialprojekte
Diese Übersicht enthält interne Systeme und Spezialprojekte, die auf klare Abläufe und eine einfache Nutzung ausgelegt sind. Dadurch kannst du die wichtigsten Funktionen schnell erfassen.
Intranet
Zweck & Nutzung
Dazyhub ermöglicht eine strukturierte und sichere Kommunikation, weil alle Inhalte klar dargestellt und leicht zugänglich sind. Kund:innen erhalten personalisierte Seiten, die alle wichtigen Projektinformationen übersichtlich bündeln.
Sie finden dort Mockups und Designentwürfe, die den aktuellen Projektstand verständlich zeigen. Außerdem stehen Links zu Miro‑Boards, Notion‑Dokumentationen und Bildgalerien bereit, wodurch die Zusammenarbeit transparenter wird. Projektdateien, PDFs und technische Dokumente lassen sich ebenfalls zentral abrufen. Zusätzlich können individuelle Inhalte wie Briefings, Feedbackrunden oder Übergabeprotokolle eingebunden werden.
Das System bleibt ohne Login öffentlich nutzbar, während ACL‑Regeln bei Bedarf gezielte Zugriffsrechte steuern.
Technische Umsetzung
- Modularer Aufbau mit DokuWiki: leichtgewichtig, update-sicher, ohne Datenbank
- Responsive Design für Desktop und Mobilgeräte
- Template-Anpassung für klare UI und Branding
- Integration externer Tools wie Miro, Notion und Piwigo
- ACL-basiertes Rechtemanagement für individuelle Zugriffssteuerung
Dazyhub zeigt die Fähigkeit, robuste Systeme für reale Kundenbedürfnisse zu entwickeln – mit Fokus auf Klarheit, Sicherheit und langfristige Wartbarkeit.
Mockups
Mockups – Visuelle Konzepte & UI‑Prototypen
Unter „Mockups“ präsentiere ich eine Sammlung visueller Entwürfe, die ich für verschiedene fiktive Kundenprojekte erstellt habe. Diese Mockups dienen dazu, Designideen schnell, verständlich und realitätsnah darzustellen – bevor eine technische Umsetzung beginnt. Sie zeigen meinen Ansatz, komplexe Inhalte in klare, moderne und benutzerfreundliche Layouts zu übersetzen.
Enthaltene Mockups
- Restaurant Aurelia – Speisekarte
Ein elegantes, mediterran inspiriertes Layout für eine digitale Speisekarte. Fokus auf Typografie, Struktur und harmonische Farbgestaltung. - Friseursalon Bella – Website‑Konzept
Ein modernes, freundliches Mockup für einen Friseursalon. Enthält Startseite, Leistungsübersicht und visuelle Markenwelt. - DIY‑Haarlack – Blogartikel‑Design
Ein redaktionelles Mockup für einen Beauty‑Blog. Klare Struktur, lesefreundliche Typografie und visuelle Elemente zur Unterstützung des Inhalts. - Acme – Miro App‑Mockup
Ein interaktives Konzeptboard für eine fiktive Kundin der Firma Acme, erstellt in Miro. Enthält User‑Flows, UI‑Elemente, Strukturideen und visuelle Komponenten zur frühen Abstimmung im Designprozess.