About·GitHub·Email

$ cat about.md

안동민

프론트엔드 엔지니어 · 4년차

← 목록으로

개인 정보

소개

React Native로 10MM iOS/Android 앱을 직접 출시(누적 418명)하고, Flutter로 위스키캣 가계부 모바일 앱을 1년 넘게 운영 중인 프론트엔드 엔지니어입니다. 모바일·웹·내부 운영 툴까지 사용자 경험과 동료 생산성을 함께 끌어올리는 일에 가장 많은 시간을 쏟아왔습니다.

9개 앱 모노레포 패키지 구조 재설계, Vue 어드민 Webpack→Vite 마이그레이션(빌드 12분 → 2분), QA·AI 코딩용 크롬 익스텐션 2종 직접 설계·배포, AI 런타임 서버(약 1,500 LOC) 단독 구축, 전국 공공 공고 수집 파이프라인(490개 수집기) 설계·운영까지 직접 진행해왔습니다.

Hotjar·Mixpanel·GTM 통합 트래킹을 어댑터 패턴으로 추상화하고, Hackle SDK 기반 A/B 테스트 4개 운영으로 IR자료 구독 전환율을 개선하는 등 행동 데이터 트래킹 설계와 비즈니스 지표 개선까지 직접 다뤄왔습니다.

경력

웰로 · Frontend Developer

2025.11 ~ 현재 · 고향사랑기부 플랫폼 (B2C 기부몰·B2B SaaS·어드민 포함 9개 앱 모노레포)

TypeScript React Next.js React Native TanStack Query Zustand Tailwind CSS Vite Turborepo Playwright Sentry MSW

9개 앱 모노레포 빌드 파이프라인 정비

  • @wello-client/common을 core(순수 유틸)와 react(컴포넌트·훅)로 분리 재설계, 빌드 단위·캐시 적중률 개선
  • Vue 어드민 Webpack → Vite 마이그레이션으로 빌드 12분 → 2분(약 83%) 단축
  • SVG 아이콘 자동 생성 파이프라인 구축으로 디자이너-개발자 워크플로우 개선

고향사랑기부 몰 React Native 웹뷰 셸 구축

  • 기존 웹 기반 서비스를 모바일 앱 채널로 확장. 웹↔네이티브 통신·라우팅 설계, 기존 웹 자산 앱 환경 재활용

사내 운영용 크롬 익스텐션 2종 직접 개발

  • AI 컴포넌트 파인더: React 19 Fiber 트리 탐색, Turbopack 청크 URL 파싱으로 컴포넌트 파일 경로 추출 → 팀 전체 사용 중
  • QA 익스텐션: 화면 레코딩·API 로깅·DOM 캡처·어노테이션을 단일 워크플로우로 통합, Jira OAuth 연동으로 원클릭 티켓 생성

장바구니→주문→결제 E2E·접근성 테스트 인프라 도입

  • Playwright 인증 헬퍼(JWT 디코딩 → Refresh Token → 쿠키 주입)로 인증 의존 시나리오 자동화
  • 장바구니→주문→결제 핵심 플로우 E2E + 공유 컴포넌트 접근성 테스트 작성

장바구니·결제 시스템 도메인 모델 재정의

  • 복수 답례품·분리배송 커머스로 확장되며 옵션·추가금·품절·배송지 그룹 도메인 모델을 BE·기획과 함께 재정의
  • TanStack Query(서버 상태)와 Zustand(클라이언트 상태) 역할 기준 분리, Toss Payments 연동·기부공제·쿠폰 로직 구현

기타

  • Lighthouse 기반 성능 최적화 (LCP·TBT·Speed Index 개선, Pretendard 폰트 서브셋으로 약 75% 경량화)
  • Wello 사내 AI 런타임 서버 단독 구축 (프롬프트 CMS·액션 레지스트리·SSE 스트리밍, 약 1,500 LOC)
  • 전국 공공 공고 수집 파이프라인 단독 설계·운영 (490개 수집기 모듈화)

