#Frontend

사람도 AI도 놓친 번역 누락, ESLint 플러그인을 만들어 해결하기

Summary

AI도 놓친 번역 누락, 직접 만든 린트(ESLint) 플러그인으로 100% 잡아내기

결정론적인 린트의 정밀함과 확률론적인 AI의 유연함이 만난 다국어 정복기

배달의민족 서비스의 다국어 지원 과정에서 발생한 번역 관리의 어려움을 커스텀 ESLint 플러그인 개발로 해결한 기술적 여정을 담고 있습니다. 단순히 도구를 사용하는 수준을 넘어, 소스 코드의 추상 구문 트리(AST)를 직접 분석하여 복잡한 팀 내 컨벤션을 자동화된 검증 규칙으로 바꾼 실무 노하우를 공유합니다.

01사람과 AI 검수의 한계를 극복하기 위해 결정론적 정적 분석 도구인 ESLint를 선택한 배경 제시
02Scope Stack 개념을 도입하여 노출 가능한 한글 문자열과 안전지대(Import, 주석 등)를 정교하게 구분
03기수(Cardinal) 및 서수(Ordinal) 판단을 위해 키워드 매칭 기반의 휴리스틱 탐지 로직 구현
04린트는 위반 사항을 탐지만 하고, 교정은 자연어 처리에 능한 AI에게 맡기는 효율적인 역할 분담 전략
05실제 적용 결과 180개 이상의 잠재적 번역 이슈를 차단하며 정적 분석의 강력한 효능 입증

RECOMMENDATION

다국어 프로젝트의 복잡한 번역 컨벤션으로 고민하거나, 팀만의 고유한 코드 규칙을 강제하고 싶은 시니어 프론트엔드 개발자에게 일독을 권합니다.

The Problem

다국어 지원을 위해 수립한 @lib/i18n 컨벤션이 사람의 부주의와 AI의 확률론적 한계로 인해 제대로 지키기 어려웠으며, 이로 인해 번역 누락과 기수·서수 오역 등의 품질 저하 문제가 발생했습니다.

The Solution

TypeScript AST 분석을 기반으로 한 3가지 커스텀 ESLint 규칙(한글 제한, 기수/서수 권장, Trans 컴포넌트 제약)을 개발하여 결정론적으로 위반 사항을 탐지하고, 교정 과정에 AI 에이전트를 활용하는 하이브리드 전략을 도입했습니다.

The Result

운영 배포 전 182건의 번역 누락과 5건의 오역을 사전에 발견해 해결했으며, 즉각적이고 무료인 실시간 피드백 시스템을 통해 장기적으로 지속 가능한 코드 품질 관리 체계를 구축했습니다.

Trade-off

오탐을 줄여 정확도를 높일수록 탐지 로직이 복잡해져 유지보수 부담이 커지는 한계가 있었으며, 이에 따라 로직을 과하게 복잡하게 만들기보다는 일부 케이스에서 린트 비활성화를 허용하는 방식으로 절충했습니다.

Key Concepts

Concept · 01

AST (Abstract Syntax Tree)

프로그래밍 언어로 작성된 소스 코드의 구조를 트리 형태로 나타낸 추상 구문 트리로, 코드 분석 및 변환의 기초가 됩니다.

ESLint가 코드를 순회하며 특정 노드(Literal, JSXText 등)에 진입할 때 컨벤션 위반 여부를 판단하는 핵심 수단으로 활용되었습니다.

Concept · 02

Scope Stack

코드의 중첩된 스코프 구조를 스택 자료구조로 관리하여 특정 지점의 유효성이나 상태를 추적하는 기법입니다.

Import 문이나 t() 함수 내부와 같이 번역이 필요 없는 '안전지대'를 추적하여 한글 문자열 검사 대상에서 제외하는 로직에 적용되었습니다.

Concept · 03

ICU Message Format

국제 표준 규격에 따라 수량, 성별, 서수 등 복잡한 메시지 형태를 보간(Interpolation)하는 문법입니다.

기수형(tCardinal) 및 서수형(tOrdinal) API의 메시지 구조를 정의하고 린트 규칙이 이를 식별하는 기준으로 사용되었습니다.

Continue reading · same source

More from 우아한형제들

View all posts from 우아한형제들

사람도 AI도 놓친 번역 누락, ESLint 플러그인을 만들어 해결하기

Summary