새로운 소식
    출시 v8.11.3

    컴포넌트별 i18n

    타입 안전. AI로 번역. 시각적으로 편집.

    개발 속도를 높이기 위해 컴포넌트 옆에 번역을 정의하세요. 번들을 적절히 가볍게 유지하세요. 에디터를 CMS를 통해 초대하세요. 모든 기여에 진심으로 감사드립니다.

    npm install intlayer

    사용 가능

    // src/component/server/component.content.tsimport { t, type Dictionary } from "intlayer";const componentContent = {  key: "server-component",  content: {    title: t({      en: "Title of my component",      fr: "Titre de mon component",      es: "Título de mi componente",    }),    content:      "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",  },} satisfies Dictionary;export default componentContent;
    // src/components/Component.tsxexport const Component = () => {  return (    <div>      <h2>Intlayer Compiler</h2>      <p>        The Intlayer Compiler extracts automatically the content from the        components and generates the dictionary files.      </p>    </div>  );};
    플레이그라운드를 사용하여 무료로 시도하세요.플레이그라운드로 이동
    intlayer test
    $ npx intlayer test
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    ~/Desktop/MyApp

    콘텐츠 정의를 구성 요소 가까이에 유지하여 코드 유지 관리를 개선하세요. 중복을 줄이고 명확성을 향상시키며 구조화된 접근 방식을 사용하여 업데이트를 단순화하여 코드 관리 및 확장을 용이하게 합니다.

    Intlayer Compiler로 즉시 콘텐츠를 추출하세요. 콘텐츠의 국제화를 위한 필수 사전 파일을 자동으로 생성하여 애플리케이션을 순식간에 다국어로 전환합니다.

    무료 비주얼 편집기를 활용하여 사이트를 손쉽게 구축하고 관리하세요. 코드를 만지지 않고도 구성 요소와 페이지를 만들고, 편집하고, 구성할 수 있어 콘텐츠 관리자와 개발자가 효율적으로 협업할 수 있습니다.

    내장된 번역 지원을 통해 도달 범위를 넓히세요. 직관적인 인터페이스를 사용하여 콘텐츠를 손쉽게 번역하고, 여러 콘텐츠 버전을 수동으로 관리할 필요 없이 사용자에게 원활한 다국어 경험을 제공합니다.

    Intlayer CLI와 AI를 사용하여 콘텐츠를 테스트하고 자동으로 채워 모든 번역이 완전하고 정확한지 확인하세요.

    Intlayer를 선택하는 이유는 무엇입니까?

    무료 및 오픈 소스

    Intlayer는 무료이자 오픈소스이며, 무료로 사용하고 필요한 대로 기여할 수 있습니다.

    JavaScript 기반의 콘텐츠 관리

    JavaScript의 유연성을 활용하여 콘텐츠를 효율적으로 정의하고 관리하십시오.

    타입 안전한 환경

    TypeScript를 활용하여 모든 콘텐츠 정의가 정확하고 오류가 없도록 합니다.

    구성 요소 수준에서의 선언

    번역을 각 구성 요소의 가까운 곳에 두어 유지 관리성과 명확성을 향상시킵니다.

    단순화된 설정

    최소한의 구성으로 빠르게 시작하고 운영하십시오. 특히 Next.js 프로젝트에 최적화되어 있습니다.

    통합된 CMS

    웹사이트에서 직접 통합된 CMS로 콘텐츠를 편집하세요. AI 덕분에 콘텐츠 생성을 향상시키십시오.

    기술

    동적 JSON 로드

    런타임에 번역을 지연 로드합니다

    범위가 지정된 JSON (네임스페이싱)

    페이지별 번역 네임스페이스

    I18n 성능 벤치마크

    데이터 없음

    이 측정항목은 무엇인가요?

    국제화 라이브러리 번들의 총 gzip 압축 크기입니다. 여기에는 트리 쉐이킹 및 미니피케이션 후의 프로바이더 및 콘텐츠 검색 로직만 포함됩니다.

    왜 중요한가요?

    라이브러리 크기가 작으면 초기 JavaScript 페이로드가 줄어들어 클라이언트에서 다운로드 및 실행 시간이 빨라집니다.

    보기 형식

    웹사이트의 글로벌 로컬라이제이션 점수를 분석하세요

    웹사이트의 현지화 품질을 빠르고 무료로 평가하세요. 웹사이트의 주요 다국어 요소를 분석하여 종합 점수와 도달 범위 향상에 도움이 되는 실행 가능한 인사이트를 무료로 얻으세요.

    코드 기반 i18n

    리포지토리에 있는 타입 안전한 번역.

    TypeScript 또는 JavaScript에서 구성 요소와 함께 콘텐츠를 선언하세요. Intlayer는 타입을 자동으로 생성하여 자동 완성, 유효성 검사 및 즉각적인 피드백을 제공합니다. 더 이상 키 누락이나 문맥 전환이 없습니다.

    AI CLI Tool

    터미널에서 번역을 자동화하세요.

    AI로 JSON 및 Markdown을 감사, 채우기 및 번역하는 CLI.

    `npx intlayer fill`을 실행하여 누락된 키를 감지하고 OpenAI, Claude 또는 로컬 모델을 사용하여 번역을 생성하세요. Git 기록을 깨끗하게 유지하고 타입을 안전하게 보호하세요.

    Intlayer TMS

    단어당 비용 지불을 중단하세요. AI로 자동화하세요.

    Crowdin 및 Lokalise의 오픈소스 대안. 현대적인 개발자 워크플로우를 위해 구축되었습니다.

    코드 또는 시각적 편집기에서 직접 번역을 관리하세요. AI를 활용하여 즉시 번역하세요. 좌석 제한 없이 팀과 협업하세요.

    헤드리스 CMS

    로컬 코드와 원격 콘텐츠를 연결하세요.

    오버헤드 없이 다국어 콘텐츠를 관리하세요. Intlayer는 로컬 사전과 원격 관리를 상호 연결하여 재구축 없이 핫 업데이트를 위한 Live Sync를 지원합니다. CI/CD를 위한 웹훅을 사용하고 기능 플래그를 관리하세요.

    기능 플래그

    기능을 즉시 전환하세요. 배포가 필요 없습니다.

    Intlayer 사전은 단순한 텍스트 이상입니다. 로직, 스타일 및 구성 객체를 선언하는 데 사용하세요. Live Sync를 사용하면 CMS에서 직접 실시간으로 기능을 켜거나 끄고, UI 테마를 변경하며, 앱 동작을 업데이트할 수 있습니다.

    A/B 테스트

    제품 실험을 위한 플레이그라운드.

    Intlayer의 새로운 AI 기반 A/B 테스트 베타를 가장 먼저 탐험해보세요. 발견 가능성을 높이고 더 스마트한 제품 결정을 안내하도록 구축되었습니다. 카피와 디자인부터 전체 기능까지 실시간으로 무엇이든 테스트하고, 데이터가 진정으로 작동하는 것을 보여주도록 하세요.

    사용 가능

    라이브 데모를 사용해 보세요

    커뮤니티에 의해 구축됨

    Intlayer를 가능하게 하는 놀라운 기여자들을 만나보세요

    자주 묻는 질문

    국제화(i18n)란 무엇입니까?

    국제화(i18n)는 Next.js, React 또는 Express와 같은 응용 프로그램을 설계하고 개발하여 여러 언어를 쉽게 지원하는 과정입니다. 이는 번역 프로세스를 단순화하여 다국어 웹사이트를 생성할 수 있도록 합니다. TypeScript와 같은 도구는 i18n을 구현하기 쉽게 하여 애플리케이션을 다양한 언어와 지역에 효율적이고 쉽게 적응할 수 있도록 합니다.i18n에 대해 더 읽어보세요

    Intlayer의 주요 기능은 무엇입니까?

    Intlayer는 구성 관리를 간소화하고 서버 구성 요소를 포함한 다양한 유형의 JavaScript 애플리케이션에 대한 국제화를 가능하게 합니다. 구성 요소와 나란히 콘텐츠 선언을 허용하여 코드베이스의 유지관리를 개선합니다. 또한 Intlayer는 TypeScript를 활용하여 누락된 선언을 방지합니다. 마지막으로 Intlayer는 비개발자가 웹사이트 콘텐츠를 편집하고 AI를 사용하여 자동으로 번역하며 애플리케이션의 SEO를 최적화할 수 있게 하는 비주얼 편집기를 제공합니다.Intlayer의 기능에 대해 더 읽어보세요

    Intlayer에 비주얼 편집기가 있습니까?

    예, Intlayer는 코드에 다이빙하지 않고 콘텐츠를 쉽게 관리할 수 있는 선택적 비주얼 편집기를 제공합니다.비주얼 편집기에 대해 더 읽어보세요

    Intlayer를 사용하는 비용은 얼마입니까?

    Intlayer는 무료 NPM 패키지와 시각적 편집기를 통합합니다. 또한, 콘텐츠 외부화를 위한 CMS를 제공합니다. 이 CMS는 무료로 사용할 수 있지만, 프리미엄 및 엔터프라이즈 플랜 멤버를 위한 추가 기능이 포함되어 있습니다.Intlayer 계획에 대해 더 읽어보세요

    기존 솔루션 위에 Intlayer를 통합할 수 있습니까?

    예, Intlayer는 i18next, next-intl, vue-i18next 등을 래퍼로 통합할 수 있습니다. 이를 통해 번역을 자동화하고 기존 코드를 리팩토링하지 않고 Intlayer를 사용할 수 있습니다.

    Intlayer란 무엇입니까?

    Intlayer는 다국어 웹사이트를 관리할 수 있도록 하는 패키지입니다. 다국어 콘텐츠와 현지화를 위한 웹사이트 설정을 쉽게 할 수 있도록 도와주는 도구 및 유틸리티 세트를 제공합니다.Intlayer에 대해 더 읽어보세요

    Intlayer는 Next.js와 어떻게 통합됩니까?

    Intlayer는 서버 사이드 렌더링 및 정적 사이트 생성을 가능하게 하여 다국어 콘텐츠 제공을 보다 효율적으로 통합합니다.Next.js 통합에 대해 더 읽어보세요

    Intlayer에 어떻게 기여할 수 있습니까?

    Pull requests를 제출하거나 GitHub 리포지토리에서 문제를 보고함으로써 기여할 수 있습니다.기여하는 방법에 대해 더 읽어보세요

    Intlayer는 어떤 플랫폼을 지원합니까?

    Intlayer는 React(React 앱 생성 포함), Vite를 사용하는 React, Next.js, Tanstack Start, Vue, Nuxt, Express, NestJS, Preact 등에서 사용할 수 있습니다. 이를 통해 최신 JavaScript 프레임워크 및 서버 측 환경과의 원활한 통합을 보장합니다.지원되는 플랫폼에 대해 더 읽어보세요
    모든 자주 묻는 질문 읽기