넥스트 유니콘 · Frontend Engineer

2023.08 ~ 2025.03 · 스타트업과 전문투자자를 연결하는 B2C 플랫폼

TypeScript React Next.js TanStack Query Hackle SDK Supabase GraphQL

A/B 테스트 운영으로 IR자료 구독 전환율 개선

  • Hackle SDK 도입 주도, 3개월간 4개 실험 운영. 가설 정의·실험 설계·결과 분석을 기획·마케팅과 함께 사이클로 운영
  • VWO·AB Tasty·Google Optimize 비교 분석 후 비용·기능 기준으로 솔루션 선정

통합 트래킹과 퍼널 분석 사이클 수립

  • Hotjar·Mixpanel·GTM 통합 트래킹을 어댑터 패턴으로 추상화, 트래킹 도구 교체 시에도 호출 코드 유지
  • 퍼널 분석 기반 UX 개선 사이클 수립

마케팅 이벤트 페이지 자동 생성 구조

  • Supabase 기반 메타데이터 자동 생성 구조로 전환, 기획자가 배포 없이 페이지를 직접 운영. 개발팀 월간 반복 업무 제거

비바리퍼블리카 (토스) · 프론트엔드 어시스턴트 (계약직)

2023.04 ~ 2023.08 · 국내 최대 규모 핀테크 금융 서비스

TypeScript React Next.js TanStack Query Emotion

  • 개인정보보호·버그바운티 등 법적 정확성이 우선인 서비스 페이지 개편
  • GSAP 기반 인터랙티브 페이지 구현

당근 · Frontend Developer Intern

2021.09 ~ 2022.02 · 국내 최대 지역 커뮤니티·중고거래 플랫폼

TypeScript React React Hook Form WebView Emotion

  • 비즈프로필 WebView 기반 설문조사 MVP 개발
  • 예약 기능 프론트엔드 개발

사이드 프로젝트

위스키캣 가계부 (WhiskeyCat MoneyFlow)

복식부기 기반 자산 관리 앱 · App Store·Play Store 정식 출시 중 (v1.1.4)

Flutter Dart Hono TypeScript Next.js PostgreSQL Turborepo

  • Flutter 기반 iOS/Android 앱 핵심 기능 다수 담당 (1년+ 운영): 거래 입력 플로우, 반복거래·자산 관리·아이콘 피커, 온보딩 개편, 거래 목록 필터·캘린더, 홈 화면 위젯(iOS Home Widget)
  • Hono 기반 REST API 서버, Next.js 어드민 일부도 함께 작업
  • React 메인 개발자가 새 모바일 스택(Flutter)에 빠르게 적응한 사례

10MM

디프만 8기 사이드 프로젝트 · 집중시간 관리 서비스

React Native React Next.js MSW Storybook Hotjar Mixpanel GTM

  • React Native로 iOS/Android 앱을 3개월 내 양 스토어 출시, 누적 418명 실사용자 확보
  • React Native↔웹 코드 공유 전략 설계, 앱 스토어 심사·배포·업데이트 사이클 직접 운영
  • MSW + Storybook 도입으로 백엔드 의존성 제거, 병렬 개발 체계 구축
  • Hotjar/Mixpanel/GTM 통합 로깅 시스템을 어댑터 패턴으로 설계

GitHub · Product

B-Peach (Tech for Impact)

카카오임팩트 × 모두의연구소 · 느린학습자를 위한 LLM 기반 글 번안 서비스

React Next.js TypeScript LLM API

  • LLM 기반 "쉬운 글 번안기" 프론트엔드 설계·구현
  • 원문↔번안문 실시간 비교·편집 에디터 UI 구축, Polling 기법으로 LLM 처리 진행 상태 추적 UX
  • 구독형 결제 모듈 연동 및 결제 flow 구현

Product