@tolgee/react

React implementation for tolgee localization framework

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
@tolgee/react
165334.9.220 days ago2 years agoMinified + gzip package size for @tolgee/react in KB

Readme

test workflow @tolgee/react version types typescript licence twitter github stars
Tolgee for React
React integration library of Tolgee. For more information about using Tolgee with React, visit our documentation website 📖.
Tolgee
Lokalize (translate) your CRA, Gatsby, Next.js or other React projects to multiple languages with Tolgee. Integration of Tolgee is extremely simple! 🇯🇵 🇰🇷 🇩🇪 🇨🇳 🇺🇸 🇫🇷 🇪🇸 🇮🇹 🇷🇺 🇬🇧

Features

  • All in One localization solution for your JS application 🙌
  • Out of box in-context localization 🎉
  • Automated screenshot generation 📷
  • Translation management platform 🎈
  • Open-source 🔥

Installation

First, install the package.
npm install @tolgee/react
Then use the library in your app:
```typescript jsx import { TolgeeProvider } from "@tolgee/react";
...
APPTOLGEEAPIURL} apiKey={process.env.REACTAPPTOLGEEAPIKEY}
## Usage

![react-infinite](https://user-images.githubusercontent.com/18496315/137308502-844f5ccf-1895-414d-bf40-6707cb691853.gif)

To translate texts using Tolgee React integration, you can use `T` component or `useTranslate` hook.

### T component

```typescript jsx
import { T } from "@tolgee/react";

...

<T>translation_key</T>

or
```typescript jsx Default value
### useTranslate hook

```javascript
import { useTranslate } from "@tolgee/react";

...

const t = useTranslate();

...

t("key_to_translate")

Prerequisites

  1. You have some React based project
  2. You have generated API key from Tolgee Cloud or self-hosted Tolgee instance.

Quick integration guide

react-integrate-infinite
Learn more at our documentation website 📖.