Developer Experience & Platform UX — better-i18n: 속도를 위해 구축하고 즐거움을 위해 설계
모든 인터랙션이 의도적으로 설계된 developer experience — Command Palette 탐색, Inline Editing, Auto-Sync, 그리고 모든 워크플로우에 내장된 AI 지원.
Cmd+K로 어디서든 즉시 이동
Command Palette는 better-i18n을 가장 빠르게 탐색하는 방법입니다. Cmd+K(Windows/Linux에서는 Ctrl+K)를 누르면 플랫폼의 모든 곳에 즉시 접근할 수 있습니다 — 프로젝트로 이동, 네임스페이스 전환, 설정 열기, 액션 트리거, 모두 키보드에서 손을 떼지 않고 가능합니다.
파워 유저들은 Command Palette 안에서 생활합니다. 프로젝트, 키, 설정을 인덱싱하여 하나의 유연한 동작으로 검색하고 실행할 수 있습니다. 더 이상 메뉴를 클릭하거나 어디에 무엇이 있는지 기억할 필요가 없습니다.
몇 분 안에 출시할 수 있는 온보딩
better-i18n을 처음 사용하시나요? 온보딩 마법사가 설정을 단계별로 안내합니다 — 리포지토리를 연결하고, 첫 번째 프로젝트를 구성하고, 언어를 추가하고, 첫 번째 번역을 푸시합니다. 각 단계는 다음으로 넘어가기 전에 유효성을 검사하여 잘못된 구성으로 끝나는 일이 없도록 합니다.
마법사는 여러분의 스택에 적응합니다. Next.js, TanStack Router와 React, Expo, Flutter 중 무엇을 사용하든 프레임워크를 감지하고 설정 지침을 그에 맞게 조정합니다.
스케일을 위해 구축된 Translation Editor
Translation Editor는 팀이 가장 많은 시간을 보내는 곳이므로, 무거운 워크로드도 거뜬히 처리할 수 있도록 구축했습니다.
5,000개 이상의 키를 위한 Virtual Scrolling
기존 테이블 렌더링은 대규모 키 세트에서 버벅거립니다. better-i18n은 가상화 렌더링을 사용합니다 — 뷰포트에 보이는 행만 DOM에 존재합니다. 50개 키 프로젝트와 동일한 부드러운 성능으로 5,000개, 10,000개, 심지어 50,000개의 키를 스크롤할 수 있습니다.
Inline Editing — 클릭, 입력, 완료
모든 번역 셀은 직접 편집 가능합니다. 셀을 클릭하고 번역을 입력한 다음 다음 셀로 이동합니다. 모달 없음, 저장 버튼 없음, 추가 클릭 없음. 에디터가 방해하지 않으므로 번역가는 콘텐츠에 집중할 수 있습니다.
3.5초 디바운스가 적용된 Auto-Sync
변경 사항은 자동으로 저장됩니다. 타이핑을 멈추면 3.5초 디바운스가 Zustand 스토어를 통해 서버로 Sync를 트리거합니다. 저장을 기억할 필요가 없으며 작업이 손실되지 않습니다. 툴바의 Sync 인디케이터가 변경 사항이 언제 저장되었는지 정확히 보여줍니다.
네임스페이스 그룹화
대규모 프로젝트는 키를 네임스페이스로 구성합니다. 에디터에서 네임스페이스 그룹을 펼치고 접을 수 있어 관련 없는 키의 시각적 혼란 없이 작업 중인 섹션에 집중할 수 있습니다.
검색 및 필터링
키 이름이나 번역 값으로 검색하여 모든 키를 즉시 찾을 수 있습니다. 네임스페이스, 언어, 또는 번역 상태(번역됨, 미번역, 검토 필요)로 필터링하여 주의가 필요한 작업에 정확히 집중할 수 있습니다.
Activity Log — 모든 액션에 대한 완전한 가시성
프로젝트 수준의 Activity Log는 프로젝트 전반에서 수행된 모든 액션을 추적합니다 — 키 생성, 번역 업데이트, 퍼블리시, 설정 변경, 팀 멤버 추가. 각 항목은 누가 무엇을 언제 어떤 리소스에 했는지 보여줍니다.
팀에게 필수적입니다. 번역이 프로덕션에서 깨지면 Activity Log가 어떤 변경이 원인인지, 누가 했는지 정확히 알려줍니다. 더 이상 추측하거나 서로 비난할 필요가 없습니다.
글로벌 AI Drawer
AI 채팅 패널은 플랫폼의 모든 페이지에서 접근 가능합니다. 번역에 관한 질문을 하거나, 카피 개선 제안을 받거나, 새로운 언어의 번역을 생성하거나, 구성 문제를 해결하기 위해 열 수 있습니다.
AI Drawer는 현재 프로젝트와 현재 페이지에 대한 컨텍스트를 유지하므로 매번 설정을 설명하지 않아도 관련 답변을 제공할 수 있습니다.
Developer Tools Modal
디버깅 및 성능 최적화를 위해 Developer Tools Modal은 내부에서 무슨 일이 일어나고 있는지 가시성을 제공합니다 — API 호출 타이밍, 캐시 히트율, Sync 상태, 구성 진단. 플랫폼이 정확히 어떻게 동작하는지 이해하려는 엔지니어를 위해 개발 모드에서 사용 가능합니다.
LLM 프로바이더 관리
better-i18n은 AI 기반 번역을 위해 여러 LLM 프로바이더와 통합됩니다. 프로바이더 관리 인터페이스를 통해 다음이 가능합니다:
- 프로바이더 추가 — OpenAI, Anthropic, Google 또는 기타 지원되는 LLM 프로바이더 연결
- 모델 구성 — 각 프로바이더에 사용할 모델 선택
- 우선순위 설정 — 프로바이더를 사용할 수 없을 때의 폴백 순서 정의
- 사용량 모니터링 — 프로바이더별 토큰 소비 및 비용 추적
이를 통해 팀은 번역 워크플로우를 구동하는 AI 백엔드를 완전히 제어할 수 있습니다.
내장 Analytics
PostHog 이벤트 트래킹이 플랫폼 전반에 통합되어 있어 팀이 better-i18n을 어떻게 사용하는지에 대한 인사이트를 제공합니다 — 어떤 기능이 가장 많이 사용되는지, 사용자가 어디서 마찰을 경험하는지, 번역 속도가 시간에 따라 어떻게 변하는지. 완전한 개인정보 보호를 위해 모든 데이터는 여러분의 PostHog 인스턴스 내에 유지됩니다.