Welcome to i18n-keyless

Install i18n-keyless in less than 5 minutes.

Get an API key by visiting https://i18n-keyless.com/#get-api-key

Using an AI assistant?

The whole documentation is also available as a single Markdown file at /llms.txt — paste it into Claude / ChatGPT / Cursor / etc. to give your assistant full context on i18n-keyless.

Getting Started

i18n-keyless is a JavaScript library that works across different environments. Choose your platform below to see the specific setup instructions:

React

Storage is required to cache translations.

window.localStorage

You'll need to install the required dependency:

npm install i18n-keyless-react

import * as I18nKeyless from "i18n-keyless-react";

I18nKeyless.init({
  API_KEY: "YOUR_API_KEY",
  storage: window.localStorage, // or whatever has get/set/del methods, check the codebase below
  languages: {
    primary: "fr",
    supported: ["en", "fr"],
  },
});

IndexedDB (idb-keyval)

You'll need to install the required dependency:

npm install i18n-keyless-react idb-keyval

import * as I18nKeyless from "i18n-keyless-react";
import { get, set, del } from 'idb-keyval';

// Create storage adapter for idb-keyval
const indexedDBStorage = {
  getItem: async (key) => {
    const value = await get(key);
    return value || null;
  },
  setItem: async (key, value) => {
    await set(key, value);
  },
  removeItem: async (key) => {
    await del(key);
  }
};

I18nKeyless.init({
  API_KEY: "YOUR_API_KEY",
  storage: indexedDBStorage,
  languages: {
    primary: "fr",
    supported: ["en", "fr"],
  },
});

You can check here for the methods that your storage item needs to have

React Native

Storage is required to cache translations.

MMKV

You'll need to install the required dependency:

npx expo install i18n-keyless-react react-native-mmkv
npx expo prebuild

import * as I18nKeyless from "i18n-keyless-react";
import { MMKV } from 'react-native-mmkv'

const storage = new MMKV()

I18nKeyless.init({
  API_KEY: "YOUR_API_KEY",
  storage: storage,
  languages: {
    primary: "fr",
    supported: ["en", "fr"],
  },
});

AsyncStorage

You'll need to install the required dependency:

npx expo install i18n-keyless-react @react-native-async-storage/async-storage
npx expo prebuild

import * as I18nKeyless from "i18n-keyless-react";
import AsyncStorage from "@react-native-async-storage/async-storage";

I18nKeyless.init({
  API_KEY: "YOUR_API_KEY",
  storage: AsyncStorage,
  languages: {
    primary: "fr",
    supported: ["en", "fr"],
  },
});

Node.js

You'll need to install the required dependency:

npm install i18n-keyless-node

import * as I18nKeyless from "i18n-keyless-node";

I18nKeyless.init({
  API_KEY: "YOUR_API_KEY",
  languages: {
    primary: "fr",
    supported: ["en", "fr"],
  },
});

Usage

Once you've initialized i18n-keyless for your platform, you can start translating text immediately:

React

import { I18nKeyless, getTranslation } from "i18n-keyless-react";
import { TabBar, Tab } from "whatever-tab-bar-system";

// Two ways to display text: `I18nKeyless` component / `getTranslation` function

// `I18nKeyless` component
function Header() {
  return (
    <h1><I18nKeyless>Bonjour le monde</I18nKeyless></h1>
  );
}

// `getTranslation` function
function MyTabs() {
  return (
    <TabBar>
      <Tab label={getTranslation("Premier onglet")} />
      <Tab label={getTranslation("Deuxième onglet")} />
    </TabBar>
  );
}

React Native

import { I18nKeyless, getTranslation } from "i18n-keyless-react";
import { TabBar, Tab } from "whatever-tab-bar-system";
import { Text } from "react-native";

// Two ways to display text: `I18nKeyless` component / `getTranslation` function

// `I18nKeyless` component
function Header() {
  return (
    <Text><I18nKeyless>Bonjour le monde</I18nKeyless></Text>
  );
}

// `getTranslation` function
function MyTabs() {
  return (
    <TabBar>
      <Tab label={getTranslation("Premier onglet")} />
      <Tab label={getTranslation("Deuxième onglet")} />
    </TabBar>
  );
}

Node.js

warning

awaitForTranslation NEED to be awaited, to prevent 429 to happen.

import { awaitForTranslation, type Lang } from 'i18n-keyless-node';

async function sendNotificationsToUsers() {
  const users = await fetchUsers()
  
  for (const user of users) {
    const notification = {
      title: await awaitForTranslation("Viens voir l'application", user.lang as Lang);
      body: await awaitForTranslation("Il y a des supers choses !", user.lang as Lang);
    }
  }
}