@intlayer/docs 5.8.0-canary.0 → 5.8.0

package/blog/ko/next-i18next_vs_next-intl_vs_intlayer.md

@@ -1,284 +1,162 @@
 ---
-createdAt: 2024-08-11
-updatedAt: 2025-06-29
+createdAt: 2025-08-23
+updatedAt: 2025-08-23
 title: next-i18next vs next-intl vs Intlayer
-description: Next.js 앱을 위해 next-i18next와 next-intl와 Intlayer를 비교하다
+description: Next.js 앱의 국제화(i18n)를 위해 next-i18next와 next-intl, Intlayer를 비교합니다
 keywords:
   - next-intl
   - next-i18next
   - Intlayer
   - 국제화
-  - 문서화
+  - 블로그
   - Next.js
-  - JavaScript
-  - React
+  - 자바스크립트
+  - 리액트
 slugs:
   - blog
   - next-i18next-vs-next-intl-vs-intlayer
 ---
 
-# next-i18next VS next-intl VS Intlayer | Next.js Internationalization (i18n)
+# next-i18next VS next-intl VS intlayer | Next.js 국제화(i18n)
 
-아래는 **Next.js 애플리케이션**을 국제화(i18n)하기 위한 **세 가지 인기 라이브러리**인 **next-intl**, **next-i18next**, 그리고 **Intlayer**의 간결한 비교입니다.
+이 가이드는 **Next.js**에서 널리 사용되는 세 가지 i18n 옵션인 **next-intl**, **next-i18next**, 그리고 **Intlayer**를 비교합니다.
+우리는 **Next.js 13+ App Router** (및 **React Server Components**)에 중점을 두고 다음 항목들을 평가합니다:
 
-이 문서는 주요 기준을 강조합니다:
+1. **아키텍처 및 콘텐츠 구성**
+2. **TypeScript 및 안정성**
+3. **누락된 번역 처리**
+4. **라우팅 및 미들웨어**
+5. **성능 및 로딩 동작**
+6. **개발자 경험(DX), 도구 및 유지보수**
+7. **SEO 및 대규모 프로젝트 확장성**
 
-1. **아키텍처** (번역을 구성 요소에 가깝게 유지)
-2. **TypeScript 지원**
-3. **누락된 번역 관리**
-4. **서버 구성 요소 지원**
-5. **Next.js에 대한 향상된 라우팅 및 미들웨어**
-6. **설정의 간단함**
-
-이 가이드는 또한 **Intlayer**에 대한 **심층 분석**을 제공하며, 특히 **App Router** 및 **Server Components**를 포함한 Next.js 13+에 대한 강력한 선택인 이유를 보여줍니다.
+> **요약**: 세 가지 모두 Next.js 앱을 현지화할 수 있습니다. 만약 **컴포넌트 범위 콘텐츠**, **엄격한 TypeScript 타입**, **빌드 타임 누락 키 검사**, **트리 쉐이킹된 사전**, 그리고 **최고급 App Router + SEO 도우미**를 원한다면, **Intlayer**가 가장 완전하고 현대적인 선택입니다.
 
 ---
 
-## 각 라이브러리 개요
-
-### 1. next-intl
+## 상위 수준 포지셔닝
 
-**주요 초점**: 경량화된 방식으로 빠르고 쉽게 설정할 수 있는 로컬화.
+- **next-intl** - 가볍고 직관적인 메시지 포맷팅을 제공하며 Next.js 지원이 탄탄합니다. 중앙 집중식 카탈로그가 일반적이며, 개발자 경험은 단순하지만 안정성과 대규모 유지보수는 주로 사용자의 책임입니다.
+- **next-i18next** - Next.js 환경에 맞춘 i18next입니다. 성숙한 생태계와 플러그인(예: ICU)을 통한 기능을 제공하지만, 설정이 장황할 수 있고 프로젝트가 커질수록 카탈로그가 중앙 집중화되는 경향이 있습니다.
+- **Intlayer** - Next.js를 위한 컴포넌트 중심 콘텐츠 모델로, **엄격한 TS 타입 지정**, **빌드 타임 검사**, **트리 쉐이킹**, **내장 미들웨어 및 SEO 도우미**, 선택적 **비주얼 에디터/CMS**, 그리고 **AI 지원 번역**을 제공합니다.
 
