+ {/* Header */}
+
- {/* Grid Background subtil */}
-
+
+ À propos de moi
+
+
+ Développeur web créatif, combinant frontend et backend pour des
+ solutions digitales impactantes
+
+
-
- {/* Header */}
-
+ {/* Large card - Présentation */}
+
+
+
+ Créateur d'expériences digitales
+
+
+ Passionné par le développement web, je crée des applications
+ modernes, performantes et élégantes. Mon objectif est de
+ transformer des idées en solutions digitales innovantes.
+
+
+ Avec une expertise en développement full-stack, je maîtrise aussi
+ bien le front-end que le back-end, me permettant de concevoir des
+ projets de A à Z.
+
+
+
+ {/* Small cards - Stats/Features */}
+
+
+
+ Code Propre
+
+
+ Architecture scalable et maintenable
+
+
+
+
+
+
+ Performance
+
+
+ Applications ultra-rapides et optimisées
+
+
+
+
+
+
+ Innovation
+
+
+ Technologies modernes et best practices
+
+
+
+ {/* Technologies grid */}
+
+
+ Stack Technique
+
+
+ {technologies.map((tech) => (
+
-
- À propos de moi
-
-
- Développeur web créatif, combinant frontend et backend
- pour des solutions digitales impactantes
-
-
-
- {/* Bento Grid */}
-
- {/* Large card - Présentation */}
-
-
-
- Créateur d'expériences digitales
-
-
- Passionné par le développement web, je crée des
- applications modernes, performantes et élégantes.
- Mon objectif est de transformer des idées en
- solutions digitales innovantes.
-
-
- Avec une expertise en développement full-stack, je
- maîtrise aussi bien le front-end que le back-end, me
- permettant de concevoir des projets de A à Z.
-
-
-
- {/* Small cards - Stats/Features */}
-
-
-
- Code Propre
-
-
- Architecture scalable et maintenable
-
-
-
-
-
-
- Performance
-
-
- Applications ultra-rapides et optimisées
-
-
-
-
-
-
- Innovation
-
-
- Technologies modernes et best practices
-
-
-
- {/* Technologies grid */}
-
-
- Stack Technique
-
-
- {technologies.map((tech) => (
-
- {tech}
-
- ))}
-
+ {tech}
+ ))}
-
- );
+
+
+
+ );
}
diff --git a/component/sections/Contact.tsx b/component/sections/Contact.tsx
index 7a57f48..5ac1eb3 100644
--- a/component/sections/Contact.tsx
+++ b/component/sections/Contact.tsx
@@ -3,386 +3,352 @@
import { Turnstile } from "@marsidev/react-turnstile";
import { motion, useInView } from "framer-motion";
import {
- AlertCircle,
- CheckCircle2,
- Github,
- Linkedin,
- Mail,
- Send,
- Sparkles,
+ AlertCircle,
+ CheckCircle2,
+ Github,
+ Linkedin,
+ Mail,
+ Send,
+ Sparkles,
} from "lucide-react";
import { useRef, useState } from "react";
const contactMethods = [
- {
- icon: Mail,
- label: "Email",
- value: "contact@jessy-david.dev",
- href: "mailto:contact@jessy-david.dev",
- color: "from-blue-500 to-cyan-500",
- },
- {
- icon: Github,
- label: "GitHub",
- value: "@jessydavid",
- href: "https://github.com/jessydavid-dev",
- color: "from-slate-700 to-slate-900",
- },
- {
- icon: Linkedin,
- label: "LinkedIn",
- value: "Jessy David",
- href: "https://linkedin.com/in/jessy-david",
- color: "from-blue-600 to-blue-800",
- },
+ {
+ icon: Mail,
+ label: "Email",
+ value: "contact@jessy-david.dev",
+ href: "mailto:contact@jessy-david.dev",
+ color: "from-blue-500 to-cyan-500",
+ },
+ {
+ icon: Github,
+ label: "GitHub",
+ value: "@jessydavid",
+ href: "https://github.com/jessy-david-dev",
+ color: "from-slate-700 to-slate-900",
+ },
+ {
+ icon: Linkedin,
+ label: "LinkedIn",
+ value: "Jessy David",
+ href: "https://linkedin.com/in/jessy-david",
+ color: "from-blue-600 to-blue-800",
+ },
];
export default function Contact() {
- const ref = useRef(null);
- const isInView = useInView(ref, { once: false, amount: 0.2 });
- const [isSubmitted, setIsSubmitted] = useState(false);
- const [isSubmitting, setIsSubmitting] = useState(false);
- const [error, setError] = useState("");
- const [captchaToken, setCaptchaToken] = useState
("");
+ const ref = useRef(null);
+ const isInView = useInView(ref, { once: false, amount: 0.2 });
+ const [isSubmitted, setIsSubmitted] = useState(false);
+ const [isSubmitting, setIsSubmitting] = useState(false);
+ const [error, setError] = useState("");
+ const [captchaToken, setCaptchaToken] = useState("");
- const handleSubmit = async (e: React.FormEvent) => {
- e.preventDefault();
+ const handleSubmit = async (e: React.FormEvent) => {
+ e.preventDefault();
- const form = e.currentTarget;
+ const form = e.currentTarget;
- setIsSubmitting(true);
- setError("");
- setIsSubmitted(false);
+ setIsSubmitting(true);
+ setError("");
+ setIsSubmitted(false);
- if (!captchaToken) {
- setError("Veuillez valider le captcha");
- setIsSubmitting(false);
- return;
- }
+ if (!captchaToken) {
+ setError("Veuillez valider le captcha");
+ setIsSubmitting(false);
+ return;
+ }
- const formData = new FormData(form);
- const data = {
- name: formData.get("name") as string,
- email: formData.get("email") as string,
- message: formData.get("message") as string,
- captchaToken,
- };
-
- try {
- const response = await fetch("/api/contact", {
- method: "POST",
- headers: {
- "Content-Type": "application/json",
- },
- body: JSON.stringify(data),
- });
-
- if (!response.ok) {
- const result = await response.json();
- throw new Error(result.error || "Erreur lors de l'envoi");
- }
-
- const result = await response.json();
- console.log("Succès:", result);
-
- setIsSubmitted(true);
- form.reset();
- setCaptchaToken("");
- setTimeout(() => setIsSubmitted(false), 5000);
- } catch (err) {
- console.error("Erreur:", err);
- setError(
- err instanceof Error
- ? err.message
- : "Impossible d'envoyer le message."
- );
- setCaptchaToken("");
- } finally {
- setIsSubmitting(false);
- }
+ const formData = new FormData(form);
+ const data = {
+ name: formData.get("name") as string,
+ email: formData.get("email") as string,
+ message: formData.get("message") as string,
+ captchaToken,
};
- return (
-