1
// content/about.mdx
2
// Edit this file to customize your About page — no React knowledge needed.
3
//
4
// Resume file:
5
//   Drop your CV at  public/resume.pdf  (Next.js serves /public at the site root,
6
//   so the file becomes accessible at  /resume.pdf  — same value passed to cvHref).
7
//   Rename freely; just keep cvHref in sync (e.g. cvHref="/erik-yun-cv.pdf").
8
9
<ProfileHero
10
  name="Erik Yun"
11
  title="Full-Stack Developer"
12
  location="Remote"
13
  email="erik.yun@example.com"
14
  links={[{ label: "LinkedIn", href: "#" }, { label: "GitHub", href: "#" }]}
15
  bio="Full-Stack Developer with experience building modern web applications. Skilled in React, Next.js, Node.js, and cloud technologies. Passionate about clean code and scalable architecture."
16
  cvHref="/resume.pdf"  // → public/resume.pdf
17
/>
18
19
<OpportunityCard
20
  title="Open to Opportunities"
21
  description="Looking for a full-time remote position. Feel free to reach out."
22
  email="erik.yun@example.com"
23
/>
24
25
<SkillsGrid skills={[
26
  { category: "Frontend", items: ["React", "Next.js", "TypeScript", "Tailwind CSS"] },
27
  { category: "Backend", items: ["Node.js", "Express.js", "Python"] },
28
  { category: "Databases", items: ["PostgreSQL", "MongoDB", "Redis"] },
29
  { category: "Infrastructure", items: ["AWS", "Docker", "CI/CD", "GitHub Actions"] },
30
]} />
31
32
<ExperienceList
33
  skills={[
34
    { category: "Frontend", items: ["React", "Next.js", "TypeScript", "Tailwind CSS"] },
35
    { category: "Backend", items: ["Node.js", "Express.js", "Python"] },
36
    { category: "Databases", items: ["PostgreSQL", "MongoDB", "Redis"] },
37
    { category: "Infrastructure", items: ["AWS", "Docker", "CI/CD", "GitHub Actions"] },
38
  ]}
39
  experiences={[
40
    {
41
      title: "Senior Full-Stack Developer",
42
      company: "Tech Company Inc.",
43
      location: "Remote",
44
      period: "2022 – Present",
45
      bullets: [
46
        "Led development of enterprise web applications using Next.js and Node.js",
47
        "Managed a team of developers and implemented CI/CD pipelines",
48
      ],
49
      technologies: ["Next.js", "TypeScript", "PostgreSQL", "Docker", "AWS"],
50
    },
51
    {
52
      title: "Full-Stack Developer",
53
      company: "Digital Agency Co.",
54
      location: "Remote",
55
      period: "2020 – 2022",
56
      bullets: [
57
        "Developed and maintained e-commerce platforms and content management systems",
58
        "Handled multiple client projects from design to deployment",
59
      ],
60
      technologies: ["React", "Node.js", "MongoDB", "AWS"],
61
    },
62
  ]}
63
/>
64
65
<EducationGrid
66
  education={[{ degree: "B.Sc. Computer Science", period: "2014 – 2018" }]}
67
  certifications={[
68
    { name: "AWS Solutions Architect", issuer: "Amazon Web Services" },
69
  ]}
70
/>
71
72
// Usage:
73
// 1. Edit the props above to replace with your own data
74
// 2. Drop your CV at public/resume.pdf (or any name — update cvHref to match)
75
// 3. Add or remove sections as needed
76
// 4. Each component handles its own layout and styling