-- **아키텍처**: 번역을 하나의 폴더(예: `locales/`)에 함께 배치하도록 장려하지만 여러 전략도 허용합니다. “구성 요소별 번역” 아키텍처를 엄격히 강제하지는 않습니다.
-- **TypeScript 지원**: 기본 TypeScript 통합. 일부 타입 정의가 존재하지만, 번역 파일에서 TypeScript 정의를 자동 생성하는 데 중점을 두지 않습니다.
-- **누락된 번역**: 기본적인 폴백 메커니즘. 기본적으로 키 또는 기본 로케일 문자열로 폴백됩니다. 고급 누락된 번역 검사를 위한 강력한 도구는 제공되지 않습니다.
-- **서버 구성 요소 지원**: 일반적으로 Next.js 13+와 함께 작동하지만, 패턴이 깊은 서버측 사용(예: 복잡한 동적 라우팅을 가진 서버 구성 요소)에 덜 전문화되어 있습니다.
-- **라우팅 및 미들웨어**: 미들웨어 지원이 가능하지만 제한적입니다. 일반적으로 로케일 감지를 위해 Next.js `Middleware`에 의존하거나, 로케일 경로 재작성을 위해 수동 구성이 필요합니다.
-- **설정의 간단함**: 매우 직관적입니다. 최소한의 보일러플레이트가 필요합니다.
+---
 
