denshooter/portfolio
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
Dennis Konkol
2025-09-02 23:46:36 +00:00
parent ded873e6b4
commit 203a332306
22 changed files with 3886 additions and 194 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
app/components/Contact.tsx
View File

@@ -3,9 +3,11 @@
import { useState, useEffect } from 'react';
import { motion } from 'framer-motion';
import { Mail, Phone, MapPin, Send, Github, Linkedin, Twitter } from 'lucide-react';
import { useToast } from '@/components/Toast';
const Contact = () => {
const [mounted, setMounted] = useState(false);
const { showEmailSent, showEmailError } = useToast();
useEffect(() => {
setMounted(true);
@@ -24,12 +26,33 @@ const Contact = () => {
e.preventDefault();
setIsSubmitting(true);
// Simulate form submission
setTimeout(() => {
try {
const response = await fetch('/api/email', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
name: formData.name,
email: formData.email,
subject: formData.subject,
message: formData.message,
}),
});
if (response.ok) {
showEmailSent(formData.email);
setFormData({ name: '', email: '', subject: '', message: '' });
} else {
const errorData = await response.json();
showEmailError(errorData.error || 'Unbekannter Fehler');
}
} catch (error) {
console.error('Error sending email:', error);
showEmailError('Netzwerkfehler beim Senden der E-Mail');
} finally {
setIsSubmitting(false);
alert('Thank you for your message! I will get back to you soon.');
setFormData({ name: '', email: '', subject: '', message: '' });
}, 2000);
}
};
const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {

74
app/components/Hero.tsx
View File

@@ -3,6 +3,7 @@
import { useState, useEffect } from 'react';
import { motion } from 'framer-motion';
import { ArrowDown, Code, Zap, Rocket } from 'lucide-react';
import Image from 'next/image';
const Hero = () => {
const [mounted, setMounted] = useState(false);
@@ -70,11 +71,72 @@ const Hero = () => {
</div>
<div className="relative z-10 text-center px-4 max-w-4xl mx-auto">
{/* Profile Image */}
<motion.div
initial={{ opacity: 0, scale: 0.8, rotateY: -15 }}
animate={{ opacity: 1, scale: 1, rotateY: 0 }}
transition={{ duration: 1, delay: 0.1, ease: "easeOut" }}
className="mb-8 flex justify-center"
>
<div className="relative group">
{/* Glowing border effect */}
<div className="absolute -inset-1 bg-gradient-to-r from-blue-600 via-purple-600 to-cyan-600 rounded-full blur opacity-75 group-hover:opacity-100 transition duration-1000 group-hover:duration-200 animate-pulse"></div>
{/* Profile image container */}
<div className="relative bg-gray-900 rounded-full p-1">
<motion.div
whileHover={{ scale: 1.05, rotateY: 5 }}
transition={{ duration: 0.3 }}
className="relative w-40 h-40 md:w-48 md:h-48 lg:w-56 lg:h-56 rounded-full overflow-hidden border-4 border-gray-800"
>
<Image
src="/images/me.jpg"
alt="Dennis Konkol - Software Engineer"
fill
className="object-cover"
priority
/>
{/* Hover overlay effect */}
<div className="absolute inset-0 bg-gradient-to-t from-black/60 via-transparent to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
</motion.div>
</div>
{/* Floating tech badges around the image */}
<motion.div
initial={{ opacity: 0, scale: 0 }}
animate={{ opacity: 1, scale: 1 }}
transition={{ duration: 0.5, delay: 1.5 }}
className="absolute -top-3 -right-3 w-10 h-10 bg-blue-500 rounded-full flex items-center justify-center shadow-lg"
>
<Code className="w-5 h-5 text-white" />
</motion.div>
<motion.div
initial={{ opacity: 0, scale: 0 }}
animate={{ opacity: 1, scale: 1 }}
transition={{ duration: 0.5, delay: 1.7 }}
className="absolute -bottom-3 -left-3 w-10 h-10 bg-purple-500 rounded-full flex items-center justify-center shadow-lg"
>
<Zap className="w-5 h-5 text-white" />
</motion.div>
<motion.div
initial={{ opacity: 0, scale: 0 }}
animate={{ opacity: 1, scale: 1 }}
transition={{ duration: 0.5, delay: 1.9 }}
className="absolute -top-3 -left-3 w-10 h-10 bg-cyan-500 rounded-full flex items-center justify-center shadow-lg"
>
<Rocket className="w-5 h-5 text-white" />
</motion.div>
</div>
</motion.div>
{/* Main Title */}
<motion.h1
initial={{ opacity: 0, y: 30 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.8, delay: 0.2 }}
transition={{ duration: 0.8, delay: 0.8 }}
className="text-5xl md:text-7xl font-bold mb-6"
>
<span className="gradient-text">Dennis Konkol</span>
@@ -84,7 +146,7 @@ const Hero = () => {
<motion.p
initial={{ opacity: 0, y: 30 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.8, delay: 0.4 }}
transition={{ duration: 0.8, delay: 1.0 }}
className="text-xl md:text-2xl text-gray-300 mb-8 max-w-2xl mx-auto"
>
Student & Software Engineer based in Osnabrück, Germany
@@ -94,7 +156,7 @@ const Hero = () => {
<motion.p
initial={{ opacity: 0, y: 30 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.8, delay: 0.6 }}
transition={{ duration: 0.8, delay: 1.2 }}
className="text-lg text-gray-400 mb-12 max-w-3xl mx-auto leading-relaxed"
>
Passionate about technology, coding, and solving real-world problems.
@@ -105,7 +167,7 @@ const Hero = () => {
<motion.div
initial={{ opacity: 0, y: 30 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.8, delay: 0.8 }}
transition={{ duration: 0.8, delay: 1.4 }}
className="flex flex-wrap justify-center gap-6 mb-12"
>
{features.map((feature, index) => (
@@ -113,7 +175,7 @@ const Hero = () => {
key={feature.text}
initial={{ opacity: 0, scale: 0.8 }}
animate={{ opacity: 1, scale: 1 }}
transition={{ duration: 0.5, delay: 1 + index * 0.1 }}
transition={{ duration: 0.5, delay: 1.6 + index * 0.1 }}
whileHover={{ scale: 1.05, y: -5 }}
className="flex items-center space-x-2 px-4 py-2 rounded-full glass-card"
>
@@ -127,7 +189,7 @@ const Hero = () => {
<motion.div
initial={{ opacity: 0, y: 30 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.8, delay: 1.2 }}
transition={{ duration: 0.8, delay: 1.8 }}
className="flex flex-col sm:flex-row gap-4 justify-center items-center"
>
<motion.a

21
app/components/Projects.tsx
View File

@@ -27,12 +27,23 @@ const Projects = () => {
const [projects, setProjects] = useState<Project[]>([]);
// Load projects from localStorage
// Load projects from API
useEffect(() => {
const savedProjects = localStorage.getItem('portfolio-projects');
if (savedProjects) {
setProjects(JSON.parse(savedProjects));
}
const loadProjects = async () => {
try {
const response = await fetch('/api/projects?featured=true&published=true&limit=6');
if (response.ok) {
const data = await response.json();
setProjects(data.projects || []);
} else {
console.error('Failed to fetch projects from API');
}
} catch (error) {
console.error('Error loading projects:', error);
}
};
loadProjects();
}, []);
if (!mounted) {