미리보기

• Media Analytics 개발

  • Video Player Enhancement 로그 기반 주요 지표(재생 성공 수, 재생 시간 등) 시각화

  • 공통 필터 시스템 구현 -> 모든 페이지에서 동일 조건 비교 가능

  • OTP + 이메일 기반 2차 인증 기능 개발

• Video Player Enhancement 유지보수

  • 네이버 클라우드 내 상품인 VPE 개발 및 유지보수

• 카페24 기반 숏폼 커머스 앱 쇼츠24 개발

  • 숏폼 콘텐츠 재생 위젯 개발 (3D 큐브 전환 UI 포함)

  • 숏폼 로그 수집 및 분석 탭 시각화 구현

• 라이브 커머스 앱 라이브24 내 영상 편집 도구 개발

  • HLS 기반 비디오 트리머 개발 -> 2% 단위 탐색 후 캡처 -> 타임라인 구현

  • 시작/종료 지점 지정 ->서버에 구간 정보 전달

  • 사용자 직관성 고려한 인터페이스 설계

• 라이브 커머스 앱 라이브24의 알림 받기 PWA 개발

  • Firebase Cloud Messagin API를 이용해 쇼핑몰 라이브 시 알림 구현

실시간 로그 기반 사용자 행동 분석 및 오류 대응을 위한 플레이어 통합 분석 시스템

네이버 클라우드 Video Player Enhancement 부가 상품

• Highcharts로 시각화 컴포넌트 개발

• 공통 필터 구조 설계 -> 페이지 간 필터 유지 및 sessionStorage 연동

• OTP + 이메일 기반 2차 인증 로직 구현

• Nuxt i18n 활용해 한국어·영어·일본어 다국어 지원

기술 스택: Vue, Nuxt, JavaScript, TailwindCSS, Highcharts, i18n

커스터마이징 가능한 웹 기반 고성능 플레이어

네이버 클라우드 내 미디어 섹션 상품

• 네이버 클라우드 기획자들과 협업을 통해 정책 및 요구 사항 적용

• 상품 문의 인입 시 피드백 도움

• 정기, 서스펜스 배포 후 버그 발생 시 수정 및 QA 진행

기술 스택: Vue, JavaScript

쇼핑몰 내 숏폼 콘텐츠를 상품과 연동하고, 위젯으로 삽입 가능한 영상 커머스 플랫폼

• 기존 Live24위젯에 통합되어 있던 구조에서 별도로 분리, 번들 사이즈 약 40% 감소

  • Swiper.js로 3D 큐브(인스타그램 스토리 UI) 위젯 개발

  • 플로팅 UI 등 다양한 숏폼 재생 형태 구현

• Highcharts로 시청 시간, 클릭율 등 전환 지표 시각화

기술 스택: Vue, Nuxt, TailwindCSS, Firebase, Highcharts, Swiper.js

설치 한 번으로 실시간 방송과 다시보기를 통한 영상 커머스를 구현하는 플랫폼

• 실시간 방송 종료 후 생성되는 HLS 영상을 편집하는 트리머 기능 구현

  • HLS 영상을 2% 단위로 탐색해 주요 장면 캡처 후 타임라인 구성

  • GSAP 기반 드래그 API로 시작/종료 막대 조작 UX 구성

• 공통 Alert 시스템

  • Pinia + 전역 레이아웃 기반으로 설계 및 적용

  • 모든 컴포넌트에서 간편하게 알림 노출 가능하도록 전역 구조 설계

기술 스택: Vue, Nuxt, JavaScript, TailwindCSS, Pinia, HLS.js, GSAP

라이브 방송 시작 시 사용자에게 푸시 알림을 전송하는 FCM 기반의 PWA 앱

• Next.js 기반으로 PWA 구성 및 설치형 모바일 앱 구현

• 클라이언트에서 FCM 토큰 생성 → 서버 전달 및 저장 처리

• 서버와 협업하여 저장된 토큰에 대해 방송 시작 시 푸시 알림 전송 흐름 구현

• Firebase Cloud Messaging API 연동 및 테스트 주도

기술 스택: React, Next.js, TypeScript, Firebase, Firebase, PWAw