[개발 회고] AI와 함께 일주일 만에 완성한 이력서 서비스, 'Beacon Port' 제작기

# 시작하며: "답답하면 니들이 뛰던가"를 실천하기까지

3년 넘게 참여했던 프로젝트가 종료된 후, 결혼과 신혼여행이라는 인생의 큰 이벤트를 마치고 잠시 숨을 고르고 있었습니다. 그러다 문득 제 눈길을 사로잡는 채용 공고를 발견했습니다. 재택근무는 물론, AI 도구를 적극적으로 활용하는 프리랜서 개발자를 찾는 공고였죠.

사실 요즘 고민이 많았습니다. 'AI 사용을 금지하는 곳에서 전통적인 경력을 쌓는 게 맞을까, 아니면 당장의 수익이 조금 적더라도 AI를 활용해 제품을 만들어내는 숙련도를 쌓는 게 맞는 시기일까?' 하는 의문이 들었거든요. 그런 제게 이 공고는 매우 매력적인 선택지로 다가왔습니다.

지원을 위해 이력서를 다듬으려 예전에 이용하던 '프로그래머스' 이력서 서비스에 접속했습니다. 그런데 아쉽게도 서비스가 종료되었더군요. PC를 여러 대 사용하는 저로서는 파일 형태의 이력서보다 웹으로 관리하는 방식이 참 편리했는데 무척 아쉬웠습니다. 하지만 그 아쉬움은 곧 새로운 도전 정신으로 바뀌었습니다.

"그럼 이참에 내가 직접 만들어볼까?"

혼자서 사이트를 완전히 '완성'해 본 적은 없었지만, 이제는 AI라는 든든한 지원군이 있으니 어떻게든 되지 않을까 싶었습니다. 풀스택으로 혼자 서비스를 만드는 데 얼마나 걸릴지 궁금하기도 했고, 무엇보다 "답답하면 내가 직접 만든다"는 명언을 몸소 실천해 보기로 했습니다.

# 기획 및 분석 설계: 나만의 신호를 보내는 항구, 'Beacon Port'

우선 서비스의 이름부터 정했습니다. 이력서란 결국 기업의 채용 담당자가 '랜딩'하게 되는 '개인의 랜딩 페이지'라고 생각했습니다. 제미나이(Gemini)와 고민을 나눈 끝에, 인재의 신호가 모이는 곳이라는 의미를 담아 'Beacon Port'로 결정했습니다.

이력서의 틀을 잡기 위해 공개된 여러 이력서들을 참고했는데요. 특히 '향로' 이동욱 님의 이력서 좋은 템플릿 삼아 저만의 아이디어를 추가해 나갔습니다.

이후 UI와 DB 설계를 진행했습니다. 주로 프론트엔드 개발자로 커리어를 쌓아온 제게 DB 설계는 다소 생경하고 버거운 작업이었습니다. 하지만 제미나이와 끊임없이 소통하며 대략적인 틀을 갖출 수 있었습니다. (물론 개발 과정에서 예상치 못한 컬럼들이 계속 추가되긴 했습니다. 😀)

# 개발: AI와 한 팀이 되어 몰입했던 일주일

개발 스택은 제가 그나마 익숙했던 조합을 선택해 효율을 높였습니다. 새로운 기술에 도전하기보다 '완성'에 초점을 맞췄습니다.

Frontend: React, React-Router, TypeScript

UI: Tailwind CSS, shadcn/ui, Magic UI

Backend: Supabase, Drizzle ORM

Deployment: Cloudflare, Vercel

이번 프로젝트의 핵심은 커서(Cursor)와의 협업이었습니다. 예전에는 커서가 헤매는 바람에 결국 제가 직접 코딩하는 경우가 많았는데, 그사이 성능이 놀라울 정도로 향상되었더군요. 태스크를 적절히 쪼개서 넘겨주니 거의 일임하다시피 해도 큰 무리가 없었습니다.

가끔 커서가 막히는 부분은 제미나이에게 물어보고, 그 답변을 다시 커서에게 전달하며 해결해 나갔습니다. 덕분에 기획부터 배포까지 딱 일주일 만에 사이트를 완성할 수 있었습니다. 이번 경험을 통해 '지금은 AI 도구를 활용해 제품을 완성하는 역량을 쌓는 게 훨씬 중요하다'는 제 생각이 확신으로 바뀌었습니다.

# 주요 기능 설명

사용자 편의를 위해 복잡한 절차는 덜어내고 꼭 필요한 기능에 집중했습니다.

간편한 로그인: 이메일과 깃허브 계정을 통해 최소한의 정보만으로 가입할 수 있습니다.

멀티 이력서 관리: 한 사람당 여러 개의 이력서를 생성하고 관리할 수 있습니다.

유연한 편집: 원하는 항목만 골라 구성할 수 있으며, 경력이나 프로젝트 순서는 드래그 앤 드롭으로 간편하게 변경 가능합니다.

실시간 미리보기: 입력 중인 내용이 어떻게 보일지 바로 확인할 수 있는 기능을 넣었습니다.

스킬 스택 시각화(Graph): 단순히 텍스트로만 나열하는 스킬이 아니라, 경력 카드에 입력한 정보를 토대로 본인의 숙련도를 한눈에 보여줄 수 있는 그래프 기능을 추가했습니다. 채용 담당자가 후보자의 강점을 시각적으로 빠르게 파악할 수 있도록 돕습니다.

공유 및 보안: 이력서별로 공개/비공개 여부를 설정할 수 있어, 링크가 있더라도 본인이 원치 않으면 접근을 차단할 수 있습니다. 물론 PDF 출력과 링크 공유 기능도 지원합니다.

샘플로 저의 이력서와 홈페이지 주소를 링크로 남깁니다. 소개 드리지 못한 부분은 직접 접속해서 확인해주세요!

# 마치며: 개발자의 미래를 엿본 즐거운 경험

정말 즐거운 경험이었습니다. 한때는 '인공지능이 개발자를 대체하면 어떡하지?'라는 불안감도 있었지만, 이번에 협업해보니 생각이 달라졌습니다. 큰 틀을 잡고 아이디어를 기획하는 것은 사람의 몫이고, 번거로운 구현 작업은 AI에게 맡기면 됩니다. 저는 그저 결과물을 검토하고 조율하기만 하면 되었죠.

"개발자가 대체된다면, 그냥 이런 '메이커'가 되면 되겠구나!" 하는 깨달음을 얻었습니다.

이력서 비밀번호 설정, 보상형 광고 삽입, 다양한 템플릿 추가 등 구현하고 싶은 기능은 여전히 많습니다. 하지만 몇 달째 어설프게 방치된 아내의 공방 홈페이지를 완성해 주는 것이 먼저라는 생각이 들어, 일단 이번 후기로 'Beacon Port'의 1차 개발을 마무리하려 합니다.

조만간 아내의 홈페이지 완성 후기로 다시 찾아뵙겠습니다. 긴 글 읽어주셔서 감사합니다!