Hello world

;\n}\n```\n\n**리터럴을 현지화 가능하게 만들기:**\n\nJSX 프래그먼트로 문자열 리터럴을 감싸면 현지화 가능하게 만들 수 있습니다:\n\n```tsx\n// 이전: 현지화 불가능\nconst message = \"Hello world\";\n\n// 이후: 프래그먼트를 사용하여 현지화 가능\nconst message = <>Hello world;\n\n// 컴포넌트에서 사용\nfunction Component() {\n return

{message}

;\n}\n```\n\n**대안적 접근법:**\n\n```tsx\n// 동적 메시지의 경우\nfunction getLocalizedMessage() {\n return <>Something went wrong;\n}\n\n// 조건부 텍스트의 경우\nconst statusText = isError ? <>Error occurred : <>Success;\n```\n\n이 규칙은 현지화 가능한 콘텐츠와 현지화 불가능한 콘텐츠 간의 명확한 경계를 유지하면서 일관된 현지화 동작을 보장합니다.\n\n향후 더 많은 사용 사례를 지원하기 위한 방법을 모색하고 있습니다. 지원되길 원하는 특정 패턴에 대해 논의하려면 [Discord에 참여](https://lingo.dev/go/discord)하세요.\n\n## 어떤 프레임워크가 지원되나요?\n\n**Lingo.dev 컴파일러**는 현재 다음 React 프레임워크를 지원합니다:\n\n- **Next.js** (App Router만 해당)\n- **React Router** v6+\n- **Remix** (최신 버전)\n- **Vite + React**\n\n다른 플랫폼에 대한 컴파일러 지원 구현에 관심 있는 기여자를 환영합니다. 구현 전략에 대해 논의하려면 [Discord에 참여](https://lingo.dev/go/discord)하세요.\n\n## 더 많은 언어를 추가할 수 있나요?\n\n네! 컴파일러 구성에서 직접 사용자 정의 모델을 구성하여 언어 지원을 확장할 수 있습니다:\n\n```ts\nconst compilerConfig = {\n sourceLocale: \"en\",\n targetLocales: [\"es\", \"fr\", \"de\", \"pt\", \"it\"],\n models: {\n \"*:pt\": \"mistral-saba-24b\",\n \"en:it\": \"meta-llama/llama-4-maverick-17b-128e-instruct\",\n \"*:*\": \"mistral-saba-24b\",\n },\n};\n\nlingoCompiler.next(compilerConfig)(nextConfig);\n```\n\n자세한 내용은 [고급 구성](../configuration/advanced#custom-model-configuration)을 참조하세요.\n\n## 사용자 정의 프롬프트를 사용할 수 있나요?\n\n네! 컴파일러 구성에서 직접 번역 프롬프트를 사용자 정의할 수 있습니다:\n\n```ts\nconst compilerConfig = {\n sourceLocale: \"en\",\n targetLocales: [\"es\", \"fr\", \"de\"],\n prompt:\n \"당신은 기술 문서 전문 번역가입니다. 기술적 정확성을 유지하면서 {SOURCE_LOCALE}에서 {TARGET_LOCALE}로 번역하세요.\",\n};\n```\n\n사용자 정의 용어집의 경우, 프롬프트에 용어 정의를 포함하세요. 모범 사례는 [기본 프롬프트](https://github.com/lingodotdev/lingo.dev/blob/main/packages/compiler/src/lib/lcp/api/prompt.ts)를 참조하세요.\n\n## 더 많은 LLM 제공업체를 사용할 수 있나요?\n\n현재 Lingo.dev 컴파일러는 [GROQ](https://groq.com/)와 통합되어 있지만, 곧 더 많은 LLM 제공업체를 지원하고 싶습니다 ([저희와 대화하세요](https://lingo.dev/go/discord) 또는 [풀 리퀘스트를 보내주세요](https://github.com/lingodotdev/lingo.dev/)!).\n\n## CI/CD에서 GROQ API 키가 필요한가요?\n\n일반적으로 필요하지 않습니다. 로컬에서 앱을 빌드하면 모든 번역이 `lingo/` 디렉토리에 저장됩니다. CI/CD 빌드에서는 문자열을 번역하기 위해 LLM을 호출할 필요가 없습니다.\n\n대안으로 CI/CD에 `GROQ_API_KEY` 변수를 추가하고 빌드 시 모든 번역을 수행할 수 있지만, 최종 번역에 대한 더 많은 제어를 유지하기 위해 이 접근 방식을 권장하지 않습니다.\n\n## 번역을 편집할 수 있나요?\n\n네! `lingo/dictionary.js` 파일을 수동으로 편집할 수 있습니다. 이 파일은 모든 파일과 항목에 대한 번역이 포함된 객체를 내보냅니다. `content` 속성에서 각 로케일의 텍스트를 편집할 수 있습니다. React 컴포넌트의 소스 텍스트가 업데이트될 때까지 편집 내용이 유지됩니다.\n\n**JavaScript 객체 편집이 마음에 들지 않나요?** 곧 편집 경험을 개선하기 위한 에디터를 출시할 예정입니다. [관심이 있으시면 알려주세요!](https://lingo.dev/go/discord)\n\n## 전체 앱, 특정 파일 또는 언어를 어떻게 다시 번역할 수 있나요?\n\n전체 앱을 다시 번역하려면 `lingo/` 디렉토리에서 `dictionary.js` 파일을 삭제하세요.\n\n특정 파일만 다시 번역하려면 `dictionary.js`에서 해당 키(파일 이름)를 삭제할 수 있습니다.\n\n특정 로케일을 다시 번역하려면 해당 로케일에 대한 모든 레코드를 삭제해야 합니다.\n\n## 왜 앱을 로컬에서 빌드해야 하나요?\n\n로컬 빌드는 다음과 같은 방식으로 `lingo/` 번역 파일을 정규화합니다:\n\n- 사용되지 않는 번역 키 제거\n- 콘텐츠 지문 업데이트\n- 일관된 파일 형식 보장\n- 프로덕션 배포를 위한 최적화\n\n깨끗한 번역 파일을 유지하기 위해 변경사항을 커밋하기 전에 항상 `npm run build`를 실행하세요.\n\n## 번역이 누락되었습니다!\n\n번역이 누락된 경우:\n\n1. **로컬에서 빌드**하여 `lingo/` 파일을 정규화하세요:\n\n ```bash\n npm run build\n ```\n\n2. **API 키**가 올바르게 설정되었는지 확인하세요:\n\n ```bash\n # .env 파일에 다음이 포함되어 있는지 확인\n GROQ_API_KEY=gsk_...\n ```\n\n3. **업데이트된 파일을 커밋**하세요:\n\n ```bash\n git add lingo/\n git commit -m \"Update translations\"\n ```\n\n4. 변경 후 **개발 서버를 재시작**하세요.\n\n## 사용자 정의 용어집을 설정할 수 있나요?\n\n네! 컴파일러 구성에서 직접 용어와 용어집을 정의하기 위해 사용자 정의 프롬프트를 사용하세요:\n\n```ts\nconst compilerConfig = {\n sourceLocale: \"en\",\n targetLocales: [\"es\", \"fr\", \"de\"],\n prompt:\n \"You are a professional translator. Use these terms consistently: 'Dashboard' should be 'Tableau de bord' in French, 'Settings' should be 'Configuración' in Spanish. Translate from {SOURCE_LOCALE} to {TARGET_LOCALE}.\",\n};\n```\n\n## 컴파일러는 복수형을 어떻게 처리하나요?\n\n컴파일러는 기본적인 복수형 패턴을 자동으로 처리하지만, 복잡한 복수형 규칙의 경우 JSX를 적절히 구성해야 할 수 있습니다:\n\n```tsx\n// 컴파일러가 이를 적절히 처리합니다\n