-**사용 시기**: 더 간단한 접근 방식을 원하거나 번역을 보다 전통적인 방식(로케일 JSON 파일이 있는 하나의 폴더)으로 관리하는 데 편한 경우입니다.
+## 나란히 비교한 기능 비교 (Next.js 중심)
+
+| 기능                                                 | `next-intlayer` (Intlayer)                                                                                                          | `next-intl`                                                                              | `next-i18next`                                                                           |
+| ---------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------- |
+| **컴포넌트 근처 번역**                               | ✅ 예, 각 컴포넌트와 함께 콘텐츠가 배치됨                                                                                           | ❌ 아니요                                                                                | ❌ 아니요                                                                                |
+| **TypeScript 통합**                                  | ✅ 고급, 자동 생성된 엄격한 타입                                                                                                    | ✅ 우수                                                                                  | ⚠️ 기본                                                                                  |
+| **누락된 번역 감지**                                 | ✅ TypeScript 오류 하이라이트 및 빌드 시 오류/경고                                                                                  | ⚠️ 런타임 폴백                                                                           | ⚠️ 런타임 폴백                                                                           |
+| **리치 콘텐츠 (JSX/Markdown/컴포넌트)**              | ✅ 직접 지원                                                                                                                        | ❌ 리치 노드용으로 설계되지 않음                                                         | ⚠️ 제한적 지원                                                                           |
+| **AI 기반 번역**                                     | ✅ 예, 여러 AI 제공자를 지원합니다. 자체 API 키를 사용하여 사용할 수 있습니다. 애플리케이션 및 콘텐츠 범위의 컨텍스트를 고려합니다. | ❌ 아니요                                                                                | ❌ 아니요                                                                                |
+| **비주얼 에디터**                                    | ✅ 예, 로컬 비주얼 에디터 + 선택적 CMS; 코드베이스 콘텐츠를 외부화할 수 있으며, 임베드 가능                                         | ❌ 아니요 / 외부 현지화 플랫폼을 통해 사용 가능                                          | ❌ 아니요 / 외부 현지화 플랫폼을 통해 사용 가능                                          |
+| **로컬라이즈된 라우팅**                              | ✅ 예, 기본적으로 로컬라이즈된 경로를 지원합니다 (Next.js 및 Vite와 함께 작동)                                                      | ✅ 내장, App Router가 `[locale]` 세그먼트를 지원합니다                                   | ✅ 내장                                                                                  |
+| **동적 라우트 생성**                                 | ✅ 예                                                                                                                               | ✅ 예                                                                                    | ✅ 예                                                                                    |
+| **복수형 처리**                                      | ✅ 열거형 기반 패턴                                                                                                                 | ✅ 우수함                                                                                | ✅ 우수함                                                                                |
+| **형식 지정 (날짜, 숫자, 통화)**                     | ✅ 최적화된 포매터 (내부적으로 Intl 사용)                                                                                           | ✅ 우수함 (Intl 헬퍼)                                                                    | ✅ 우수함 (Intl 헬퍼)                                                                    |
+| **콘텐츠 형식**                                      | ✅ .tsx, .ts, .js, .json, .md, .txt, (.yaml 작업 중)                                                                                | ✅ .json, .js, .ts                                                                       | ⚠️ .json                                                                                 |
+| **ICU 지원**                                         | ⚠️ 작업 중                                                                                                                          | ✅ 예                                                                                    | ⚠️ 플러그인 통해 (`i18next-icu`)                                                         |
+| **SEO 도우미 (hreflang, 사이트맵)**                  | ✅ 내장 도구: 사이트맵, robots.txt, 메타데이터 도우미                                                                               | ✅ 우수                                                                                  | ✅ 우수                                                                                  |
+| **생태계 / 커뮤니티**                                | ⚠️ 규모는 작지만 빠르게 성장하고 반응성이 좋음                                                                                      | ✅ 중간 규모, Next.js 중심                                                               | ✅ 중간 규모, Next.js 중심                                                               |
+| **서버 사이드 렌더링 및 서버 컴포넌트**              | ✅ 예, SSR 및 React 서버 컴포넌트에 최적화됨                                                                                        | ⚠️ 페이지 단위로 지원되나 자식 서버 컴포넌트에 t-함수를 컴포넌트 트리를 통해 전달해야 함 | ⚠️ 페이지 단위로 지원되나 자식 서버 컴포넌트에 t-함수를 컴포넌트 트리를 통해 전달해야 함 |
+| **트리 쉐이킹 (사용된 콘텐츠만 로드)**               | ✅ 예, Babel/SWC 플러그인을 통한 빌드 시 컴포넌트별 적용                                                                            | ⚠️ 부분적 지원                                                                           | ⚠️ 부분적 지원                                                                           |
+| **지연 로딩 (Lazy loading)**                         | ✅ 예, 로케일별 / 사전별                                                                                                            | ✅ 예 (경로별/로케일별), 네임스페이스 관리 필요                                          | ✅ 예 (경로별/로케일별), 네임스페이스 관리 필요                                          |
+| **사용하지 않는 콘텐츠 정리 (Purge unused content)** | ✅ 예, 빌드 시 사전별                                                                                                               | ❌ 아니요, 네임스페이스 관리를 통해 수동으로 관리 가능                                   | ❌ 아니요, 네임스페이스 관리를 통해 수동으로 관리 가능                                   |
+| **대규모 프로젝트 관리**                             | ✅ 모듈화 권장, 디자인 시스템에 적합                                                                                                | ✅ 설정과 함께 모듈화                                                                    | ✅ 설정과 함께 모듈화                                                                    |
 
 ---
 
-### 2. next-i18next
+## 심층 비교
 
-**주요 초점**: `i18next`를 기반으로 하는 검증된 솔루션으로, Next.js 프로젝트에 널리 채택되었습니다.
+### 1) 아키텍처 및 확장성
 
