이유록

프론트엔드 개발자

padawanr0k@gmail.com

About

React/Next.js 기반, express 기반 레거시 서비스 개발 및 운영 경험을 보유하고 있습니다.
모니터링 도구를 통해 얻은 인사이트를 동료들과 공유하며, 느리고 불편한 것들을 개선해나가는 것을 좋아합니다.

Work Experience

인프랩

Oct. 2021 - now

  • 환경 개선을 위한 성능과 생산성 도구 연구
    • Mantine 기반 디자인 시스템에 피그마 코드커넥트 도입을 통해 피그마에서 FE코드를 바로 복사해서 사용할 수 있는 환경 구성
    • 코드 커넥트를 위한 connect 컴포넌트 구축 및 디자이너 협업
    • 더 나은 프롬프팅을 위한 cursor rule 제안
  • 안정적인 서비스 운영에 필요한 다양한 프론트엔드 모니터링
    • 데이터독 대시보드 구성 및 팀 내 공유, 데이터적으로 얻은 인사이트 주기적 공유
    • 주기적인 서비스 성능 모니터링 - 원인 확인 - 개선 루틴을 통한 서비스 개선 (빌드 산출물 크기 개선, 렌더링 개선 등)
    • 강의실 유저 CS를 위한 에러 트래킹 대시보드 구축 및 채널톡 연동 → 반복적인 검색단계 개선을 통한 오류 대응속도 개선
    • 느린 리소스 모니터링 대시보드, 각 국가 국제화 페이지에 대한 대시보드 구축 → 팀적으로 성능에 대한 관심도 개선
    • source, picture 태그를 활용한 avif, webp 이미지 도입 및 devops 협업을 통한 이미지 최적화
    • 불필요하게 포함된 모듈 제거를 통한 빌드 사이즈 개선, 리액트 쿼리 훅 호출 구조 개선을 통한 성능 개선 등
  • 온라인 강의 영상 플랫폼 인프런 개발 및 유지보수 (2021년 10월 - 진행 중)
    • 영상학습 환경 개선 및 영상 콘텐츠 보안을 위한 고도화
    • 영상 자막, 스크립트 기능, 3배속 기능 개발
    • 영상 길이에 따라 자막 스크립트 리스트가 대량 렌더링되어 발생한 성능 이슈를 가상스크롤 도입을 통해 개선
    • AI 퀴즈, AI 요약, 로드맵 강의실 기능 개발
    • 퀴즈 기능 배포 이후, 퀴즈를 완료한 유저 70% 이상의 진도율 달성 전환율 개선 (11.9% → 28.9%)
    • B2B 구독시스템을 위한 학습시간 트래킹 기능 구현
    • 메인 쓰레드 부하 회피를 위한 웹 워커를 활용한 타이머 구현
    • 영상보안 재생을 위한 DRM 재생 기능 개발
  • 인프런 서비스 개발
    • 인프런 마이 페이지 리뉴얼 및 i18n 적용
    • 레거시 b2b 홍보 페이지 React 전환 및 애니메이션 적용
    • 서로 강의를 주고 받을 수 있는 선물 기능 개발
    • 기존 레거시 장바구니 페이지 UI 개선 (구매 전환율 상승에 기여) - 2022년
    관련기술: React, Next.js, Vite, zustand, express, shaka-player, i18n

IT 인재 채용 플랫폼 랠릿

Jun. 2022 - Jul. 2024

  • 랠릿 이력서(프로필) 페이지 기능 고도화
    • input이 100개 이상 넘어갈 수 있는 복잡한 폼 컴포넌트 개발
    • 마크다운 형식의 입력형태 도입 및 PDF다운, 웹링크 공유 등 서비스 상에서 이력서를 자유롭게 작성하고 공유할 수 있는 기능 개발
  • 이력서 공개하여 누구나 열람할 수 있는 이력서 허브기능 개발 및 고도화
    • 다양한 이력서 템플릿을 실시간으로 적용해볼 수 있는 기능 개발
  • 라이트하우스 높은 점수 유지, SEO를 위한 구조화된 데이터(JSON-LD) 도입, 동적 sitemap 생성 → “OOO 개발자 이력서” 구글 키워드 1페이지 노출유도
  • 본인의 연봉 성장기록, 공부 기록 등을 관리할 수 있는 마이로그 서비스 개발
  • 생산성을 위한 랠릿 레거시 프로젝트 개선
    • Webpack → Vite 마이그레이션을 통한 Admin 빌드시간 50% 단축
    • 서로 다른 스택을 최대한 통일시킬 수 있도록 Vite, class-validator, zustand로 기술 통일
  • B2B 채용단계 커스터마이징, B2B 지원서 리뷰페이지 고도화

모두의셔틀

Jul. 2018 - Sep. 2020

  • 수요 기반 출근길 셔틀 서비스 모두의셔틀 개발 및 유지보수 (2018년 7월 - 2020년 9월, 2년 1개월)
  • Angular.js 레거시 프로젝트를 React 리뉴얼 (B2C, 도메인 별 Admin 등 여러 개로 분리)
  • 지리 데이터를 시각화하는 컴포넌트 개발 (출발/도착지 좌표 기반 검색, 신청자 위치 파악, 출근길 경로 제작 툴 등)
  • 프론트엔드 문서화를 위해 Storybook을 사용하여 기존 컴포넌트 문서화
  • 여러 개로 분리된 Admin에서 사용되는 공통적인 로직을 공통 모듈로 분리 후 Iframe을 통해 재활용하는 방식 채택
관련기술: React, Turf.js, 카카오맵 SDK, Bootstrap

듀스펙

웹퍼블리셔

Dec. 2014 - Jan. 2016

  • 공무원 시험 온라인 강의 서비스 듀스펙에서 웹퍼블리셔로서 근무하며 운영하는 사이트의 퍼블리싱을 담당하였습니다.

Education

자운고등학교

Skills

Frontend Development

  • React (상급)
  • Next.js (상급)
  • Typescript (상급)
  • Vite (중급)
  • zustand (중급)
  • shaka-player (중급)
  • Angular.js (중급)
  • i18n (중급)

Backend Development

  • express (중급)

DevOps & Monitoring

  • AWS (기초)
  • Datadog Rum (중급)

Certifications

정보처리산업기사

한국산업인력공단

Jan. 2017

Contacts

Email

padawanr0k@gmail.com

Custom

(+82) 010-6350-7149