핵심 요약
토스의 결제창 시스템 전면 재작성 사례로, FE/BE의 관심사를 분리하고 3-Step 결제 흐름과 Bridge 인터페이스를 도입해 레거시를 개선했습니다.
구현 방법
- 3-Step 결제 흐름(ENTRY, PREPARE, CONFIRM) 도입 및 Bridge 인터페이스로 데이터 전달 흐름 표준화
- OpenAPI Converter와 Legacy Converter를 분리한 파라미터 처리 구조로 레거시 파라미터와 OpenAPI 파라미터의 독립적 확장성 확보
- FE- BE 강결합 해소를 위한 SessionCreationRequest 도입 및 파라미터 관리의 추상화
- Canary 배포 및 자동 롤백으로 서비스 연속성 보장
- Preflight 제거와 Multi-Layer Cache 도입으로 첫 화면 로딩 속도 개선 및 대규모 트래픽 대응
주요 결과
- 1달 내 개발 완료(서버 개발자 2명, FE 개발자 1명 투입)
- 레거시 시스템의 로직을 모듈화하고 핵심 로직을 재사용 가능한 컴포넌트로 재탄생
- FE/BE 관심사 분리와 3-Step 흐름, 브릿지 인터페이스 도입으로 확장성과 유지보수성 향상



