Skip to content

JSON Translation

Replexica makes translating JSON files for frontend development a breeze.

Whether you're using React, Vue, Angular, or any other framework, Replexica's got you covered.

Setting Up

First, make sure you've got a i18n.json config file in your project root. Here's an example:

json
{
  "version": 1,
  "locale": {
    "source": "en",
    "targets": ["es", "fr", "de"]
  },
  "buckets": {
    "json": {
      "include": ["locales/[locale].json"]
    }
  }
}

This config tells Replexica:

  1. Your source language is English;
  2. You want to translate to Spanish, French, and German;
  3. Your JSON files are in the locales folder, named by locale (e.g., en.json, es.json).

Available Languages

Replexica supports a wide range of languages. To see what's available:

bash
npx replexica@latest show locale sources  # List available source languages
npx replexica@latest show locale targets  # List available target languages

Use these to pick the right locale codes for your project.

Translating

With your config set, run:

bash
npx replexica@latest i18n

Replexica will:

  1. Read your source JSON file (e.g., locales/en.json);
  2. Identify new or changed strings;
  3. Translate them to your target languages;
  4. Update or create the target JSON files (e.g., locales/es.json, locales/fr.json, locales/de.json).

Why This Works

Replexica's approach is effective because:

  1. It respects your existing file structure, fitting into your workflow instead of forcing you to change it;
  2. It uses AI to understand context, giving you more accurate translations than traditional word-for-word methods;
  3. It's incremental, only translating what's new or changed, saving time and processing power.

Pro Tips

  1. Nested Structures: Replexica handles nested JSON like a champ. Your complex i18n structures are safe.

    json
    {
      "nav": {
        "home": "Home",
        "about": {
          "team": "Our Team",
          "mission": "Our Mission"
        }
      }
    }
  2. Pluralization: Many i18n frameworks use special syntax for pluralization and placeholders. Replexica understands these:

    json
    {
      "items": {
        "one": "{{count}}  item",
        "other": "{{count}}  items"
      }
    }
  3. File Exclusions: You can exclude specific files from translation. This is useful for files that shouldn't be translated, for whatever reason:

    json
    {
      "buckets": {
        "json": {
          "include": ["locales/[locale]/*.json"],
          "exclude": ["locales/[locale]/my-file.json"]
        }
      }
    }

    This setup will translate all JSON files in the locales and config directories, except for files named my-file.json.

  4. Multiple File Types: You can configure multiple file types in your i18n.json:

    json
    {
      "buckets": {
        "json": {
          "include": ["locales/[locale].json"]
        },
        "markdown": {
          "include": ["docs/[locale]/*.md"]
        }
      }
    }

    This configuration allows Replexica to handle both JSON and Markdown files in your project.

By leveraging these features, you can maintain a robust, scalable i18n setup for your frontend project, regardless of the framework you're using. Replexica's flexibility in handling different file structures and types makes it a powerful tool for managing translations in complex projects.