diff --git a/src/pages/Index.tsx b/src/pages/Index.tsx new file mode 100644 index 0000000..7dc76da --- /dev/null +++ b/src/pages/Index.tsx @@ -0,0 +1,417 @@ +import { useState, useEffect } from "react"; +import { toast } from "sonner"; +import { Button } from "@/components/ui/button"; +import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"; +import { Badge } from "@/components/ui/badge"; +import { Input } from "@/components/ui/input"; +import { Textarea } from "@/components/ui/textarea"; +import { Progress } from "@/components/ui/progress"; +import { Sheet, SheetContent, SheetTrigger } from "@/components/ui/sheet"; +import { + Menu, ArrowRight, Mail, Linkedin, Github, Twitter, Download, + ExternalLink, MapPin, Calendar, Briefcase, GraduationCap, Award, + Figma, Globe, Database, Terminal, Layers, Cpu, Send, CheckCircle +} from "lucide-react"; +import { ThemeToggle } from "@/components/ThemeToggle"; +import { useSaasMutation } from "@/hooks/use-tygarun"; + +export default function ResumePage() { + const { mutate: createLead, loading: sending } = useSaasMutation("crm", "/leads"); + const [mobileOpen, setMobileOpen] = useState(false); + const [scrolled, setScrolled] = useState(false); + useEffect(() => { + const onScroll = () => setScrolled(window.scrollY > 20); + window.addEventListener("scroll", onScroll); + return () => window.removeEventListener("scroll", onScroll); + }, []); + + const navLinks = [ + { label: "Experience", href: "#experience" }, + { label: "Education", href: "#education" }, + { label: "Skills", href: "#skills" }, + { label: "Contact", href: "#contact" }, + ]; + + const certifications = [ + { name: "AWS Solutions Architect", issuer: "Amazon Web Services", year: "2024" }, + { name: "Google Cloud Professional", issuer: "Google Cloud", year: "2023" }, + { name: "PMP Certified", issuer: "Project Management Institute", year: "2022" }, + ]; + + const experience = [ + { + company: "Stripe", role: "Senior Software Engineer", dates: "2022 – Present", + bullets: ["Led the redesign of the merchant dashboard serving 2M+ users, improving task completion by 35%.", "Architected a real-time analytics pipeline processing 500K events per second.", "Mentored a team of 6 engineers and established code review best practices."], + }, + { + company: "Vercel", role: "Software Engineer", dates: "2020 – 2022", + bullets: ["Built core deployment infrastructure handling 10M+ builds per month.", "Shipped the Edge Functions runtime adopted by 50K+ projects in first quarter."], + }, + { + company: "Airbnb", role: "Frontend Engineer", dates: "2018 – 2020", + bullets: ["Developed the new search experience increasing booking conversion by 18%.", "Created a shared component library used across 12 product teams."], + }, + { + company: "Freelance", role: "Web Developer", dates: "2016 – 2018", + bullets: ["Delivered 30+ client projects ranging from e-commerce to SaaS dashboards.", "Achieved a 100% on-time delivery rate with 5-star average client rating."], + }, + ]; + + const projects = [ + { title: "FinTrack Dashboard", desc: "Real-time financial analytics platform with interactive charts and alerts.", tags: ["React", "TypeScript", "D3.js"], gradient: "from-violet-500 to-indigo-600" }, + { title: "MedConnect", desc: "Telemedicine platform connecting patients with specialists worldwide.", tags: ["Next.js", "Prisma", "WebRTC"], gradient: "from-rose-500 to-orange-500" }, + { title: "EcoShop", desc: "Sustainable e-commerce marketplace with carbon-neutral shipping tracker.", tags: ["Remix", "Stripe", "PostgreSQL"], gradient: "from-emerald-500 to-teal-500" }, + ]; + + const technicalSkills = [ + { name: "React / Next.js", value: 95 }, + { name: "TypeScript", value: 90 }, + { name: "Node.js", value: 85 }, + { name: "Python", value: 88 }, + { name: "PostgreSQL", value: 80 }, + { name: "AWS / Cloud", value: 75 }, + ]; + + const tools = [ + { icon: Figma, label: "Figma" }, + { icon: Globe, label: "Vercel" }, + { icon: Database, label: "Supabase" }, + { icon: Terminal, label: "Docker" }, + { icon: Layers, label: "Terraform" }, + { icon: Cpu, label: "GitHub" }, + ]; + + return ( +
+ {/* ── HEADER ── */} +
+
+ + Taylor Morgan + +
+ + +
+ + + + + + + + +
+
+ + {/* ── HERO ── */} +
+
+
+
+
+
+
+
+
+
+
+
+
+
+

+ Taylor Morgan +

+

Senior Full-Stack Engineer

+

+ Passionate engineer with 8+ years building scalable web applications. I love clean architecture, great UX, and shipping products that make a difference. +

+
+ + + + +
+
+
+
+
+ + {/* ── EXPERIENCE ── */} +
+
+
+ +

Experience

+
+
+ {experience.map((job, i) => ( +
+
+
+

{job.company}

+ {job.dates} +
+

{job.role}

+
    + {job.bullets.map((b, j) => ( +
  • + + {b} +
    • + ))} +
+
+ ))} +
+
+
+ + {/* ── PROJECTS ── */} +
+
+
+ +

Featured Projects

+
+
+ {projects.map((p, i) => ( + +
+
+
+
+ + {p.title} + + + {p.desc} +
+ {p.tags.map((tag, j) => ( + {tag} + ))} +
+ + View Project + + + + ))} +
+
+
+ + {/* ── EDUCATION ── */} +
+
+
+ +

Education

+
+
+ + + + Stanford University + + M.S. Computer Science + + + 2014 – 2016 + With Distinction + + + + + + UC Berkeley + + B.S. Computer Science + + + 2010 – 2014 + Magna Cum Laude + + +
+
+

+ Certifications +

+
+ {["AWS Solutions Architect", "Google Cloud Professional", "PMP Certified"].map((cert, i) => ( + {cert} + ))} +
+
+
+
+ + {/* ── SKILLS ── */} +
+
+

Skills & Tools

+
+ {/* Technical */} +
+

+ Development +

+
+ {technicalSkills.map((s, i) => ( +
+
+ {s.name} + {s.value}% +
+
+
+
+
+ ))} +
+
+ {/* Soft Skills + Tools */} +
+
+

+ Design & Soft Skills +

+
+ {["Leadership", "Communication", "Problem Solving", "Mentoring"].map((s, i) => ( + {s} + ))} +
+
+
+

Tools & Platforms

+
+ {tools.map((t, i) => ( +
+ + {t.label} +
+ ))} +
+
+
+
+
+
+ + {/* ── CERTIFICATIONS ── */} +
+
+
+ +

Certifications & Awards

+
+
+ {certifications.map((c, i) => ( + + +
+ +
+
+ + {c.name} + + {c.issuer} +
+ + + {c.year} + + + ))} +
+
+
+ + {/* ── CONTACT ── */} +
+
+

Let's Connect

+

Have a project in mind? I’d love to hear from you.

+ + taylor@example.com + + + +
{ + e.preventDefault(); + const form = e.currentTarget; + const fd = new FormData(form); + try { + await createLead({ name: fd.get("name"), email: fd.get("email"), message: fd.get("message") }); + toast.success("Message sent! I'll get back to you within 24 hours."); + form.reset(); + } catch (err) { + toast.error("Something went wrong. Please try again."); + } + }} className="text-left space-y-4"> + + +