김태수

Frontend Engineer

누적 거래액 7조 원의 선정산 업계 1위 서비스에서 Vue2 레거시를 Next.js로 전면 마이그레이션하고, 출시 후 단독 메인테이너에서 3인 팀 리딩까지 맡으며 구조 설계, 운영 최적화, ISMS 인증을 담당했습니다. 현재는 AX TF에서 사내 데이터 MCP를 구축해 비개발 부서가 직접 데이터를 조회하는 환경을 만들고 있습니다.

신규 프로젝트 배포를 넘어 안정적인 운영을 위해 Storybook, E2E 시스템을 구축하여 내 코드를 믿고 배포할 수 있는 환경을 마련했습니다. 배포마다 치르던 검증 시간과 불안이 줄었고, 이제는 테스트가 통과하면 프론트엔드는 문제없다고 말할 수 있습니다.

Experience

Allra Fintech

2024.12 ~ 현재

선정산 업계 1위 서비스의 Vue2 레거시를 Next.js로 전면 마이그레이션하고, 출시 후 단독 메인테이너에서 3인 팀 리딩까지 담당
전사 어드민 모노레포 설계·구축, 통신 레이어 tRPC 전환, 프론트엔드 영역 ISMS 대응

사내 데이터 MCP를 구축해 비개발 부서가 개발자를 거치지 않고 직접 데이터를 조회하는 환경 마련
전사 업무 툴 전환(Slack 이관, Google Workspace 도입) 주도 및 비개발자 대상 AI 교육

MarketTree

2024.05 ~ 2024.08

전통시장 이커머스 플랫폼 개발 및 어드민 시스템 구축

Dable

2023.09 ~ 2024.04

난임정보 커뮤니티 앱 웹뷰 및 디에이블 통합 어드민 시스템 구축

Projects

올라선정산 V2 마이그레이션 및 운영

2024.12 ~ 2026.05

누적 거래액 7조 원 서비스의 레거시 마이그레이션 및 안정적인 운영 환경 구축 기여

Vue2
Next.js
TypeScript
tRPC
Playwright
Storybook

- 회원·계약·외부 인증·사이트 관리 도메인 개발을 담당하고, FSD를 참고한 아키텍처로 도메인 복잡도를 구조적으로 완충
- PDF 서명·OCR·인증 등 공통 기능을 모듈 호출 → 처리 → 콜백 연계 형태로 모듈화하여 도메인 간 결합도 제거
- 출시 직후 약 1년간 단독 메인테이너로 운영 이슈를 처리하며 3인 팀까지 확장, 신규 입사자 교육·코드 리뷰·브랜치 전략 등 팀 문화 안착
- 컴포넌트 가시성 확보를 위한 Mock 기반 Storybook과 코드 신뢰도 확보를 위한 Playwright E2E를 구축, 모든 도메인 상태를 Storybook에 표현하고 주요 도메인을 E2E로 커버
- 테스트 통과를 프론트엔드 이상 없음의 근거로 활용하여 배포 전 검증 부담 완화
- Storybook은 화면 전반을, E2E는 실제 동작 흐름을 보여줘 신규 입사자의 온보딩 자료로 활용
Storybook 도입기(사내 블로그)E2E 테스트 도입기(사내 블로그)
- 서버 액션을 용도에 맞게 사용하지 않아 발생한 구조적 문제(동기 큐 지연, Version Skew)를 식별하고 통신 레이어 교체를 결단
- tRPC 도입으로 해당 문제를 해소하고, Storybook·E2E 모킹 시스템까지 결합하여 모킹 구조를 단순화
- 디자인 요구로 도입된 6.8MB 웹폰트를 실사용 글자만 서브셋팅해 456KB로 축소
- 클라이언트 전용 모듈(뷰어, PDF 등)을 dynamic import로 분리하여 번들 사이즈 개선
- TanStack Query의 select·combine이 인라인 정의로 매 렌더 재실행되던 문제를 식별해 컴포넌트 밖으로 분리, 불필요한 리렌더 제거
폰트 서브셋 직접 만들어 사용하기(개인 블로그)
프론트엔드 영역 ISMS를 담당하여 보안 지적사항 11건 100% 해결, 회사의 ISMS 인증 획득에 기여

올라 어드민 모노레포 구축

2025.03 ~ 2025.06

제안·설계·구축 단독 수행

Turborepo
Next.js
shadcn/ui
Lexical

- 신규 서비스마다 반복되던 프로젝트 중복 세팅을 해결하기 위해 모노레포 도입을 건의하고 아키텍처 기반을 직접 구축
- 어드민 UI 패키지, CSS Style, Lint System, CI/CD 환경과 로그인·로그아웃 공통 레이아웃 템플릿까지 제공
- 프로젝트마다 하루씩 들던 초기 세팅을 없애고, 이후 어드민 3개가 동일한 기반에서 출발
- 유지보수를 견디지 못하는 시점에 도달한 PHP 어드민의 기능을 REST API와 VIEW로 분리
- 구축한 모노레포 기반에 어드민 V2 VIEW를 신규 구축하여, 확장이 불가능했던 과거 뷰어의 유지보수 가능성 확보
- 마케터 동료들이 에디터에 HTML을 직접 입력하여 공지사항 등 게시글 오염도가 심각했던 현상 식별
- 동료들이 애용하던 iframe·테이블 편집 기능은 살리고 HTML 직접 입력은 원천 차단하여, 보안·유지보수 리스크를 제거하면서 실사용성 개선

사내 MCP 구축 및 보급

2026.05 ~ 현재

FDE로서 사내 데이터 MCP 설계·구축 및 전사 보급

MCP(stdio ↔ remote)
VPC
Agent
EKS

- 팀별 비정형 업무 데이터와 사내 DB를 연결하되, 보안상 VPC 환경에서만 동작해야 하는 제약
- 배포가 쉬운 remote MCP와 사내망에서 안전한 stdio MCP의 장점을 모두 얻기 위해, stdio MCP가 VPC 내부 remote MCP를 감싸는 프록시 구조를 설계
- 개발·기획·마케팅·CX 4개 부서가 개발자를 거치지 않고 매일 100건 이상 직접 조회해 분석 업무에 활용
- 마케팅 데이터·코드 업데이트 현황·사내 정형/비정형 데이터를 제공받는 컨테이너 기반 에이전트를 개발
- EKS 크론 기반 주기 실행으로 일간·주간·월간·분기 리포트를 자동 생성하고, 직전 기간 대비 지표를 비교하는 정기 분석 체계 확립
- 비개발자 동료에게 AI 활용법을 공유하여, CX팀은 일일 업무 자동 스케줄링을, 마케팅 팀원은 아웃바운드 대상자 자동 보고 시스템을 직접 만들어 사용

전통시장 이커머스 플랫폼 놀장 런칭

2024.05 ~ 2024.08

외주 인계 코드 인수 후 프론트엔드 재개발 및 런칭 담당

Next.js

- 결제, 장바구니, 옵션 선택, 상품 목록, 검색, 정렬 등 주요 플로우 전 영역을 디버깅 및 재개발하고, 전역 상태에 Context API를 도입하여 관심사 분리
- 부재하던 에러 처리를 보완하고, 프론트엔드에서 패스워드를 암호화해 백엔드로 전송하던 취약점 등을 식별
- 공유 스프레드시트 기반 사내 Q/A 체계를 구축해 전 직원과 자체 테스트를 진행, 치명적인 이슈 수십 건을 처리한 뒤 배포 완료