레거시 페이지 100개 이상을 React와 Next.js로 이전

문제

Traveloka의 숙박 파트너용 제품(TERA)은 일부가 Apache Velocity로 만든 레거시 모놀리스에서 돌아가고 있었습니다. 목표는 제품 개발을 멈추지 않고 이를 현대적인 React와 Next.js 프론트엔드 스택으로 옮기는 것이었습니다.

접근 방식

• 한 번에가 아니라 점진적으로. 이전 전략은 제가 맡았습니다. 제품은 계속 출시하면서, 페이지를 하나씩 React와 Next.js 저장소로 옮겼습니다.
• 패턴을 먼저 정의. 본격적인 작업에 앞서 이전 아키텍처, 재사용 가능한 패턴, 기술 표준을 합의해, 페이지마다 처음부터 다시 만들지 않도록 했습니다.
• 팀 간 조율. 구현과 배포는 여러 팀이 나눠 맡았고, 페이지마다 담당을 분명히 하고 원래 페이지와 같은지 일관된 방식으로 확인했습니다.

Traveloka 초기에 저는 이미 11개 페이지(약 35인주 분량)를 모놀리스에서 Front-End Web 저장소로 옮겼고, 그것이 이 큰 작업의 첫걸음이었습니다.

결과

플랫폼 전체를 다시 쓰지 않고, 그에 따르는 위험도 지지 않으면서, 100개가 넘는 레거시 페이지를 React와 Next.js로 현대화했습니다.