PDF 열기

소개

안녕하세요,
프론트엔드 개발자 박지훈 입니다.

레거시 시스템의 기술 부채를 분석하고, 점진적 마이그레이션을 설계·실행하여 사용자 경험과 개발 생산성을 동시에 개선해온 프론트엔드 개발자입니다.

월 40만 UV 커머스 플랫폼의 React/Next.js 전환을 주도하며 Lighthouse 기반 성능 최적화(LCP 60% 단축)와 UI/UX 개선을 통해 GA4 기준 이탈률 15%p 감소를 달성했습니다.
공통 컴포넌트 설계와 개발 환경 구축을 통해 팀 전체의 개발 리드타임을 30% 단축한 경험이 있습니다.

사용하는 기술
핵심 스택
  • JavaScript
  • TypeScript
  • React
  • Next.js
상태 관리
  • Redux
  • Zustand
스타일링
  • Sass
  • Styled Components
  • Tailwind
경력
companyImg

제이에이치솔루션

2026-01~재직중
2개월
정규직 | 프론트엔드 서비스 개발 | 대리
  • 삼성물산 건물 관제 시스템(SEMS) 프론트엔드 설계 및 개발 (FE 1명 / 전체 6명)
  • JH Solution 기업 홈페이지 리뉴얼 (FE 1명 / 전체 3명)
companyImg

내담씨앤씨

2022-03~2025-03
3년
정규직 | 프론트엔드 서비스 개발 | 대리
  • 한국미스미 커머스 플랫폼 React/Next.js 마이그레이션 (FE 3명 / 전체 6명)
  • 한국미스미 커머스 플랫폼 데이터 기반 UI/UX 개선 및 운영 (FE 1명 / 전체 2명)
  • 사내 홈페이지 리뉴얼 기획 및 개발 (3명)
  • 한화생명 코어 시스템 구축 프로젝트 (2명)
프로젝트
연돌 상태 모니터링 시스템 (SEMS)

삼성물산

연돌 상태 모니터링 시스템 (SEMS)

2026-02~진행중
1개월
ReactTypeScriptViteTailwindCSSZustandTanStack QueryEChartsi18nextWebSocket
  • 삼성물산 R4 타워(42개 층)의 연돌효과 층간 압력차를 IoT 센서 + 기상청 API 데이터 기반으로 실시간 모니터링·이상 감지하는 건물 관제 플랫폼
  • TanStack Query(서버 상태)와 Zustand(클라이언트 상태) 분리 설계, WebSocket 기반 실시간 데이터 수신 처리
  • ECharts 기반 42개 층 압력 프로파일 시각화 및 데이터 샘플링·인스턴스 재사용으로 렌더링 최적화
  • Figma 디자인 토큰 기반 UI 컴포넌트 설계 및 6개 영역 실시간 대시보드 개발
  • CSV → JSON 자동 변환 다국어 시스템, MSW 기반 Mock/Server 모드 분리로 독립 개발 환경 구축
  • Claude Code + Figma MCP 연동으로 디자인 → 코드 전환 자동화, AI 생성 코드의 ECharts 메모리 누수 식별 및 dispose 로직 직접 설계·해결
  • 기업 홈페이지 리뉴얼

    JH Solution

    기업 홈페이지 리뉴얼

    2026-01~진행중
    2개월
    GatsbyReactCSS ModulesGraphQLAWS S3CloudFrontGitHub ActionsDocker
  • Markdown frontmatter 기반 동적 페이지 생성 — 콘텐츠 추가 시 코드 변경 없이 페이지 자동 생성
  • GitHub Actions 기반 dev/prod 이중 배포 파이프라인 및 CloudFront 캐시 무효화 자동화
  • Google Forms 연동 서버리스 Contact API — 별도 백엔드 없이 문의 플로우 완결
  • Claude Code + Figma MCP 연동으로 디자인 시안을 코드로 직접 연결, 컴포넌트 마크업·스타일 초안 생성 자동화
  • 커머스 플랫폼 React/Next.js 마이그레이션

    한국미스미

    커머스 플랫폼 React/Next.js 마이그레이션

    2024-04~2025-03
    11개월
    ReactTypeScriptNext.jsReduxSassStyled-components
  • RxJS, Twig 기반 10년 된 레거시 플랫폼(월 약 40만 UV)을 React, TypeScript, Next.js로 전환. 운영 중단 없이 페이지 단위 점진적 마이그레이션으로 안정적 전환 완료
  • Lighthouse·web-vitals 기반 성능 분석 후 Lazy Load와 S3+CloudFront CDN을 적용하여 LCP 3.5초 → 1.4초(60% 단축), GA4 기준 이탈률 42% → 27%(15%p 감소) 달성
  • @next/bundle-analyzer로 디바이스별 불필요 번들을 확인 후 PC/Mobile 분리 타겟 빌드 구조 설계. 모바일 번들 사이즈 절감 및 독립 유지보수 체계 확보
  • 상품 비교 기능 및 전용 비교 페이지 신규 개발. 상세 페이지 유입률 27% 증가, 구매 전환율 12% 상승 견인
  • 공통 UI 컴포넌트(Button, Checkbox, Modal 등) Props 인터페이스 기반 설계·개발로 신규 페이지 개발 리드타임 평균 30% 단축
  • 데이터 기반 UI/UX 개선 및 운영

    한국미스미

    데이터 기반 UI/UX 개선 및 운영

    2023-04~2024-04
    1년
    RxJSTwigJavaScriptjQueryPHP
  • GA4 이벤트 택소노미 설계 및 dataLayer 기반 주요 이벤트(PV, 장바구니, 주문, 검색 등) 트래킹 구현. GA4 Explore를 통해 마케팅·기획팀이 직접 데이터를 조회할 수 있는 의사결정 체계 구축
  • Click Heatmap, Scroll Depth 분석에서 CTA 가시성 부족과 콘텐츠 이탈 구간 발견. CTA 위치 조정 및 콘텐츠 구조 개편을 반영한 UI 리뉴얼로 체류시간 평균 18% 증가, 이탈률 약 11% 감소
  • 외부 추천 솔루션 API 연동을 통한 페이지별 개인화 상품 추천 배너 구현. 도입 전/후 데이터 비교로 재방문율 15% 증가, 구매 전환율 약 8% 상승 확인
  • 사내 홈페이지 리뉴얼

    내담씨앤씨

    사내 홈페이지 리뉴얼

    2022-12~2023-04
    4개월
    JavaSpring BootJavaScriptjQueryMariaDB
  • Java + Spring Boot 기반 사내 홈페이지 전면 리뉴얼
  • UI/UX 플로우 기획, 반응형 UI, 쿠키 기반 다국어 전환(국/영) 기능 개발
  • 코어 시스템 구축 프로젝트

    한화생명

    코어 시스템 구축 프로젝트

    2022-05~2022-12
    7개월
    JavaJavaScriptOracleKendoUI
  • Kendo UI 기반 수수료 확인/계산 업무 화면 설계 및 구현
  • 보험 정책 변경에 따른 프론트엔드 로직 유지보수 주도
  • 교육
    2023.03~2025.02

    방송통신대학교

    컴퓨터과학과 졸업

    2021.02~2021.08

    비트캠프 SW 웹 개발 교육

    2014.03~2018.02

    국제대학교

    외식조리과 졸업

    2011.03~2014.02

    문산제일고등학교

    자연계 졸업