-- **아키텍처**: 번역을 `public/locales` 폴더에 주로 정리합니다. 번역을 각각의 구성 요소에 “가까이” 유지하도록 특별히 설계되지는 않았지만, 다른 구조를 수동으로 채택할 수는 있습니다.
-- **TypeScript 지원**: 합리적인 TypeScript 커버리지지만, 타입이 지정된 번역 및 후크에 대해 사용자 정의 구성이 필요합니다.
-- **누락된 번역**: i18next는 보간/폴백을 제공합니다. 그러나 누락된 번역 감지는 일반적으로 추가 설정이나 서드파티 플러그인이 필요합니다.
-- **서버 구성 요소 지원**: Next.js 13과 함께 사용하는 기본적인 방법은 문서화되어 있지만, 고급 사용(예: 서버 구성 요소와의 깊은 통합, 동적 경로 생성)은 번거로울 수 있습니다.
-- **라우팅 및 미들웨어**: Next.js `Middleware`와 로케일 하위 경로 재작성에 크게 의존합니다. 더 복잡한 설정의 경우, 고급 i18next 구성을 들어가야 할 수 있습니다.
-- **설정의 간단함**: i18next에 익숙한 사람들에게는 친숙한 접근 방식입니다. 그러나 고급 i18n 기능이 필요할 때 보일러플레이트가 더 많이 발생할 수 있습니다(네임스페이스, 여러 대체 로케일 등).
+- **next-intl / next-i18next**: 기본적으로 로케일별 **중앙 집중식 카탈로그** (그리고 i18next의 **네임스페이스**)를 사용합니다. 초기에는 잘 작동하지만, 시간이 지남에 따라 결합도가 높아지고 키 변경이 빈번해지면서 큰 공유 영역이 되는 경우가 많습니다.
+- **Intlayer**: 코드와 함께 **컴포넌트별**(또는 기능별) 사전을 **같은 위치에 배치**하도록 권장합니다. 이는 인지 부하를 줄이고, UI 조각의 복제/이동을 용이하게 하며, 팀 간 충돌을 줄여줍니다. 사용하지 않는 콘텐츠는 자연스럽게 쉽게 발견되고 제거할 수 있습니다.
 
-**사용 시기**: 이미 `i18next` 생태계에 헌신했거나 기존의 i18next 기반 번역이 있는 경우입니다.
+**중요한 이유:** 대규모 코드베이스나 디자인 시스템 환경에서는 **모듈화된 콘텐츠**가 단일 카탈로그보다 더 잘 확장됩니다.
 
 ---
 
-### 3. Intlayer
-
-**주요 초점**: Next.js **App Router**(12, 13, 14, 15) 전용으로 특별히 설계된 현대적인 오픈 소스 i18n 라이브러리로, **Server Components** 및 **Turbopack**에 대한 기본 지원이 있습니다.
+### 2) TypeScript 및 안정성
 
-#### 주요 장점
+- **next-intl**: 견고한 TypeScript 지원을 제공하지만, **키가 기본적으로 엄격하게 타입 지정되지 않으므로** 안전성 패턴을 수동으로 유지해야 합니다.
+- **next-i18next**: 훅에 대한 기본 타입 정의를 제공하지만, **엄격한 키 타입 지정은 추가 도구/구성이 필요합니다**.
+- **Intlayer**: 콘텐츠에서 **엄격한 타입을 생성**합니다. **IDE 자동완성**과 **컴파일 타임 오류**가 배포 전에 오타와 누락된 키를 잡아냅니다.
 
-1. **아키텍처**
+**중요한 이유:** 강력한 타입 지정은 실패를 **오른쪽(런타임)**이 아닌 **왼쪽(CI/빌드)**으로 이동시킵니다.
 
-   - **번역을 구성 요소 바로 옆에 배치**하도록 장려합니다. 각 페이지나 구성 요소는 자체 `.content.ts` (또는 JSON) 파일을 가질 수 있어 거대한 번역 폴더를 뒤지는 일이 없습니다.
-   - 이는 특히 대규모 코드베이스에서 코드의 **모듈화 및 유지보수성**을 높여줍니다.
-
-2. **TypeScript 지원**
-
-   - **자동 생성된 타입 정의**: 콘텐츠를 정의하는 순간 Intlayer는 자동 완성 및 번역 오류 포착을 제공하는 타입을 생성합니다.
-   - 누락된 키와 같은 런타임 오류를 최소화하고 IDE에서 직접 고급 **자동 완성**을 제공합니다.
-
-3. **누락된 번역 관리**
+---
 
