미리보기

• 한국미스미 리뉴얼 프로젝트

  • Twig, RxJS 기반 레거시 환경을 React, Next.js로 마이그레이션 하여 FCP 50%→20%로 개선 (60% 성능 향상)

• 한국미스미 유지보수 및 운영

  • GA4 도입과 UI/UX 개선 작업을 통한 각 페이지 사용자 이탈률 감소

• 내담씨앤씨 홈페이지 리뉴얼

  • 기존 HTML 형식의 레거시를 청산 Java, JSP 기반의 관리자 페이지가 있는 홈페이지로 리뉴얼

  • 프로젝트 설계부터 초기 환경 세팅 및 12개의 페이지를 담당하며 반응형 페이지로 개편

  • 리뉴얼 개발을 통한 40% 이상의 사용자 유입 및 채용 지원 증가 효과

• 한화생명 코어 프로젝트

  • ETL 프로그램, DB 변경으로 인해 Core Data API 데이터 연동하여 월 배치 프로그램을 개발하며 수수료 시스템의 총 8개 지급의뢰 페이지 및 이벤트 개발

한국미스미 리뉴얼 개발 (웹/모바일 대응)

관련 글

• Twig, RxJS 환경에서 React, Next.js, TypeScript 최신 기술 환경 마이그레이션을 통한 리뉴얼 전 대비 FCP를 50% 에서 20% 로 단축하여 렌더링 성능 60% 향상

• 멀티 디바이스 대응 구조를 설계하고 개발을 주도

  • PC(_app.pc.tsx)와 모바일(_app.mobile.tsx)을 분리한 타겟 구조로 개발하여 플랫폼 별 최적화된 사용자 경험 제공

• 이커머스 특성상 다수의 이미지로 인한 속도 저하 해결을 위한 렌더링 최적화 작업을 통한 렌더링 속도 개선

  • .jpg, .png 정적 파일 이미지 => Amazon S3 + CloudFront CDN 방식의 제공을 통한 서버 부하 감소 및 응답 속도 개선

  • 각 UI 컴포넌트의 렌더링 우선순위를 조정하여 지연 로딩(Lazy Load) 및 Intersection Observer을 통한 동적 이미지 로드 설정

• 상품 비교 기능 및 비교 페이지 도입을 통한 상품 상세 페이지 유입률 및 전환율 증가

• 공통 UI 컴포넌트 개발로 불규칙한 UI를 정리하고 일관성 확보

  • 비일관된 UI를 정리하고 공통 컴포넌트로 통일하며 Button, Checkbox, Select, Modal 등의 공통 UI 컴포넌트화

  • 디자인의 일관성과 유지보수 효율성을 동시에 확보

• Redux 상태관리를 통한 유저 관련 기능(권한/장바구니/배송) 개발

• 안정화 기간 PC버전 SEO 크롤링 문제로 사용자 = CSR, 크롤링 봇 = SSR 설정을 통한 문제 개선

  • Next.js의 Middleware를 활용한 Googlebot 접근 시 별도 SSR 페이지로 리다이렉트 되어 완전한 MetaData 및 Contents를 제공할 수 있도록 개선

관련 글

• GA4 도입 및 이벤트 트래킹 체계 구축

  • 기존 Universal Analytics(UA) 종료에 대응하여 Google Analytics 4 전면 도입

  • 모든 페이지의 PV(Page View) 및 주요 사용자 행동 이벤트(장바구니 추가, 주문, 상품 스펙 확인, 검색등) 트래킹 구축

  • 데이터 기반 사용자 행동 분석이 가능해지면서 마케팅/기획 부서의 인사이트 도출 기반 마련

• UI/UX 개선을 통한 사용자 편의성 향상

  • 컨텐츠 성격별 구분 및 시선 흐름, 마우스 동선 최적화 → 직관적인 정보 탐색 유도

  • 사용자 권한에 따른 메인페이지 및 공통 헤더 UI 분기 처리로 개인화된 UX 제공

  • 불필요한 반복 동작 제거 및 마이크로 인터랙션 도입을 통한 사용자 이탈률 감소에 기여

