What file formats does i18n Agent support?

i18n Agent supports 9+ file formats including JSON, YAML, CSV, XML, Markdown, Properties, and more. The service preserves structure and formatting automatically.

How much does i18n Agent cost?

i18n Agent costs €0.01 per word, which is significantly more affordable than traditional translation services that typically charge €0.15-0.25 per word.

What is MCP integration?

MCP (Model Context Protocol) integration allows i18n Agent to work directly with AI development tools like Claude Code, Cursor, and other AI-powered development environments for seamless translation workflows.

What is Next.js i18n and how does it work?

Next.js i18n (internationalization) uses locale-based routing with the App Router. Each locale gets its own URL prefix (e.g., /en/about, /de/about). Middleware detects the user's locale, and components access translations via hooks.

Should I use next-intl or next-i18next for Next.js?

For the App Router, next-intl is the recommended choice. It's designed specifically for the App Router's server component model. next-i18next was built for the Pages Router and has limited App Router support.

How does i18n work with the Next.js App Router?

With the App Router, use [locale] dynamic route segments. Middleware detects the user's locale and redirects. Server components use getTranslations, client components use useTranslations.

How do I automate translations in Next.js?

Install the i18n Agent MCP server in your IDE. Ask your AI assistant to translate your message files in the messages/ directory. The translated JSON files are written directly to your project.

Is AI translation reliable for Next.js apps?

Yes. For UI strings, navigation labels, and form content, AI translation produces production-ready results. i18n Agent preserves all next-intl structure including nested keys, ICU plurals, and interpolation variables.

The Complete Guide to Next.js Internationalization

Name: i18n Agent
Price: 0.01 EUR
Rating: 4.8 (127 reviews)
Author: i18n Agent

Set up next-intl with the App Router, configure locale routing, and automate translations with AI.

marketing.seo.nextjsI18n.guide.installTitle

marketing.seo.nextjsI18n.guide.installDescription

Terminal

npm install next-intl

2. Configure Middleware for Locale Routing

Add middleware to handle locale detection and routing.

middleware.ts

import createMiddleware from 'next-intl/middleware';

export default createMiddleware({
  locales: ['en', 'de', 'ja', 'es'],
  defaultLocale: 'en'
});

export const config = {
  matcher: ['/((?!api|_next|.*\\..*).*)']
};

3. Set Up Message Files

Create JSON message files per locale and configure the i18n request handler.

messages/en.json

// messages/en.json
{
  "HomePage": {
    "title": "Welcome to our app",
    "description": "Build multilingual Next.js apps with ease"
  },
  "Navigation": {
    "home": "Home",
    "about": "About",
    "contact": "Contact"
  }
}

4. Update Your Layout

Pass locale and messages to NextIntlClientProvider in your root layout.

app/[locale]/layout.tsx

import { NextIntlClientProvider } from 'next-intl';
import { getMessages } from 'next-intl/server';

export default async function LocaleLayout({
  children,
  params
}: {
  children: React.ReactNode;
  params: { locale: string };
}) {
  const messages = await getMessages();

  return (
    <html lang={params.locale}>
      <body>
        <NextIntlClientProvider
          locale={params.locale}
          messages={messages}
        >
          {children}
        </NextIntlClientProvider>
      </body>
    </html>
  );
}

5. Use Translations in Components

Use useTranslations in client components and getTranslations in server components.

app/[locale]/page.tsx

// Client Component
'use client';
import { useTranslations } from 'next-intl';

export default function HomePage() {
  const t = useTranslations('HomePage');
  return <h1>{t('title')}</h1>;
}

// Server Component
import { getTranslations } from 'next-intl/server';

export default async function AboutPage() {
  const t = await getTranslations('AboutPage');
  return <h1>{t('title')}</h1>;
}

6. Automate with i18n Agent

With your i18n setup complete, automate translation of your message files directly from your IDE.

Terminal

# In your IDE, ask your AI assistant:
> Translate messages/en.json to German, Japanese, and Spanish

✓ messages/de.json created (1.1s)
✓ messages/ja.json created (1.4s)
✓ messages/es.json created (1.0s)