-
-
- {/* Image/Avatar */}
-
-
-
- {/* Content */}
-
-
- About Me
-
-
- Hey, I'm{" "}
- Klesti Selimaj
-
-
- A 16-year-old software engineer from Albania with 6+ years of
- experience. I'm passionate about building low-level systems and
- beautiful user interfaces.
-
-
- My journey started at age 10 when I had my first laptop (a Asus
- with pre installed endless linux), and since then I've been
- hooked on computers, but i didn't exactly know what programming
- was but i was doing it unconsciously, making winforms apps in c#
- with visual studio.
-
-
- {/* Quick Info */}
-
-
-
- {/* Social Links */}
-
- {socialLinks.map(([link, Icon], i) => (
-
-
- ))}
-
-
-
-
-
-
- Available
- */}
-
-
-
- {/* Floating badges */}
- {/*
- 
-
-
-
-
-
-
-
-
-
-
- {techStack.map((tech, index) => (
-
-
- ))}
-
-
-
-
- Tech Stack
-
-
-
- - Tools I Work With -
-- A carefully curated set of technologies that I use to build - exceptional products. -
-
-
- - {tech.name} -
-
-
- {achievements.map((achievement, index) => (
-
-
- ))}
-
-
-
-
- Recognition
-
-
-
- - My Achievements -
-- Achievements earned through consistent contributions and learning. -
-
-
- - {achievement.title} -
-- {achievement.description} -
-
-
-
-
- Journey
-
-
-
- - My Story -
-- From curious kid to entrepreneurial developer, here's how I got - here. -
-
- {timeline.map((item, index) => (
-
- {/* Line */}
- {index !== timeline.length - 1 && (
-
- )}
-
- {/* Dot */}
-
- ))}
-
-
-
-
- {/* Content */}
-
-
- {item.year.slice(2)}
-
-
-
-
-
-
- {item.year}
-
-
- - {item.title} -
-- {item.description} -
-
-
-
-
- Philosophy
-
-
-
- - "One day or Day one?" --
- Klesti Selimaj
-
- {children}
-
-
-
-
- );
-}
diff --git a/src/app/page.tsx b/src/app/page.tsx
deleted file mode 100644
index 27944e3..0000000
--- a/src/app/page.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import { HeroSection } from "@/components/home/HeroSection";
-import { ProjectsSection } from "@/components/home/ProjectsSection";
-import { SkillsSection } from "@/components/home/SkillsSection";
-import { CTASection } from "@/components/home/CTASection";
-
-export default function Home() {
- return (
- <>
-
-
-
- Pricing
-
-
-
- - Fair Pricing for{" "} - Premium Quality -
-- Choose a plan that fits your needs. -
- -- Payments are accepted in crypto. -
-
-
-
- {plans.map((plan, index) => (
- setHoveredPlan(plan.name)}
- onMouseLeave={() => setHoveredPlan(null)}
- >
- {plan.popular && (
-
- {plan.cta}
-
-
-
-
-
- ))}
-
-
-
- Most Popular
-
-
- )}
-
-
-
-
-
-
- - {plan.name} -
-- {plan.description} -
- -
-
- {plan.price}
-
- {plan.period !== "quote" && (
-
- /{plan.period}
-
- )}
-
-
- -
- {plan.features.map((feature) => (
-
-
-
- {feature} -
- ))}
-
-
-
- Services
-
-
-
-
- {services.map((service, index) => (
-
-
- ))}
-
-
- - What I Offer -
-- From concept to deployment, I provide end-to-end development - services tailored to your needs. -
-- {service.title} -
-- {service.description} -
-
-
-
- Schedule a Call
-
-
-
- - Have a Custom Project in Mind? -
-- Let's discuss your requirements and create a tailored solution - that exceeds expectations. -
-
+ {/* Section label */}
+
+ > about.me
+
+
+ {/* Left: Text */}
+
+
+
+ Building the future,
+
+
+
+
+ {/* Right: Visual */}
+
+ Building the future,
+
+ one commit at a time.
+
+
+
+
+
+ {/* Highlights grid */}
+ + I'm{" "} + + Klesti Selimaj + {" "} + — a 16-year-old software developer and entrepreneur from Albania + with 6 years of hands-on experience. I started coding at 10 and + never stopped. +
++ My passion lies in{" "} + + low-level systems programming + + , building developer tools, and crafting polished user + experiences. I work primarily in{" "} + Rust and{" "} + TypeScript, and I'm + deeply interested in hacking, Linux internals, and TUI + applications. +
++ Beyond code, I'm building towards a successful SaaS product — + combining my technical depth with an entrepreneurial mindset to + create tools that developers actually want to use. +
+
+ {highlights.map((h) => (
+
+
+ {/* Social links */}
+
+
+ ))}
+
+
+ {
+
+
+
+ {h.label}
+
+
+ {h.value}
+
+
+ {[
+ {
+ label: "GitHub",
+ href: "https://github.com/selimaj-dev",
+ icon: "⌥",
+ },
+ {
+ label: "YouTube",
+ href: "https://youtube.com/@SelimajDev",
+ icon: "▶",
+ },
+ {
+ label: "Instagram",
+ href: "https://instagram.com/selimaj.dev",
+ icon: "◈",
+ },
+ ].map((s) => (
+
+ {s.icon}
+ {s.label}
+
+ ))}
+
+
+
+
+ {/* Glow behind image */}
+
+
+
+ 
+ {/* Overlay with terminal text */}
+
+
+
+
+ ${" "}
+ whoami
+
+
+ Klesti Selimaj
+
+
+ uid=1000(klesti) groups=dev,entrepreneur
+
+
+ {/* Header */}
+
+
+
+ Let's Build
+
+
+
+ {/* Contact cards */}
+ > contact --open
+
+ Let's Build
+
+ Something Together
+
+ + I'm always open to interesting projects, collaborations, or just a good conversation + about tech. Reach out through any of the channels below. +
+
+
+
+ {contactLinks.map((link) => {
+ const Icon = link.icon;
+ return (
+
+
+
+ {/* Big CTA */}
+
+
+
+
+
+
+
+ );
+ })}
+
+ {link.label}
+
+ {link.handle}
+
+ {link.description}
+
+
+
+ > open_to_work --status
+ + Open to freelance & collaboration +
++ Looking for interesting projects, SaaS co-founders, or clients who need + a developer who ships fast and cares about quality. +
+ +
+
+ );
+ }
+
+ return this.props.children;
+ }
+}
+
+export default ErrorBoundary;
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
new file mode 100644
index 0000000..29de32f
--- /dev/null
+++ b/src/components/Footer.tsx
@@ -0,0 +1,59 @@
+/*
+ * FOOTER — selimaj.dev
+ * Design: Glassmorphic Terminal
+ * Minimal footer with branding and links
+ */
+
+export default function Footer() {
+ const year = new Date().getFullYear();
+
+ return (
+
+ );
+}
diff --git a/src/components/HeroSection.tsx b/src/components/HeroSection.tsx
new file mode 100644
index 0000000..c2f436b
--- /dev/null
+++ b/src/components/HeroSection.tsx
@@ -0,0 +1,167 @@
+/*
+ * HERO SECTION — selimaj.dev
+ * Design: Glassmorphic Terminal
+ * Full-viewport dark hero with animated background image, typewriter effect, and glass CTA
+ */
+
+import { useEffect, useState } from "react";
+
+const HERO_BG = "https://d2xsxph8kpxj0f.cloudfront.net/310519663439135967/RkRL4wd7YzNoLyaN7suWbR/hero-bg-G3393XyTzqxu3D4dR63od8.webp";
+
+const typewriterPhrases = [
+ "Software Developer.",
+ "Entrepreneur.",
+ "SaaS Builder.",
+ "Systems Programmer.",
+ "Open Source Contributor.",
+];
+
+function useTypewriter(phrases: string[], speed = 60, pause = 1800) {
+ const [display, setDisplay] = useState("");
+ const [phraseIdx, setPhraseIdx] = useState(0);
+ const [charIdx, setCharIdx] = useState(0);
+ const [deleting, setDeleting] = useState(false);
+
+ useEffect(() => {
+ const current = phrases[phraseIdx];
+ let timeout: ReturnType
+
+ An unexpected error occurred.
+ +
+
+
+
+
+ {this.state.error?.stack}
+
+
+ {/* Terminal label */}
+
+ Klesti
+
+
+ {/* Typewriter subtitle */}
+
+
+ {/* Scroll indicator */}
+
+
+
+ > klesti@selimaj.dev ~ $
+
+
+
+ {/* Main heading */}
+
+ Klesti
+
+ Selimaj
+
+
+ {/* Typewriter subtitle */}
+
+ {typed}
+ |
+
+
+ {/* Description */}
+
+ 16 years old · 6 years of experience · Albania
+
+ Passionate about low-level systems, hacking, UI/UX, and making cool tools.
+
+
+
+
+
+ {/* Stats row */}
+
+ {[
+ { value: "6+", label: "Years Experience" },
+ { value: "35+", label: "Repositories" },
+ { value: "2,670+", label: "Contributions / Year" },
+ { value: "#2", label: "National GitHub user" },
+ ].map((stat) => (
+
+
+
+ ))}
+
+ {stat.value}
+
+ {stat.label}
+
+
+ scroll
+
+
+
+
+ {/* Description */}
+
+ {project.tag && (
+
+ {project.tag}
+
+ )}
+
+ + {project.org ? ( + {project.org}/ + ) : null} + {project.name} +
++ {project.description} +
+ + {/* Footer */} +
+
+
+ {project.language}
+
+
+
+
+ );
+}
+
+export default function ProjectsSection() {
+ const headerRef = useReveal();
+ const gridRef = useReveal(0.05);
+
+ const featured = projects.filter((p) => p.featured);
+ const rest = projects.filter((p) => !p.featured);
+
+ return (
+
+ {/* Header */}
+
+
+
+
+ {/* Featured projects (larger cards) */}
+ > ls projects/
+
+
+ Things I've
+
+
+ View all 35+ repos →
+
+
+
+ Things I've
+
+ Built
+
+
+ View all 35+ repos →
+
+
+
+ // featured
+
+ {featured.map((project, i) => (
+
+
+ {/* Rest of projects (smaller grid) */}
+ // more projects
+
+ {rest.map((project, i) => (
+
+
+ {/* Header */}
+
+
+
+
+ > cat skills.json
+
+
+ + Tech I Work With +
+
+
+
+ Expert
+
+
+
+ Proficient
+
+
+
+ Learning
+
+
+
+
+
+ {/* Left: skill categories */}
+
+
+ {skillCategories.map((cat) => (
+
+
+ {/* Right: code visual + interests */}
+
+
+ ))}
+
+
+ {cat.terminalLabel}
+
+
+
+
+ {cat.skills.map((skill) => (
+
+ {skill.name}
+
+ ))}
+
+
+ {/* Code visual */}
+
+
+ 
+
+
+ {/* Interests */}
+
+
+
+ $ git log --oneline
+
+
+
+ 214 commits this month
+ 2,670 contributions/year
+ 35+ repositories
+
+
+
+ > interests/
+
+
+ {[
+ {
+ icon:
+
+ {item.icon}
+ {item.label}
+
+ ))}
+
-
-
-
- - Ready to build something{" "} - extraordinary? -
-- Whether you need a complex system, a modern web application, or - specialized tooling, I'm here to bring your vision to life. -
-
-
- View Pricing Plans
-
-
-
- {/* Main Heading */}
-
- Building{" "}
- powerful
-
- digital products -
-
- {/* Subheading */}
-
- I'm{" "}
- Klesti Selimaj,
- a 16-year-old software engineer with 6+ years of experience.
- Passionate about low-level systems, modern web apps, and crafting
- tools.
-
-
- {/* CTA Buttons */}
-
-
- Work with me
-
-
- {/* Social Links */}
-
-
-
-
-
-
- {/* Scroll Indicator */}
- - digital products -
-
-
-
- {/* Section Header */}
-
-
- Portfolio
-
-
-
- {/* Projects Grid */}
-
-
- View all projects on GitHub
-
-
- - Featured Projects -
-- A selection of my open-source work and personal projects that - showcase my skills in systems programming, web development, and - tooling. -
-
- {projects.map((project, index) => (
-
- {/* Header */}
-
- ))}
-
-
- {/* View All CTA */}
-
-
-
- {/* Content */}
-
- {project.featured && (
-
- Featured
-
- )}
-
-
-
- - {project.name} -
-- {project.description} -
- - {/* Tech Stack */} -
- {project.tech.map((tech) => (
-
- {tech}
-
- ))}
-
-
- {/* Actions */}
-
-
- {/* Section Header */}
-
-
- Expertise
-
-
-
- {/* Stats */}
-
- - Technical Experience -
-- From low-level systems programming to modern web development, I have - many years of experience. -
-
- {stats.map((stat, index) => (
-
-
- ))}
-
-
- {stat.value}
-
- {stat.label}
-
-
- )}
- -
- {navLinks.map((link) => (
-
- - setMobileMenuOpen(false)} - className={cn( - "block text-sm font-medium transition-colors", - location.pathname === link.href - ? "text-accent" - : "text-muted-foreground", - )} - > - {link.label} - - - ))} -
-
-
-
- -
-
-
{children}
+
+ {children}
+
+