-   - 빌드 중에 Intlayer는 **누락된 번역 키를 감지**하고 경고 또는 오류를 발생시킬 수 있습니다.
-   - 이를 통해 모든 언어로 누락된 텍스트가 실수로 배포되는 일을 방지합니다.
+### 3) 누락된 번역 처리
 
-4. **서버 구성 요소에 최적화됨**
+- **next-intl / next-i18next**: **런타임 폴백**에 의존합니다(예: 키 또는 기본 로케일 표시). 빌드는 실패하지 않습니다.
+- **Intlayer**: 누락된 로케일이나 키에 대해 **빌드 타임 감지**와 **경고/오류**를 제공합니다.
 
-   - Next.js **App Router**와 새로운 **서버 구성 요소** 패러다임과 완전히 호환됩니다.
-   - **서버 컨텍스트를 격리**하기 위한 특수 제공자(`IntlayerServerProvider`, `IntlayerClientProvider`)를 제공합니다 (Next.js 13+에서 중요합니다).
+**중요한 이유:** 빌드 중에 누락을 잡으면 프로덕션에서 “미스터리 문자열”이 발생하는 것을 방지하고 엄격한 릴리스 게이트와 일치합니다.
 
-5. **향상된 라우팅 및 미들웨어**
+---
 
-   - 자동 로케일 감지를 위한 전용 [**`intlayerMiddleware`**](#)와 고급 경로 생성을 제공하여 간단한 설정으로 동적으로 로컬 경로를 처리합니다 (예: `/en-US/about` 대 `/fr/about`).
-   - 대체 언어 링크를 생성하기 위한 `getMultilingualUrls`와 같은 도우미 메서드를 제공합니다 (SEO에 유용합니다).
+### 4) 라우팅, 미들웨어 및 URL 전략
 
-6. **간소화된 설정**
-   - 로케일, 기본 로케일 및 통합 기본 설정을 정의하는 단일 구성 파일(`intlayer.config.ts`)이 필요합니다.
-   - 콘텐츠에 대한 모든 환경 변수와 감시를 **주입하는** 래퍼 플러그인 `withIntlayer(nextConfig)`이 필요합니다.
-   - **큰 폴백 구성 필요 없음**, 시스템이 최소한의 마찰로 “그냥 작동”하도록 설계되었습니다.
+- 세 가지 모두 App Router에서 **Next.js 지역화 라우팅**을 지원합니다.
+- **Intlayer**는 **i18n 미들웨어**(헤더/쿠키를 통한 로케일 감지)와 **로컬라이즈된 URL 및 `<link rel="alternate" hreflang="…">` 태그 생성을 위한 헬퍼**를 제공하여 한 단계 더 나아갑니다.
 
-> **결론**: Intlayer는 구성 요소 바로 옆에 번역을 유지하고, **강력한 TS 지원** 및 **쉬운 서버 측** 사용을 제공하며, **보일러플레이트를 크게 줄이는** 현대적인 솔루션입니다.
+**중요한 이유:** 커스텀 연결 계층이 줄어들고, **일관된 사용자 경험(UX)**과 **깔끔한 SEO**가 로케일 전반에 걸쳐 유지됩니다.
 
 ---
 
-## 기능 나란히 비교
-
-| **기능**                         | **next-intl**                           | **next-i18next**                        | **Intlayer**                       |
-| -------------------------------- | --------------------------------------- | --------------------------------------- | ---------------------------------- |
-| **번역을 구성 요소 근처에 유지** | 부분적 - 일반적으로 한 개의 로케일 폴더 | 기본값 아님 - 종종 `public/locales`     | **예 - 권장 및 간단**              |
-| **TypeScript 자동 생성**         | 기본 TS 정의                            | 기본 TS 지원                            | **예 - 고급 기능 제공**            |
-| **누락된 번역 감지**             | 대부분 폴백 문자열                      | 대부분 폴백 문자열                      | **예 - 빌드 시 검사**              |
-| **서버 구성 요소 지원**          | 작동하지만 전문화되지 않음              | 지원되지만 다소 번거로울 수 있음        | **전문 제공자를 통한 완전 지원**   |
-| **라우팅 및 미들웨어**           | Next 미들웨어와 수동 통합               | 재작성 구성을 통해 제공                 | **전용 i18n 미들웨어 + 고급 후크** |
-| **설정 복잡성**                  | 간단, 최소한의 구성                     | 전통적, 고급 사용 위해 번거로울 수 있음 | **하나의 구성 파일 및 플러그인**   |
-
----
+### 5) 서버 컴포넌트(RSC) 정렬
 
-## 왜 Intlayer인가?
+- **모두** Next.js 13+를 지원합니다.
+- **Intlayer**는 RSC를 위해 설계된 일관된 API와 프로바이더를 통해 **서버/클라이언트 경계**를 매끄럽게 처리하여, 포매터나 t-함수를 컴포넌트 트리를 통해 전달할 필요가 없습니다.
 
-**Next.js App Router**(버전 13, 14 또는 15)에서 **서버 구성 요소**를 이식하거나 구축하는 팀을 위해 Intlayer는 다음을 제공합니다:
+**중요한 이유:** 더 깔끔한 정신 모델과 하이브리드 트리에서 발생하는 예외 상황이 줄어듭니다.
 
-1. **세련된 아키텍처**
+---
 
-   - 각 경로 또는 구성 요소는 자신의 번역을 보유합니다. 이것은 명확성과 유지 보수성을 촉진합니다.
+### 6) 성능 및 로딩 동작
 
-2. **강력한 TypeScript 통합**
+- **next-intl / next-i18next**: **네임스페이스**와 **라우트 수준 분할**을 통해 부분적인 제어가 가능하지만, 규율이 느슨해지면 사용하지 않는 문자열이 번들에 포함될 위험이 있습니다.
+- **Intlayer**: 빌드 시 **트리 쉐이킹**을 수행하고, 사전/로케일별로 **지연 로딩**합니다. 사용하지 않는 콘텐츠는 포함되지 않습니다.
 
-   - 컴파일러 수준의 안전을 확보하여 “오타가 포함된” 번역 키를 피할 수 있습니다.
+**중요한 이유:** 특히 다국어 사이트에서 더 작은 번들 크기와 더 빠른 시작 속도를 제공합니다.
 
-3. **실제 누락된 번역 경고**
+---
 
-   - 키나 언어 번역을 잊으면 빌드 시 경고를 받게 되며(불완전한 UI를 배포하는 대신).
+### 7) 개발자 경험(DX), 도구 및 유지보수
 
-4. **내장된 고급 라우팅**
+- **next-intl / next-i18next**: 일반적으로 번역 및 편집 워크플로우를 위해 외부 플랫폼과 연동해야 합니다.
+- **Intlayer**: **무료 비주얼 에디터**와 **선택적 CMS**(Git 친화적이거나 외부화 가능)를 제공합니다. 또한 콘텐츠 작성용 **VSCode 확장**과 자체 제공자 키를 사용하는 **AI 지원 번역** 기능도 포함되어 있습니다.
 
-   - 자동 로케일 감지, 동적 경로 생성 및 간단한 지역화된 URL 관리를 제공합니다.
-   - 표준 `intlayerMiddleware`는 깊은 사용자 지정 재작성이 필요하지 않습니다.
+**중요한 이유:** 운영 비용을 낮추고 개발자와 콘텐츠 작성자 간의 피드백 루프를 단축합니다.
 
-5. **원스톱 설정**
+---
 
-   - 최소한의 보일러플레이트: `intlayer.config.ts`를 정의하고 `next.config`를 `withIntlayer`로 래핑한 다음 공식 미들웨어를 추가하기만 하면 됩니다.
-   - `IntlayerServerProvider`와 `IntlayerClientProvider`를 통해 **서버** 및 **클라이언트** 구성 요소에 대해 명확하고 직관적인 사용법을 제공합니다.
+## 언제 어떤 것을 선택해야 할까요?
 
-6. **SEO 친화적**
-   - 내장 도우미(`getMultilingualUrls`, `hrefLang` 속성 등)를 통해 SEO 준수 페이지 및 사이트맵을 쉽게 생성할 수 있습니다.
+- **next-intl**를 선택하세요, 만약 **최소한의** 솔루션을 원하고, 중앙 집중식 카탈로그에 익숙하며, 앱이 **작거나 중간 규모**인 경우.
+- **next-i18next**를 선택하세요, 만약 **i18next의 플러그인 생태계**(예: 플러그인을 통한 고급 ICU 규칙)가 필요하고, 팀이 이미 i18next를 알고 있으며, 유연성을 위해 **더 많은 설정**을 감수할 수 있는 경우.
+- **Intlayer**를 선택하세요, 만약 **컴포넌트 범위의 콘텐츠**, **엄격한 TypeScript**, **빌드 타임 보장**, **트리 쉐이킹**, 그리고 **내장된 라우팅/SEO/에디터 도구**를 중요하게 생각한다면 - 특히 **Next.js App Router**와 **대규모 모듈식 코드베이스**에 적합합니다.
 
 ---
 
-## 예시: Intlayer 작동 방식
-
-다음은 Next.js 15 프로젝트에서 Intlayer를 활용하는 방법을 간단히 보여주는 _아주_ 축약된 코드 스니펫입니다. 전체 세부 정보 및 코드 예제는 [전체 Intlayer 가이드를 확인하세요](#).
-
-<details>
-<summary>단계별 예시</summary>
-
-1. **설치 및 구성**
-
-   ```bash
-   npm install intlayer next-intlayer
-   ```
-
-   ```ts
-   // intlayer.config.ts
-   import { Locales, type IntlayerConfig } from "intlayer";
-
-   const config: IntlayerConfig = {
-     internationalization: {
-       locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
-       defaultLocale: Locales.ENGLISH,
-     },
-   };
-   export default config;
-   ```
-
-2. **플러그인 사용**
-
-   ```ts
-   // next.config.mjs
-   import { withIntlayer } from "next-intlayer/server";
-
-   /** @type {import('next').NextConfig} */
-   const nextConfig = {};
-
-   export default withIntlayer(nextConfig);
-   ```
-
-3. **미들웨어 추가**
-
-   ```ts
-   // src/middleware.ts
-   export { intlayerMiddleware as middleware } from "next-intlayer/middleware";
-
-   export const config = {
-     matcher:
-       "/((?!api|static|assets|robots|sitemap|sw|service-worker|manifest|.*\\..*|_next).*)",
-   };
-   ```
-
-4. **지역화된 레이아웃 생성**
-
-   ```tsx
-   // src/app/[locale]/layout.tsx
-   import { getHTMLTextDir } from "intlayer";
-   import { NextLayoutIntlayer } from "next-intlayer";
-
-   const LocaleLayout: NextLayoutIntlayer = async ({ children, params }) => {
-     const { locale } = params;
-     return (
-       <html lang={locale} dir={getHTMLTextDir(locale)}>
-         <body>{children}</body>
-       </html>
-     );
-   };
-
-   export { generateStaticParams } from "next-intlayer";
-   export default LocaleLayout;
-   ```
-
-5. **콘텐츠 선언 및 사용**
-
-   ```tsx
-   // src/app/[locale]/page.content.ts
-   import { t } from "intlayer";
-
-   export default {
-     key: "page",
-     content: {
-       getStarted: {
-         main: t({
-           en: "Get started by editing",
-           fr: "Commencez par éditer",
-           es: "Comience por editar",
-         }),
-         pageLink: "src/app/page.tsx",
-       },
-     },
-   };
-   ```
-
-   ```tsx
-   // src/app/[locale]/page.tsx
-   import { IntlayerServerProvider } from "next-intlayer/server";
-   import { IntlayerClientProvider, useIntlayer } from "next-intlayer";
-
-   const PageContent = () => {
-     const { content } = useIntlayer("page");
-     return (
-       <>
-         <p>{content.getStarted.main}</p>
-         <code>{content.getStarted.pageLink}</code>
-       </>
-     );
-   };
-
-   export default function Page({ params }) {
-     return (
-       <IntlayerServerProvider locale={params.locale}>
-         <IntlayerClientProvider locale={params.locale}>
-           <PageContent />
-         </IntlayerClientProvider>
-       </IntlayerServerProvider>
-     );
-   }
-   ```
-
-   </details>
+## 실용적인 마이그레이션 노트 (next-intl / next-i18next → Intlayer)
+
+- **기능별로 시작하기**: 한 번에 하나의 라우트나 컴포넌트를 **로컬 사전**으로 옮기세요.
+- **기존 카탈로그 병행 유지**: 마이그레이션 중에 다리를 놓듯 사용하세요; 한꺼번에 전환하는 것은 피하세요.
+- **엄격한 검사 활성화**: 빌드 타임에 누락된 부분을 조기에 발견할 수 있게 하세요.
+- **미들웨어 및 헬퍼 도입**: 사이트 전반에 걸쳐 로케일 감지와 SEO 태그를 표준화하세요.
+- **번들 크기 측정**: 사용하지 않는 콘텐츠가 제거되면서 **번들 크기 감소**를 기대하세요.
 
 ---
 
 ## 결론
 
-각 솔루션, **next-intl**, **next-i18next**, 및 **Intlayer**, 은 다국어 Next.js 프로젝트에 효과적입니다. 그러나 **Intlayer**는 다음과 같은 점에서 한 걸음 더 나아갑니다:
+세 라이브러리 모두 핵심 로컬라이제이션에서는 성공적입니다. 차이점은 **현대적인 Next.js 환경에서 견고하고 확장 가능한 설정을 위해 얼마나 많은 작업을 해야 하는가**에 있습니다:
 
-- **구성 요소 수준의 번역 아키텍처 강력 추천**
-- **Next.js 13+ 및 서버 구성 요소와 원활하게 통합**
-- **안전한 코드 작성을 위한 강력한 TypeScript 자동 생성 제공**
-- **누락된 번역을 빌드 시에 처리**
-- **고급 라우팅 및 미들웨어와 함께 단일 구성 접근 방식을 제공**
+- **Intlayer**를 사용하면, **모듈화된 콘텐츠**, **엄격한 TS(타입스크립트)**, **빌드 타임 안전성**, **트리 쉐이킹된 번들**, 그리고 **최고급 App Router 및 SEO 도구**가 **기본값**으로 제공되며, 번거로운 작업이 아닙니다.
+- 다국어, 컴포넌트 기반 앱에서 **유지보수성과 속도**를 중요시하는 팀이라면, Intlayer가 오늘날 가장 **완벽한** 경험을 제공합니다.
 
-**Next.js App Router**에 맞춰 현대적인 i18n 기능을 원하고 수동으로 폴백 논리, 경로 재작성 또는 복잡한 빌드 단계를 구성하지 않고도 완전한 타입 경험을 원한다면, **Intlayer**는 매력적인 선택입니다. 이는 설정 시간을 단축시킬 뿐만 아니라, 팀을 위한 번역의 유지 보수성과 확장성을 더욱 높여 줍니다.
+자세한 내용은 ['Why Intlayer?' 문서](https://intlayer.org/doc/why)를 참조하세요.