LingoTuner

Multilingual translation toolkit for React apps and CLI-based workflows
리액트 앱과 CLI 워크플로우를 위한 다국어 번역 툴킷

🚀 Features (기능)

CLI Commands (CLI 명령어)

| Command | Description | 설명 | |---------|-------------|------| | signin | Authenticate and save account key (once per device) | 계정 키를 인증하고 저장 (PC 1회 실행) | | init | Select project and save project id (once per project) | 프로젝트를 선택하고 id를 저장 (프로젝트당 1회) | | extract | Extracts translatable strings from JSX/TSX | JSX/TSX에서 번역 가능한 문자열 추출 | | apply | Applies label keys into JSX/TSX | JSX/TSX에 label 키를 적용하여 치환 | | push | Pushes assets.json to server | 추출한 번역 파일을 서버에 업로드 | | pull | Pulls translations from server | 서버로부터 번역 파일을 받아옴 |

SDK for React (React 환경에서의 SDK 사용)

• ✅ Easily usable via import { lingotuner } from 'lingotuner' in your components

• ✅ Automatically fetches and caches translation data based on the user's browser locale

• ✅ Can be used directly in JSX like lingotuner.Home_title_abcde

• ✅ Automatically loads /assets.json on first access

• ✅ import { lingotuner } from 'lingotuner'로 바로 사용 가능

• ✅ 자동 fetch 및 locale 감지 (브라우저 언어 기반)

• ✅ lingotuner.Home_title_abcde처럼 JSX 내에서 직접 사용 가능

• ✅ 첫 접근 시 자동으로 /assets.json 로드됨

🔧 Installation (설치)

npm install lingotuner

🖥 Usage in CLI (CLI 사용 예시)

1. Sign in (로그인)

lingotuner signin [YOUR_ACCOUNT_KEY]

2. Init (초기 설정)

lingotuner init

3. Extract (문자열 추출)

lingotuner extract

4. Push to server (서버로 업로드)

lingotuner push

5. Pull from server (서버에서 다운로드)

lingotuner pull

6. Apply (코드에 label 적용)

lingotuner apply

💡 SDK Example (React에서 사용 예시)

import { lingotuner } from 'lingotuner';

export default function HomePage() {
  return <h1>{lingotuner.Home_title_Fx8Aa}</h1>;
}

lingotuner will automatically load and cache /assets.json on first import. If the translation data is not yet loaded, it returns an empty string (''). Once loaded, it displays the translated string based on the user's browser language.

lingotuner는 import 시 자동으로 /public/assets.json을 로드하고 캐싱합니다. 로딩 중에는 빈 문자열('')이 반환되며, 이후에는 해당 언어의 번역이 표시됩니다.

📁 assets.json Example (예시)

{
  "meta": {
    "original_language": "ko"
  },
  "Home_title_Fx8Aa": {
    "ko": "홈 화면입니다",
    "en": "Welcome Home",
    "route": "src/pages/Home.tsx:5",
    "tag": "h1"
  }
}

🛠 Requirements (요구사항)

• Node.js v18 or higher / Node.js v18 이상
• A React app or JSX/TSX-based project / React 앱 또는 JSX/TSX 기반 프로젝트

📦 Output Structure (결과물 구조)

public/assets.json
    # Translation data used by the SDK
    # SDK에서 사용하는 번역 데이터
src/
    # Result of the 'apply' command (code modified)
    # apply 명령 실행 결과 (코드가 수정됨)
lingotuner.config.json
    # Project information saved by 'init'
    # init 명령으로 저장된 프로젝트 정보

🧑‍💻 Author / 개발팀

UOS team Locauto

[email protected]

📄 License

Apache License 2.0