MDX - Lingo.dev CLI

MDX란 무엇인가요?

MDX는 마크다운과 JSX를 결합한 형식으로, 마크다운 콘텐츠에서 React 컴포넌트를 직접 사용할 수 있게 해줍니다. 주로 문서 사이트와 콘텐츠가 풍부한 웹 애플리케이션에 사용됩니다.

예시:


---

title: "레스토랑 리뷰: 벨라 비스타"
description: "시내 중심가의 새로운 이탈리안 레스토랑에서의 식사 경험"
author: "not-localized-author"

---

# 벨라 비스타에서의 저녁 식사

지난달 메인 스트리트에 오픈한 새로운 이탈리안 레스토랑을 마침내 방문해 보았습니다.

## 분위기

이 레스토랑은 다음과 같은 따뜻하고 초대하는 분위기를 가지고 있습니다:

- **은은한 조명**으로 친밀한 환경을 조성
- *부드러운 재즈 음악*이 배경에서 연주됨

Lingo.dev CLI란 무엇인가요?

Lingo.dev CLI는 AI로 앱과 콘텐츠를 번역하기 위한 무료 오픈소스 CLI입니다. 기존 파이프라인과 통합하면서 전통적인 번역 관리 소프트웨어를 대체하도록 설계되었습니다.

자세한 내용은 개요를 참조하세요.

이 가이드에 대하여

이 가이드는 Lingo.dev CLI로 MDX 파일을 번역하는 방법을 설명합니다.

다음 내용을 배우게 됩니다:

처음부터 프로젝트 생성하기
번역 파이프라인 구성하기
AI로 번역 생성하기

사전 요구사항

Lingo.dev CLI를 사용하려면 Node.js v18+ 이상이 설치되어 있어야 합니다:

❯ node -v
v22.17.0

1단계. 프로젝트 설정하기

프로젝트 디렉토리에 i18n.json 파일을 생성합니다:

{
  "$schema": "https://lingo.dev/schema/i18n.json",
  "version": "1.10",
  "locale": {
    "source": "en",
    "targets": ["es"]
  },
  "buckets": {}
}

이 파일은 번역할 언어와 파일 시스템에 지역화 가능한 콘텐츠가 어디에 있는지를 포함하여 번역 파이프라인의 동작을 정의합니다.

사용 가능한 속성에 대해 자세히 알아보려면 i18n.json을 참조하세요.

2단계. 소스 로케일 구성하기

_소스 로케일_은 콘텐츠가 원래 작성된 언어와 지역입니다. 소스 로케일을 구성하려면 i18n.json 파일에서 locale.source 속성을 설정하세요:

{
  "$schema": "https://lingo.dev/schema/i18n.json",
  "version": "1.10",
  "locale": {
    "source": "en",
    "targets": ["es"]
  },
  "buckets": {}
}

소스 로케일은 BCP 47 언어 태그 형식으로 제공되어야 합니다.

Lingo.dev CLI가 지원하는 로케일 코드의 전체 목록은 지원되는 로케일 코드를 참조하세요.

3단계. 대상 로케일 구성하기

_대상 로케일_은 콘텐츠를 번역하고자 하는 언어와 지역입니다. 대상 로케일을 구성하려면 i18n.json 파일에서 locale.targets 속성을 설정하세요:

{
  "$schema": "https://lingo.dev/schema/i18n.json",
  "version": "1.10",
  "locale": {
    "source": "en",
    "targets": ["es"]
  },
  "buckets": {}
}

4단계. 소스 콘텐츠 생성하기

아직 생성하지 않았다면, 번역할 콘텐츠가 포함된 하나 이상의 MDX 파일을 생성하세요. 이 파일들은 경로 어딘가에 소스 로케일이 포함된 위치에 있어야 합니다(예: en/과 같은 디렉토리 이름이나 messages.en.mdx와 같은 파일 이름의 일부로).

5단계. 버킷 생성하기

i18n.json 파일에서 buckets 객체에 "mdx" 객체를 추가하세요:

{
  "$schema": "https://lingo.dev/schema/i18n.json",
  "version": "1.10",
  "locale": {
    "source": "en",
    "targets": ["es"]
  },
  "buckets": {
    "mdx": {}
  }
}

"mdx" 객체에서 하나 이상의 include 패턴 배열을 정의하세요:
```
{
  "$schema": "https://lingo.dev/schema/i18n.json",
  "version": "1.10",
  "locale": {
    "source": "en",
    "targets": ["es"]
  },
  "buckets": {
    "mdx": {
      "include": ["./[locale]/example.mdx"]
    }
  }
}
```
이 패턴들은 어떤 파일을 번역할지 정의합니다.

