-
- To get started, edit the page.tsx file.
-
-
- Looking for a starting point or more instructions? Head over to{" "}
-
- Templates
- {" "}
- or the{" "}
-
- Learning
- {" "}
- center.
-
+
+
+
+
+ {/* BIO */}
+
+
+
+ I'm {mainData.hero.name}
+
+
+
+ {mainData.hero.pronouns}
+
+
+
+ {mainData.hero.description} {mainData.hero.specialization.tech1} and {mainData.hero.specialization.tech2} .
+
+
+
+ {/* SOCIALS */}
+
+ {socialsData.map((social, index) => {
+ // Dynamické priradenie ikony
+ const LucideIcon = (Icons as any)[social.icon];
+ return (
+
+ {LucideIcon &&
+ );
+ })}
+
+
+ {/* Badges */}
+
+ {mainData.experience_tags.map(tag => (
+ {tag}
+ ))}
+
+
+ {/* PROJEKTY */}
+
+
+ {mainData.sections.projects_title}
+
+
+
+
+ {/* CONTACT ME SEKICA */}
+
);
-}
+}
\ No newline at end of file
diff --git a/src/app/projects/page.tsx b/src/app/projects/page.tsx
new file mode 100644
index 0000000..0941ba3
--- /dev/null
+++ b/src/app/projects/page.tsx
@@ -0,0 +1,95 @@
+"use client";
+import React from "react";
+import * as Icons from "lucide-react";
+import Navbar from "@/components/navbar";
+import projectsData from "@/data/projects.json";
+import workedOnData from "@/data/workedon.json";
+import projectsPageData from "@/data/projects_page.json"; // Import pre texty stránky
+
+export default function ProjectsPage() {
+ return (
+
+
+ {/* HLAVIČKA STRÁNKY */}
+
+
+ {projectsPageData.header.title}
+
+
+ {projectsPageData.header.description}
+
+
+
+ {/* ZOZNAM HLAVNÝCH PROJEKTOV */}
+
+
+ {/* SEKICA "WORKED ON" */}
+
+
+
+ {projectsPageData.sections.worked_on_title}
+
+
+
+
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/src/components/contactme.tsx b/src/components/contactme.tsx
new file mode 100644
index 0000000..90999d6
--- /dev/null
+++ b/src/components/contactme.tsx
@@ -0,0 +1,168 @@
+"use client";
+import React, { useState, useRef, useEffect } from "react";
+import { motion } from "framer-motion";
+import { Copy, Check, Send, Loader2 } from "lucide-react";
+import contactData from "@/data/contact.json";
+
+export default function ContactMe() {
+ const [copied, setCopied] = useState(false);
+ const [isMounted, setIsMounted] = useState(false);
+ const [positionedTags, setPositionedTags] = useState
([]);
+ const [status, setStatus] = useState<"idle" | "sending" | "success" | "error">("idle");
+ const constraintsRef = useRef(null);
+
+ // 1. Vyriešenie hydratácie a náhodného spawnu tagov z JSONu
+ useEffect(() => {
+ const randomized = contactData.tags.map((tag) => ({
+ ...tag,
+ initialX: Math.random() * 240 - 120, // Jemne zväčšený rozptyl
+ initialY: Math.random() * 240 - 120,
+ initialRotate: Math.random() * 40 - 20,
+ }));
+
+ setPositionedTags(randomized);
+ setIsMounted(true);
+ }, []);
+
+ const copyToClipboard = () => {
+ navigator.clipboard.writeText(contactData.config.to_email);
+ setCopied(true);
+ setTimeout(() => setCopied(false), 2000);
+ };
+
+ const handleSubmit = async (e: React.FormEvent) => {
+ e.preventDefault();
+ setStatus("sending");
+
+ const formData = new FormData(e.currentTarget);
+ const payload = {
+ firstName: formData.get("firstName"),
+ lastName: formData.get("lastName"),
+ email: formData.get("email"),
+ subject: formData.get("subject"),
+ body: formData.get("body"),
+ };
+
+ try {
+ const res = await fetch("/api/send", {
+ method: "POST",
+ headers: { "Content-Type": "application/json" },
+ body: JSON.stringify(payload),
+ });
+
+ if (res.ok) {
+ setStatus("success");
+ (e.target as HTMLFormElement).reset();
+ setTimeout(() => setStatus("idle"), 5000);
+ } else {
+ setStatus("error");
+ setTimeout(() => setStatus("idle"), 5000);
+ }
+ } catch (err) {
+ setStatus("error");
+ setTimeout(() => setStatus("idle"), 5000);
+ }
+ };
+
+ // Prevencia Hydration Mismatch
+ if (!isMounted) return
;
+
+ return (
+
+ );
+}
\ No newline at end of file
diff --git a/src/components/navbar.tsx b/src/components/navbar.tsx
new file mode 100644
index 0000000..144b5a8
--- /dev/null
+++ b/src/components/navbar.tsx
@@ -0,0 +1,113 @@
+"use client";
+import React, { useEffect, useState } from "react";
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import { motion, AnimatePresence } from "framer-motion";
+import navbarData from "@/data/navbar.json";
+
+export default function Navbar() {
+ const pathname = usePathname();
+ const [isMounted, setIsMounted] = useState(false);
+ const [activeTab, setActiveTab] = useState("");
+
+ // Funkcia na plynulý scroll
+ const performScroll = (id: string) => {
+ const element = document.getElementById(id);
+ if (element) {
+ element.scrollIntoView({ behavior: "smooth" });
+ setActiveTab(`/#${id}`);
+ }
+ };
+
+ useEffect(() => {
+ setIsMounted(true);
+
+ // Detekcia počiatočného stavu a scrollu po príchode z inej stránky
+ if (pathname === "/") {
+ const hash = window.location.hash.replace("#", "");
+ if (hash) {
+ setTimeout(() => performScroll(hash), 400); // Dlhší timeout pre istotu
+ } else {
+ setActiveTab("/#home");
+ }
+ } else {
+ setActiveTab(pathname);
+ }
+
+ const handleScroll = () => {
+ if (pathname !== "/") return;
+ if (window.scrollY < 100) {
+ setActiveTab("/#home");
+ return;
+ }
+
+ // Dynamické sledovanie sekcií z JSONu
+ navbarData.navItems.forEach((item) => {
+ if (item.href.includes("#")) {
+ const id = item.href.replace("/#", "");
+ const el = document.getElementById(id);
+ if (el) {
+ const rect = el.getBoundingClientRect();
+ if (rect.top <= 200 && rect.bottom >= 200) {
+ setActiveTab(item.href);
+ }
+ }
+ }
+ });
+ };
+
+ window.addEventListener("scroll", handleScroll);
+ return () => window.removeEventListener("scroll", handleScroll);
+ }, [pathname]);
+
+ const handleLinkClick = (e: React.MouseEvent, href: string) => {
+ if (href.startsWith("/#") && pathname === "/") {
+ e.preventDefault();
+ const id = href.replace("/#", "");
+ performScroll(id);
+ window.history.pushState(null, "", href);
+ }
+ // Ak ideme na /projects alebo z /projects na Home, necháme Next.js pracovať
+ };
+
+ return (
+
+
+ {/* LOGO Z JSONU */}
+
+ {navbarData.logo}
+
+
+
+ {navbarData.navItems.map((item) => {
+ const isActive = activeTab === item.href;
+
+ return (
+
handleLinkClick(e, item.href)}
+ className="relative px-6 py-2 text-sm font-bold transition-colors duration-500 z-10"
+ style={{ color: isActive ? "#000000" : "#9ca3af" }} // Explicitná čierna pre aktívny tab
+ >
+
+ {isActive && isMounted && (
+
+ {item.name}
+
+ );
+ })}
+
+
+ );
+}
\ No newline at end of file
diff --git a/src/data/contact.json b/src/data/contact.json
new file mode 100644
index 0000000..ca1d015
--- /dev/null
+++ b/src/data/contact.json
@@ -0,0 +1,15 @@
+{
+ "tags": [
+ { "name": "React", "color": "bg-blue-500/20 text-blue-400 border-blue-500/20" },
+ { "name": "Lead Dev.", "color": "bg-white/10 text-white border-white/20" },
+ { "name": "TypeScript", "color": "bg-purple-500/20 text-purple-400 border-purple-500/20" },
+ { "name": "Node.Js", "color": "bg-indigo-500/20 text-indigo-400 border-indigo-500/20" },
+ { "name": "Developer", "color": "bg-purple-600/20 text-purple-300 border-purple-600/20" },
+ { "name": "Minecraft Server", "color": "bg-green-500/20 text-green-400 border-green-500/20" },
+ { "name": "UI/UX", "color": "bg-orange-500/20 text-orange-400 border-orange-500/20" }
+ ],
+ "config": {
+ "from_email": "test@kadernictvotama.sk",
+ "to_email": "hello@jetomit.bio"
+ }
+}
\ No newline at end of file
diff --git a/src/data/email.html b/src/data/email.html
new file mode 100644
index 0000000..d13b3dc
--- /dev/null
+++ b/src/data/email.html
@@ -0,0 +1,109 @@
+
+
+
+
+
+
+
+
Subject
+
{{subject}}
+
+
+
+
Message Body
+
+ {{body}}
+
+
+
+
+
+ 
+