{count === 1 ? <>1 item : <>{count} items}

\n```\n\n## 프로덕션 환경에서의 성능은 어떤가요?\n\n**Lingo.dev 컴파일러**는 프로덕션 환경에 최적화되어 있습니다:\n\n- **런타임 비용 제로** - 번역은 사전 컴파일됩니다\n- **번들 분할** - 활성화된 로케일만 로드됩니다\n- **트리 쉐이킹** - 사용되지 않는 번역은 제거됩니다\n- **CDN 친화적** - 정적 번역 파일이 효율적으로 캐싱됩니다\n\n## TypeScript와 함께 사용할 수 있나요?\n\n네! 컴파일러는 TypeScript 프로젝트와 원활하게 작동합니다. 제공된 모든 React 컴포넌트는 완전히 타입이 지정되어 있습니다:\n\n```tsx\nimport { LocaleSwitcher } from \"lingo.dev/react/client\";\n\n// 완전한 TypeScript 지원\nconst locales: string[] = [\"en\", \"es\", \"fr\"];\n;\n```\n\n## 버그를 보고하거나 기능을 요청하려면 어떻게 해야 하나요?\n\n- **GitHub 이슈**: [이슈 열기](https://github.com/lingodotdev/lingo.dev/issues)\n- **Discord 커뮤니티**: [Discord 참여하기](https://lingo.dev/go/discord)\n- **기능 요청**: 기능 제안을 위해 GitHub 토론을 사용하세요\n\n## 다음 단계\n\n- **시작하기**: [빠른 시작 가이드](../quick-start)\n- **프레임워크 통합**: [Next.js](../frameworks/nextjs-app-router), [React Router](../frameworks/react-router-v6), [Vite](../frameworks/vite-react-ts)\n- **고급 기능**: [구성 옵션](../configuration/advanced)\n","content","\n**Lingo.dev 컴파일러**에 관한 일반적인 질문과 답변입니다.\n\n## 문자열 리터럴을 번역할 수 있나요?\n\n**Lingo.dev 컴파일러**는 JSX 내의 모든 것이 현지화 가능하다는 규칙을 따릅니다. JSX 컴포넌트 외부의 문자열 리터럴은 설계상 현지화되지 않습니다.\n\n**현재 동작 방식:**\n\n```tsx\n// 이것은 번역되지 않습니다\nconst message = \"Hello world\";\nconst errorText = \"Something went wrong\";\n\n// 이것은 번역됩니다\nfunction Component() {\n return

Hello world

{message}

{count === 1 ? <>1 item : <>{count} items}

FAQ