김효진 (Hyojin Kim)
Front-end Engineer

오늘의집 커뮤니티 SEO 개선

• 첫 배포 직후 SEO 유입량 20% 상승, 커뮤니티 페이지 색인량 증가로 검색 노출 확대
• 유저의 구매 결정 과정에서 문제를 해결해주고 커뮤니티 AU를 증가시키는 KR 달성을 위한 핵심 과제로 선정
• robots.txt 크롤링 봇 추가와 시맨틱 마크업 적용으로 온페이지 SEO 개선, 구조화된 토론 포럼 리치 스니펫 구현을 통해 AI 검색에서 인용량 증가 달성
• 동적 사이트맵 생성 자동화 시스템 구축:
  • 수만 개 커뮤니티 페이지 사이트맵을 빌드 시간 증가 없이 실시간 관리하는 문제를 해결하기 위해, next-sitemap 기반 정적 생성 방식을 서버 사이드 동적 생성 시스템으로 추상화하여 재설계
  • 서버에서 동적 사이트맵 생성 후 S3 업로드 → S3 파일 조회를 통한 index sitemap 생성 및 업로드 → Next.js rewrite로 S3 경로 서빙하는 전체 파이프라인을 스크립트로 구현하고 GitHub Actions cron job으로 자동화
  • 한정된 크롤링 예산을 고려하여 삭제된 콘텐츠는 제외하고 최신/인기 콘텐츠 우선순위 알고리즘을 적용, 파일명 덮어쓰기 방식으로 효율적인 관리 구조 구현

SaaS 기반 글로벌 팬덤 비즈니스 플랫폼 b.stage 개발 및 유지보수 (User/Admin/Console/Modules)

기술 개선

• yarn에서 pnpm으로 마이그레이션을 통해 패키지 관리 효율성 개선
• TanStack Query v5 마이그레이션 주도 및 사내 세미나 진행, useInfiniteIntersectionObserver 커스텀 훅 개발로 무한스크롤 로직 표준화
• 사내 디자인 시스템 bspoke-admin, bspoke-user 패키지 구현. FE-PD 간 커뮤니케이션 주도하여 Button 컴포넌트 완성, 타입 가드를 이용한 유연한 타입 대응
• reset.css 패키지화로 스타일 기준 통일, styled-components/Tailwind CSS를 Module CSS로 점진적 마이그레이션 주도
• 코드리뷰봇 기능 개선, Jira Automation 구축, 다국어 관리 시스템 CDN 서빙 방식 전환을 통해 번들 사이즈 최적화 및 배포 프로세스 간소화

주요 프로젝트

• 스케줄 알림 기능 고도화 - 서버 리소스 부담 문제를 해결하기 위해 클라이언트 기반 인앱 스케줄 다운로드 방식을 제안하고 구현하여 효율적인 알림 시스템 구축
• 샵 카테고리 시스템 확장 - 1 depth를 3 depth로 확장하기 위한 트리 구조 데이터 관리와 드래그앤드롭 기반 SortableTree 컴포넌트 설계
• 멀티라운지 - 라운지별 팔로우 시스템과 알림 설정 기능 제공. getHomeLayout 활용으로 불필요한 렌더링 최소화, TanStack Query v5 도입 및 invalidateQueries 활용한 효율적인 캐시 관리
• 스테이지 커스텀 - 관리자가 브랜드를 차별화할 수 있는 홈 에디터 구축. BE와 초기 스키마 설계부터 참여하여 SSR/CSR 분리 구조 설계, 섹션 컴포넌트 패키지화로 어드민 미리보기 시스템 구현
• 서베이/투표 - 팬덤 플랫폼 특화 서베이/투표 시스템 구축. presignedUrl 기반 보안 뷰어 페이지 개발, react-hook-form 활용한 문항 타입별 validation 구현
• 디지털 리워드 - 리워드 타입별 모듈화된 컴포넌트 설계, 상품 구매 이력과 리워드 지급 조건 연동을 통한 자동화된 미션 시스템 구축

브랜드 가치 전달을 위한 웹사이트 개발

• 홈페이지 개발 end-to-end 총괄 (기획/디자인 협업, 스펙 정리, 일정 산정)
• Section, Navigation, Hero, Card 등 재사용 가능한 디자인시스템 컴포넌트 구축 및 Storybook 템플릿 제작을 통해 개발 생산성 향상
• 프로젝트 개발 환경 구축, 프론트엔드 프로젝트 설계, 컨벤션 문서 작성
• 반응형 디자인 구현을 위한 미디어쿼리 및 LineBreak 템플릿 제작
• 노션 칸반보드를 활용한 효율적인 QA 프로세스 구축

주요 프로젝트

• 토스 NEXT 개발자 채용, slash22 컨퍼런스, 디자이너 챌린지, 토스파운드, 토스페이스 등 다수 홈페이지 개발
• 리소스센터 성능 개선 - 드래그앤드롭 파일 업로드, 태그 관리 페이지, 필터링 기능 구현
• 크롬 익스텐션 미니 리소스센터 개발 - debounce 적용한 검색 기능 구현
• 토스 디자인 시스템(TDS) 컴포넌트 유지보수 및 사용성 개선