HadiHz Portfolio (v3)

Architekturüberblick

graph TB
    subgraph Frontend["Next.js auf Vercel"]
        A[App Router]
        B["HeroUI-Komponenten"]
        C["Spline 3D + tsparticles + cobe"]
    end
    subgraph Backend["NestJS-API"]
        D["REST-Controller"]
        E[Prisma ORM]
        F["Swagger-Dokumentation"]
        G["Rate Limiting"]
    end
    subgraph AWS
        H[(S3-Medien)]
        I["SES-E-Mail"]
    end
    A --> D
    E --> J[(PostgreSQL)]
    D --> H & I

Der direkte Vorgänger der Seite, die Sie gerade lesen, und die erste Fassung, in der die Inhalte hinter einer echten API statt im Quelltext lagen. Das Frontend ist eine Next.js-Anwendung, die stark auf die HeroUI-Komponentenbibliothek setzt; eine Spline-3D-Szene, ein tsparticles-Hintergrund und ein cobe-Globus tragen die visuelle Identität.

Das zugehörige Backend ist ein NestJS-Dienst mit Prisma auf PostgreSQL. Er verarbeitet Medien-Uploads nach S3 über vorsignierte URLs, versendet das Kontaktformular per SES, prüft seine Konfiguration beim Start mit Joi und dokumentiert sich selbst mit Swagger.

Hauptfunktionen:

• Projekte, Kurse und Fähigkeiten über eine typisierte REST-API ausgeliefert
• Vorsignierte S3-Uploads, damit Medien nie durch den API-Prozess laufen
• Kontaktformular über AWS SES zugestellt
• Rate Limiting und DTO-Validierung an jedem Endpunkt
• Aus den Controllern generierte Swagger-Dokumentation
• Konfigurationsprüfung beim Start mit Joi
• Vercel Analytics und Speed Insights im Frontend eingebunden

Tech-Stack:

• Frontend: Next.js, React, TypeScript, HeroUI, Tailwind CSS, Spline, tsparticles
• Backend: NestJS, TypeScript, Prisma, Swagger
• Datenbank: PostgreSQL
• Infrastruktur: Vercel, AWS S3, AWS SES

Abgelöst durch den heutigen Astro-und-Strapi-Aufbau, der die JavaScript-Last deutlich gesenkt und die Inhaltspflege in ein richtiges CMS verlagert hat.