• 배송 정책 변경에 따른 프론트엔드 대응

  • 일본 미스미 배송 정책 개편에 따라 주문 화면 및 API 연동 기능 개발

  • 상품별 특별 배송 항목 추가 및 배송료 계산 로직 반영

  • 과금 항목과 연동한 할인율 적용 로직 개발 및 구매 전환율 개선 기여

• Admin 기능 개선 – 답변 회수 처리 기능

  • 관리자가 사용자 문의에 대한 답변 후 회수가 필요한 케이스 대응 기능 구현

  • 프론트엔드에서 문의 상태에 따른 버튼 UI 분기 및 API 연결 처리

  • 실제 고객 대응 프로세스와 연계된 운영 효율성 향상에 기여

• Groobee API 기반 추천 상품 기능 개발

  • Groobee API를 활용하여 상품 조회수 및 구매 수 기반 데이터 수집 및 전송

  • 상품 카테고리별 연관 상품 추천 기능 도입 (검색창, 카테고리, 상세 페이지 각각에 최적화된 형태의 추천 배너 노출)

  • 연관 상품 노출을 통한 재방문율과 상품 전환율 상승 기여

관련 글

• 전체 기획 및 사이트맵 설계 주도

  • 최신 IT 기업 홈페이지 트렌드를 참고해 전체 구조 기획

  • 부서별 소개자료 수집 및 콘텐츠 반영

  • 관리자 페이지 활용을 위한 데이터 구조 설계

• CMS 연동 및 콘텐츠 관리 기능 개발

  • 사내 관리자 시스템 도입을 통해 홈페이지 콘텐츠를 동적으로 제어할 수 있는 구조 구현

  • 관리자 페이지에서 이미지·텍스트 등을 쉽게 수정할 수 있도록 구성

• 국문/영문 페이지 구현

  • 내부 번역 검수 후 쿠키 기반 다국어 전환 기능 개발

• 반응형 UI 및 인터랙션 적용

  • 최신 스크롤링 기반 레이아웃과 시각적 인터랙션 도입

  • 회사 브랜드 이미지에 부합하도록 디자인 요소 강화

• 배포 및 운영 대응

  • 기존 카페24 도메인 기반 운영, 무중단 배포(Root 파일 교체 방식)

  • 개발용 도메인 별도 구성하여 안정성 확보

• SEO 최적화

  • 주요 키워드 중심의 메타태그 삽입 및 크롤링 대응

관련 글

• 사용자 흐름을 고려한 신규 화면 설계 및 구현

  • 수수료 확인, 계산, 사전 업무 관련 페이지 신규 개발

  • 사용자 행위 기반 동적 렌더링 처리 및 상태 관리에 대한 구조적 고민과 설계 적용

• 레거시 배치 시스템 → ETL 기반 시스템 전면 재구축

  • 기존 수작업 기반 배치 로직을 JobPass(Job Scheduler) + TeraStream(ETL 엔진) 기반으로 재설계

  • DD(DB to DB), FD(File to DB) 방식 지원에 따라 다양한 데이터 유형의 적재 처리

  • MERGE 문을 활용해 적재 효율성을 높이고 지급 방식에 따라 프로시저를 설계해 유연한 수수료 계산 로직 개발

• 수수료 프로세스 전반 개발 및 유지보수 담당

  • 수수료 지급 로직:

    1. 데이터 파일 수신 → 2. 적재 → 3. 유형별 계산 → 4. 검증 및 결재 → 5. 지급까지의 전체 흐름을 개발 및 운용

  • 보험 정책 변경에 따른 로직 유지보수 및 재정비 주도

시니어 개발자 테오가 주최하여 5일간 진행하는 구글 스프린트 프로그램

스터디 멤버 내 스터디원으로서 활동하고 있습니다.

• 총 6권의 개발 도서 스터디 진행 및 진행 완료

• 매주 온라인으로 스터디 내용을 발표하며 다양한 토론을 진행하며 개발적인 시야 확장