Transpiler, “사용”말고 “활용”하기
7
AI 요약
이 글은 AI가 원문을 분석하여 핵심 내용을 요약한 것입니다.
Transpiler를 활용한 로깅 자동화 사례
이 게시물은 토스뱅크에서 transpiler를 활용해 프론트엔드 로깅 과정을 개선한 사례를 소개합니다.Transpiler와 로깅의 역할
- Transpiler는 JSX, TypeScript 코드를 브라우저가 이해하는 JavaScript로 변환하는 도구입니다.
- 기존 로깅은 data-click-log 속성을 수동으로 붙여야 했고, 실수로 누락될 위험이 있었습니다.
자동화 구현 방법
- SWC와 Babel용 플러그인을 만들어 클릭 가능한 요소에 자동으로 data-click-log 속성을 주입하도록 했습니다.
- 이로써 개발자는 로깅 코드를 생략하고 비즈니스 로직에 집중할 수 있게 되었습니다.
확장 가능성
- 앞으로 다국어 처리 등 다양한 분야에 transpiler 활용을 확대할 계획입니다.