
프론트엔드
Transpiler, “사용”말고 “활용”하기
두줄요약
토스뱅크는 transpiler를 활용해 클릭 요소에 로깅 속성을 자동 주입하는 방식을 만들었습니다. 이를 통해 개발자는 로깅을 신경 쓰지 않고 비즈니스 로직에 집중할 수 있게 되었습니다.
핵심 내용
- transpiler를 단순 사용 도구가 아닌 코드 변환 자동화 수단으로 재해석
- 클릭 가능 요소에
data-click-log를 자동 주입해 로깅 누락과 오타를 줄이는 방식 제안 - Babel/SWC 플러그인과 AST 순회를 활용해 클릭 로깅을 비즈니스 로직에서 분리
- 반복적이고 규칙적인 코드 변경에 transpiler를 적용할 수 있는 확장 가능성 제시