Jump to main content

Scan translations

Create account

🚀 Automate and optimize your translations.

To make the most of Translate Projects, you need an API Key. Sign up with no obligation.

  • We do not ask for a credit card to try Translate Projects.

Benefits of obtaining your API Key

  • Smart Management: Sync and automatically manage the translations of your projects.
  • Exclusive Administrative Panel: Customize and oversee all your translations from a centralized interface.
  • Priority Support: Receive quick and specialized technical assistance when you need it.
  • Accurate Translations: Our technology understands the context of your code to provide accurate translations.
  • 30,000 Welcome Eniacs: Test all the features without obligation with internal tokens that enhance your translations.

Sign up now and get your API Key to unlock the full potential of Translate Projects!

Create account now→

We will create a file translate.js in the utils folder and add the following code:

utils/translate.js
import { translateProject } from 'translate-projects-react';

translateProject({
sourceLang: 'es', // Default language
targetLangs: ['en'], // Languages to translate
apiKey: '#', //Your API key
scanner: true // We enabled the scanner.
});

Set up command for npm

Add the following command in your package.json file:

package.json
"scripts": {
"translate": "node ./utils/translate.js"
}

To avoid an error in loading the modules, go to your package.json and add the type as module.

package.json
{
...Your settings,
"type": "module",
}

We execute the command for our translations to be carried out.

Terminal
npm run translate

Import i18n file

What do we scan?

We will obtain all the texts from your project that are found in the following use cases.

  • those who are within the Trans label

    src/App.tsx
    import { Trans } from 'react-i18next';

    function App() {
    return (
    <div>
    <header>
    <Trans>Hola Este es un ejemplo de traduccion</Trans>
    </header>
    </div>
    );
    }
  • Also the texts that are within our hook t.

    src/App.tsx
    import { useTranslation } from '@/hooks/useTranslation'; We import our hook.

    function App() {
    const { t } = useTranslation();
    return (
    <div>
    <header>
    {t('Hola Este es un ejemplo de traduccion base')}
    </header>
    </div>
    );
    }

    export default App;