Logo
link sharing app screenshot

Link Sharing App

azureazure-blob-storagenext.jsprismareactreact-hook-formstorybooktailwindcsstypescriptzod

Link Sharing App

Die Link Sharing App ist eine voll funktionsfähige Full-Stack-Anwendung, mit der Nutzer:innen personalisierte Profile mit Links zu ihren Social-Media-Konten erstellen und teilen können. Entwickelt mit modernen Webtechnologien bietet die App eine nahtlose und intuitive Benutzererfahrung – inklusive sicherer Authentifizierung, Echtzeit-Aktualisierungen und vollständig responsivem Design. Dieses Projekt demonstriert meine Expertise im Aufbau skalierbarer, benutzerfreundlicher Anwendungen mit einem leistungsstarken Tech-Stack.

Anforderungen

Nutzer:innen können:

  • Sich registrieren und anmelden, um ein personalisiertes Konto zu erstellen
  • Social-Media-Links hinzufügen, bearbeiten und löschen
  • Links per Drag-and-Drop neu anordnen
  • Profilbilder hochladen, aktualisieren und löschen
  • Vor- und Nachname sowie E-Mail-Adresse aktualisieren
  • In Echtzeit eine Vorschau ihres Profils während der Bearbeitung anzeigen
  • Den öffentlichen Profil-Link in die Zwischenablage kopieren, um ihn zu teilen
  • Ihr öffentliches Profil mit allen Links und Details anzeigen
  • Die App auf jedem Gerät nutzen – dank vollständig responsivem Design

Verwendete Technologien

Code-Qualität

Projekt-Highlights

  • Account-Verwaltung: Nutzer:innen können sich sicher registrieren, anmelden und ihre personalisierten Profile verwalten.
  • Link-Verwaltung: Social-Media-Links hinzufügen, bearbeiten, löschen und per Drag-and-Drop in Echtzeit neu anordnen.
  • Profilbild-Verwaltung: Profilbilder über Azure Blob Storage hochladen und verwalten, inklusive sofortiger UI-Aktualisierung und Löschoption.
  • Dynamische Vorschauen: Echtzeit-Vorschau der Profile mit Zustand zur State-Verwaltung.
  • Responsives Design: Optimiert für Mobilgeräte, Tablets und Desktops mit adaptiven Layouts und intuitiven Designelementen.
  • Formularhandling und Validierung: Mit React Hook Form und Zod für reibungslose, robuste Formularinteraktionen inklusive Validierung und Fehlermeldungen.
  • Datenbankintegration: Nutzung von Prisma und PostgreSQL für effiziente und sichere Datenspeicherung und -verwaltung.
  • Öffentliches Profil teilen: Erstellen eines teilbaren öffentlichen Links zum Profil mit Kopierfunktion für die Zwischenablage.
  • Drag-and-Drop: Intuitive Neuordnung der Social-Links mit sofortiger Synchronisation in State und Datenbank.
  • Zugänglich und skalierbar: Entwickelt mit modernen Webtechnologien wie Next.js für Skalierbarkeit und Zukunftssicherheit.

Demo-Video

Hier geht's zum Demo-Video, um die App in Aktion zu sehen.