i18n-automagic

A library to automatically translate React projects.

How it works

This library uses a combination of Babel and Transformers.js to extract text from your React components and translate them into different languages.

The core of the library is a CLI tool that scans your project for React components, extracts the text that needs to be translated, and then uses a pre-trained language model to translate the text into the languages you specify.

The library also provides a React hook useI18n and a provider I18nProvider to make it easy to use the translations in your React components.

Installation

To install the library, run the following command:

npm install i18n-automagic

Usage

To use the CLI tool, run the following command:

npx i18n-automagic --target=src --output=public/locales --languages=en,pt,es,fr

This will scan all the files in the src directory, extract the text that needs to be translated, and then create a set of JSON files in the public/locales directory, one for each language you specified.

To use the translations in your React components, you need to wrap your app in the I18nProvider component:

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import { I18nProvider } from 'i18n-automagic/react';

ReactDOM.render(
  <React.StrictMode>
    <I18nProvider>
      <App />
    </I18nProvider>
  </React.StrictMode>,
  document.getElementById('root')
);

Then, you can use the useI18n hook to get the translated text:

import React from 'react';
import { useI18n } from 'i18n-automagic/react';

function App() {
  const { t } = useI18n();

  return (
    <div>
      <h1>{t('Hello, world!)}</h1>
    </div>
  );
}

export default App;

Contributing

To contribute to the project, please follow these steps:

1. Fork the repository.
2. Create a new branch for your feature or bug fix.
3. Make your changes.
4. Test your changes.
5. Submit a pull request.

License

This project is licensed under the ISC License.