TWIP

소개

• 입사 후 트윕 레거시 제품들의 유지보수
• FE팀 내에서 레거시 Vue 및 Javascript 코드 수정을 거의 전담하여 진행
• 회사 폐업(2024년 6월 28일)에 따른 서비스 종료 작업까지 직접 진행

프로젝트 환경

• 소속: EJN
• 작업 기간: 2021년 11월 ~ 2024년 6월
• 개발 스택: Php, Javascript, Vue, jQuery, Electron

유지보수 했던 앱들 스크린샷

해결한 문제

1. Overlay에 트랜스파일 과정 도입

• TWIP 후원 방송 오버레이는 5천 줄의 하나의 js 파일로 구성되어 있었고, 트랜스파일 과정 없이 레거시 javascript 문법으로 작업 후 배포하는 프로세스를 가짐
• 처음 오버레이 작업 시 제품에 알 수 없는 문제가 발생하여 약 3시간 동안 일부 스트리머들에게 후원 오버레이가 먹통이 되는 현상이 발생
  • 트러블슈팅 과정에서 방송 송출 프로그램의 내장 Chromium 버전이 68 이하로 낮아 작업한 구문이 지원되지 않았음을 발견
• 약 3시간 동안 먹통으로 회사는 총 500만 원의 비용 피해를 입음
• 이 사건 이후 오버레이 파일 작업 플로우에 트랜스파일 과정을 포함하여 배포하도록 함
  • 추후 레거시 문법에 익숙하지 않은 작업자들도 인지 스트레스 없이 작업하고 같은 문제가 재발하지 않도록 프로세스를 만듦

2. Backend팀에서 담당하고 있던 레거시 Vue 코드 관리 주체를 Frontend팀으로 이관하여 효율적인 조직 리소스 관리에 기여

• 기존 레거시는 Php 위에서 Javascript와 Vue를 서빙하고 있었고, 이를 FE팀이 아닌 BE팀에서 화면을 수정하는 관행이 있었음
• Php와 결합된 .php 파일을 제외한 나머지 Javascript, Vue는 FE팀에서 충분히 관리가 가능하다고 판단하여 관리 주체를 FE팀으로 이관
  • 이를 통해 BE 개발자들이 더 많은 시간을 BE 로직에 집중할 수 있도록 하여 조직 전체의 효율성에 기여함