React i18n bez kluczy tłumaczenia

Większość bibliotek React i18n działa z kluczami tłumaczeniowymi. Każdy tekst w aplikacji zastępujesz kluczem, przechowujesz plik tłumaczeń dla każdego języka i wyszukujesz właściwy tekst w czasie wykonywania. Magic Translate pomija to wszystko: piszesz swój tekst we własnym języku i jest on tłumaczony, gdy strona jest wyświetlana.

Jak działa i18n z kluczami tłumaczeniowymi

Dzięki bibliotece opartej na kluczach prosty przycisk wygląda następująco:

// en.json
{ "checkout.button": "Continue to payment" }

// de.json
{ "checkout.button": "Weiter zur Zahlung" }

// Checkout.tsx
<button>{t('checkout.button')}</button>

Każdy nowy tekst oznacza nowy klucz, wpis w każdym pliku językowym i tłumaczenie dla każdego języka. Kiedy zmienisz tekst w języku angielskim, pozostałe języki są nieaktualne, dopóki ktoś nie przetłumaczy ich ponownie.

Ten sam przycisk bez klawiszy

Z Magic Translate tekst pozostaje tam, gdzie jest:

import { T } from '@magic-translate/react';

<button>
  <T>Continue to payment</T>
</button>

Nie ma plików językowych do utrzymania. Po zmianie tekstu nowa wersja jest tłumaczona przy następnym wyświetleniu, a od tego czasu tłumaczenie jest przechowywane w pamięci podręcznej.

Pierwsze kroki

Zarejestruj się w Magic Translate i zdobądź klucz API. Bezpłatny plan obejmuje 5000 znaków miesięcznie.
Zainstaluj klienta i zawiń aplikację w MagicTranslateProvider, jak pokazano w przewodniku React.
Owiń swój tekst w <T>. W przypadku props i atrybutów użyj useT hook.

import { MagicTranslateProvider, T, Language } from '@magic-translate/react';

const App = () => (
  <MagicTranslateProvider apiKey="<your-api-key>" language={Language.FR}>
    <h1>
      <T>Welcome to our shop</T>
    </h1>
  </MagicTranslateProvider>
);

Jeśli renderujesz na serwerze, zamiast tego użyj React SSR, aby wyszukiwarki i użytkownicy otrzymali w pełni przetłumaczony kod HTML.

Kiedy klucze do tłumaczenia są nadal lepszym wyborem

Tłumaczenie maszynowe jest dobre, ale nie jest sprawdzane przez osobę. Jeśli każde słowo aplikacji musi zostać zatwierdzone przez tłumacza, na przykład w przypadku tekstów prawnych lub medycznych, biblioteka oparta na kluczach z tłumaczeniami ludzkimi zapewnia tę kontrolę. Wiele aplikacji łączy w sobie zarówno: Magic Translate dla większości interfejsu, jak i sprawdzane teksty tam, gdzie ma to znaczenie.

Często zadawane pytania

Czy tłumaczenie jest wystarczająco szybkie?

Pierwsze tłumaczenie tekstu może zająć kilka sekund. Następnie jest buforowany i trwa od 100 do 300 ms. Dzięki React SSR tłumaczenia odbywają się na serwerze, więc użytkownicy nigdy na nie czekają.

Ile to kosztuje?

Używanie jest liczone w przetłumaczonych znakach miesięcznie, a tekst, który został już przetłumaczony, nie jest ponownie liczony. Zobacz, jak obliczane jest wykorzy stanie i ceny.

Jakie języki są obsługiwane?

Ponad 70. Zobacz pełną listę obsługiwanych języków.