joachim/me-joachimhummel-de
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Create a professional portfolio website for Joachim Hummel

Browse Source 
Implement a React-Vite portfolio website for Joachim Hummel, featuring sections for bio, competencies, projects, and contact information.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 6f3329ae-2dcc-46cc-bf2e-f58b7a5fa805
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: 93e1822d-6468-4db0-9e37-4f1f19334ba5
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/e678fe28-87ab-4437-945b-7a15e872a292/6f3329ae-2dcc-46cc-bf2e-f58b7a5fa805/MG2yXVH
Replit-Helium-Checkpoint-Created: true
This commit is contained in:
joachimhummel
2026-05-15 15:27:21 +00:00
parent 758e23e905
commit 67f0e12a21
82 changed files with 7373 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
artifacts/joachim-portfolio/src/components/projects.tsx Normal file
View File

@@ -0,0 +1,82 @@
import { motion } from "framer-motion";
import { FolderGit2, ArrowRight } from "lucide-react";
const projects = [
{
title: "SafeDocs Portal",
desc: "Sichere Upload-Plattform mit AES-256-GCM-Verschlüsselung, JWT-Auth, Passwort-Reset, Rate Limiting, Docker-Deployment",
tags: ["Docker", "Security", "AES-256"]
},
{
title: "zensend.email",
desc: "Newsletter & E-Mail-Marketing SaaS: Double-Opt-In, DSGVO, SPF/DKIM/DMARC, Zahlungsmodelle, Onboarding",
tags: ["SaaS", "Mail", "DSGVO"]
},
{
title: "KI-Automation mit n8n",
desc: "Automatisierte Bildgenerierung, Lead-Prozesse, KI-gestützte Bildprüfung, API/Webhook-Workflows",
tags: ["n8n", "AI", "API"]
},
{
title: "Eigene KI- & RAG-Systeme",
desc: "PDF-Verarbeitung, Vektorisierung, Pinecone, eigene Wissensdatenbanken",
tags: ["RAG", "Pinecone", "LLMs"]
},
{
title: "On-Premise Monitoring",
desc: "Grafana, Prometheus, Loki, Alloy Stacks auf Docker-Basis",
tags: ["Grafana", "Prometheus", "Docker"]
},
{
title: "Mailserver & Groupware",
desc: "iRedMail, Mailcow, SOGo, DNS, SPF, DKIM, DMARC, Zustellbarkeit",
tags: ["Mailcow", "DNS", "Security"]
}
];
export function Projects() {
return (
<div className="py-20 border-t border-border/50">
<motion.div
initial={{ opacity: 0, y: 20 }}
whileInView={{ opacity: 1, y: 0 }}
viewport={{ once: true, margin: "-100px" }}
transition={{ duration: 0.6 }}
>
<h2 className="text-3xl md:text-4xl font-bold mb-4 font-mono text-foreground flex items-center gap-4">
<span className="text-primary">03.</span> Ausgewählte Projekte
</h2>
<p className="text-muted-foreground max-w-2xl mb-12">
Von der sicheren Infrastruktur bis zur modernen SaaS-Lösung – in der Praxis bewährt.
</p>
<div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
{projects.map((project, index) => (
<motion.div
key={index}
initial={{ opacity: 0, y: 20 }}
whileInView={{ opacity: 1, y: 0 }}
viewport={{ once: true }}
transition={{ duration: 0.5, delay: index * 0.1 }}
className="group flex flex-col p-6 rounded-lg bg-card border border-border hover:border-primary/30 transition-all hover:shadow-[0_0_20px_rgba(0,255,255,0.05)]"
>
<div className="flex justify-between items-start mb-4">
<FolderGit2 className="w-8 h-8 text-primary" />
<ArrowRight className="w-5 h-5 text-muted-foreground opacity-0 group-hover:opacity-100 group-hover:translate-x-1 transition-all" />
</div>
<h3 className="text-xl font-bold mb-2 group-hover:text-primary transition-colors">{project.title}</h3>
<p className="text-muted-foreground mb-6 flex-grow">{project.desc}</p>
<div className="flex flex-wrap gap-2 mt-auto">
{project.tags.map((tag, tIndex) => (
<span key={tIndex} className="text-xs font-mono text-primary/80 bg-primary/10 px-2 py-1 rounded">
{tag}
</span>
))}
</div>
</motion.div>
))}
</div>
</motion.div>
</div>
);
}