김경미 포트폴리오
프로젝트
GitHub
프로젝트
GitHub
  • 프로젝트
    • ifkakao
    • 팝업 레이어 모듈
    • kakao 전지적친구시점
    • Useragent 모듈
    • Nuxt3 보일러플레이트
    • 테크카카오
    • Nuxt2 컴포넌트
    • 레디엔터테인먼트
    • 카카오 karlo 프로모션
    • 카카오엔터테인먼트 오디션
    • 카카오모빌리티 디벨로퍼스
    • 카카오 IR 미팅 예약 시스템
    • MOA
← 전체 프로젝트
서비스2022.05Nuxt2i18nAWS

카카오엔터테인먼트 오디션

프로젝트 개요

주요 오디션들에 대한 공지와 팝업을 제공하고, 페이지를 통해 해당 오디션 및 상시 오디션에 지원할 수 있도록 하는 서비스

프로젝트 정보

  • 카카오엔터테인먼트 오디션 (현재 폐쇄)

기술 스택

  • UI: HTML, SCSS
  • FRONT: Nuxt2

주요 구현 기능

  • AWS 버킷을 사용한 리소스 관리
  • i18n 라이브러리를 활용한 다국어 지원
    • 현재 국문, 영문 2가지 언어를 지원하나, 추후 확장 가능성을 고려하여 라이브러리를 사용하여 개발
  • 마우스 포인터 컴포넌트 커스텀
    • 마우스 포인터를 컴포넌트로 커스텀하여 사용할 수 있도록 구현
  • timezone에 따른 접속 지역별 시간 노출
    • 시간이 중요한 오디션 채널인 만큼 서버타임 및 API를 이용하여 접속 지역별 시간이 노출되도록 구현
  • 인풋 및 파일 업로드에 대한 유효성 검증 진행
    • 서버 검증 이전에 프론트에서도 체크할 수 있도록 인풋 필수값, 주민번호, 전화번호 등 입력 형식 체크, 파일 업로드 확장자 검증 등 진행

문제 및 해결

  • 마우스 포인터 커스텀과 접근성
    • 문제 고객사에서 인터랙션이나 효과를 중점적으로 여겨 마우스 포인터 커스텀을 원했으며, 해당 부분에 대하여 접근성을 크게 고려하지 못하였다.
    • 개선 추후 UI적 요소와 접근성이 충돌할 때 한 번 더 경중을 고려해야 할 필요성을 느꼈다. 접근성을 고려한다면 해당 기능을 스펙아웃하는 제안도 해볼 수 있을 것 같다.
  • 일부 페이지 제외
    • 문제 오픈 전에 특정 페이지를 배포 및 노출하지 않고, 개발 서버를 통해서만 확인하고 싶다는 요청이 있었다.
    • 해결 타 브랜치를 이용하여 요청 페이지 코드를 관리하고, 기본 외 다른 개발 서버를 이용하여 배포 및 확인할 수 있게 분리, 개발 및 배포 루트가 2개로 분리되어 관리할 수 있도록 작업하였다.
Prev
카카오 karlo 프로모션
Next
카카오모빌리티 디벨로퍼스