이력서를 위해 'CI/CD 파이프라인'을 구축했습니다 (Next.js 15 + Puppeteer)

Source: Dev.to

The Problem: Version Control Hell

저는 21세 AI 엔지니어입니다. 지난달, 실제 코딩보다 Microsoft Word에서 여백을 맞추는 데 더 많은 시간을 쓰고 있다는 것을 깨달았습니다.

저는 이력서 5개 버전을 가지고 있었습니다:

• resume_frontend_final.pdf
• resume_backend_v2.docx
• resume_startup_focus.pdf
• resume_REAL_final_v3.pdf

채용에 지원할 때마다 “한 페이지 규칙”에 맞추기 위해 수동으로 글머리표를 삭제해야 했습니다. React 포지션에 지원하면 Python 관련 글머리표를, Backend 포지션에 지원하면 Figma 관련 글머리표를 삭제했습니다.

그것은 버전 관리 지옥이었습니다.

The Realization: Resume as Code

이력서는 단순한 문서가 아니라 데이터베이스 뷰라는 것을 깨달았습니다.

• 데이터베이스: 내 전체 경력(프로젝트, 스킬, 인증서 모두)
• 쿼리: 지원하는 직무 설명
• 뷰: 렌더링된 PDF

그래서 게으른 엔지니어인 저는 이를 자동화하는 시스템을 만들었습니다. 이름은 Resumefy.pro입니다.

The Architecture

Canva 같은 “템플릿 선택기”가 아니라 컴파일러가 필요했습니다.

1. The Stack

• Frontend: Next.js 15 (App Router)
• Database: Postgres (via Prisma)
• PDF Engine: Puppeteer (Headless Chrome)
• Orchestration: Vercel Serverless Functions

2. The “Page Break” Nightmare (The P0 Error)

가장 어려운 부분은 AI 매칭이 아니라 PDF 렌더링이었습니다.

jspdf 같은 라이브러리는 복잡한 CSS Grid 레이아웃을 제대로 처리하지 못하고 텍스트를 페이지 중간에 잘라버립니다.

저는 Puppeteer를 사용해 각 섹션의 DOM 높이를 렌더링 전에 계산하는 커스텀 알고리즘을 작성했습니다. 프로젝트 설명이 1123px(A4 높이 – 여백)를 초과하면 시스템이 깨끗한 페이지 나눔을 강제하거나 전체 컴포넌트를 다음 페이지로 이동시킵니다. 일종의 “Look‑Ahead” 렌더러입니다.

The Result: The “War Machine”

이제 이력서를 수동으로 작성하지 않습니다.

• 하나의 마스터 프로필을 유지합니다.
• 직무 설명을 붙여넣습니다.
• 시스템이 맞춤형 PDF를 약 30초 안에 “컴파일”합니다.

Why I Built This (The Manifesto)

저는 “지원 블랙홀” 문제를 해결했습니다. 문제는 우리가 자격이 없어서가 아니라 수십 개의 ATS 봇에 맞게 이력서를 완벽히 맞출 시간이 없기 때문입니다.

이 도구는 경쟁의 장을 평평하게 만들어, 구직 활동을 코드로 해결할 수 있는 엔지니어링 문제로 전환합니다.

Try it / Roast my Code

무료로 사용할 수 있습니다(개발자를 위한 관대한 무료 티어 제공).

Live Site:

피드백을 받고 싶은 부분:

• PDF 렌더링 속도.
• 모바일 UI (밤새 Z‑index 문제를 고쳤습니다).

생각을 알려 주세요!