패턴 자체는:
- 구성된 로케일의 플레이스홀더로 [locale]을 포함해야 합니다
- 파일 경로를 가리킬 수 있습니다(예: "[locale]/blog.mdx")
- 와일드카드 플레이스홀더로 별표를 사용할 수 있습니다(예: "[locale]/*.mdx")
재귀적 글로브 패턴(예: **/*.mdx)은 지원되지 않습니다.

6단계. LLM 구성하기

Lingo.dev CLI는 대규모 언어 모델(LLM)을 사용하여 AI로 콘텐츠를 번역합니다. 이러한 모델 중 하나를 사용하려면 지원되는 제공업체의 API 키가 필요합니다.

가능한 빨리 시작하려면 Lingo.dev Engine을 사용하는 것이 좋습니다 — 매월 10,000 토큰의 무료 사용량을 제공하는 자체 호스팅 플랫폼입니다:

Lingo.dev 계정에 가입하세요.
다음 명령어를 실행하세요:
```
npx lingo.dev@latest login
```
이렇게 하면 기본 브라우저가 열리고 인증을 요청합니다.
안내에 따르세요.

7단계. 번역 생성하기

i18n.json 파일이 포함된 디렉토리에서 다음 명령어를 실행하세요:

npx lingo.dev@latest run

이 명령어는 다음을 수행합니다:

i18n.json 파일을 읽습니다.
번역이 필요한 파일을 찾습니다.
파일에서 번역 가능한 콘텐츠를 추출합니다.
구성된 LLM을 사용하여 추출된 콘텐츠를 번역합니다.
번역된 콘텐츠를 파일 시스템에 다시 작성합니다.

번역이 처음 생성될 때 i18n.lock 파일이 생성됩니다. 이 파일은 어떤 콘텐츠가 번역되었는지 추적하여 이후 실행 시 불필요한 재번역을 방지합니다.

예시

en/example.mdx


---

title: "레스토랑 리뷰: 벨라 비스타"
description: "시내 새 이탈리안 레스토랑에서의 식사 경험"
author: "not-localized-author"
published: "2024-03-15"
rating: 4.5
locked_key_1: "This value should remain unchanged in all locales"
ignored_key_1: "This field should not appear in target locales"

---

# 벨라 비스타에서의 저녁 식사

지난달 메인 스트리트에 오픈한 새 이탈리안 레스토랑을 마침내 방문해 보았습니다. 여기 솔직한 리뷰를 남깁니다.

## 분위기

레스토랑은 다음과 같은 따뜻하고 초대하는 분위기를 가지고 있습니다:

- **은은한 조명**으로 친밀한 환경을 조성합니다
- *부드러운 재즈 음악*이 배경에서 연주됩니다
- 모든 테이블에 신선한 꽃이 있습니다

es/example.mdx


---

title: "Reseña de Restaurante: Bella Vista"
description: "Nuestra experiencia gastronómica en el nuevo restaurante italiano del centro"
author: "not-localized-author"
published: "2024-03-15"
rating: 4.5
locked_key_1: "This value should remain unchanged in all locales"

---

# Cena en Bella Vista

Finalmente probamos el nuevo restaurante italiano que abrió el mes pasado en Main Street. Esta es nuestra reseña honesta.

## El Ambiente

El restaurante tiene un ambiente cálido y acogedor con:

- **Iluminación tenue** que crea un ambiente íntimo
- *Música de jazz suave* sonando de fondo
- Flores frescas en cada mesa

i18n.json

{
  "version": "1.10",
  "locale": {
    "source": "en",
    "targets": ["es"]
  },
  "buckets": {
    "mdx": {
      "include": ["./[locale]/example.mdx"],
      "lockedKeys": ["locked_key_1"],
      "lockedPatterns": ["pattern_1"]
    }
  },
  "$schema": "https://lingo.dev/schema/i18n.json"
}

i18n.lock

version: 1
checksums:
  0d5b5aa6d2b9937d47fd63868ef9e9f6:
    meta/title: a4bdd0dee24f8318f3300dcae130a353
    meta/description: 609213841f122e494f62262618ee4761
    meta/author: f3f7164b5963b4da6cd31a2ec0251630
    content/0: 8a8520492d23503da5691602e60bd22a
    content/1: 1fc859854cda505b2a94a04c8b09ab43
    content/2: 8add667f2a1d5d791a64b50bde54fa59
    content/3: e6e34c4c92eda512ec209266abe8e074
    content/4: 07f1896ad050b9606d7674f70d847818
    content/5: bd4d40a4f0cc92ac8a880c8d9ce8b43d
    content/6: 3036a07a887121ea080427d84fc80912
    content/7: f555318416c5c5388c1d961ef02f5955
    content/8: 90e02688ab103de60e42c70ece7efc4d
    content/9: 8c5be3cd002a3a194c991821e0182e08
    content/10: 3495801a7461ac5ea8d78369873a5409
    content/11: d444739ce3d48afb7976067c67149a9e
    content/12: 5f02c0a3b6385f80bdd08cf7e2d8c04d
    content/13: 0a15fd446b87d907f58c303aece0882b
    content/14: 778ed0aa1f81768280a23afe559c55f7
    content/15: fa244af2d8e558d6c3644ff8c1a64562
    content/16: 14f593e7cf3b3df84a21e17db318912e
    content/17: 5f42d26a42aa29be063019eea27ad07c
    content/18: 48bb7e89e72d68d6de12f5cdac64fc18
    content/19: 1639b9ef57bf363e04293e27d1c13952
    content/20: bb1c8d22064f7af4879c69d444e6e769
    content/21: 52f9d6beaa85591f77811e1162d756c4