Bezproblemowa lokalizacja aplikacji React

Czy chcesz rozszerzyć swoją aplikację React na nowe rynki? TacoTranslate sprawia, że lokalizacja Twoich aplikacji React jest niezwykle łatwa, umożliwiając dotarcie do globalnej publiczności bez żadnych trudności.

Dlaczego wybrać TacoTranslate dla React?

Płynna integracja: Zaprojektowany specjalnie dla aplikacji React, TacoTranslate bezproblemowo integruje się z Twoim obecnym workflow.
Automatyczne zbieranie stringów: Koniec z ręcznym zarządzaniem plikami JSON. TacoTranslate automatycznie zbiera stringi z Twojej bazy kodu.
Tłumaczenia napędzane SI: Wykorzystaj moc sztucznej inteligencji, aby dostarczać tłumaczenia kontekstowo dokładne, dopasowane do tonu Twojej aplikacji.
Błyskawiczne wsparcie językowe: Dodaj obsługę nowych języków za pomocą jednego kliknięcia, sprawiając, że Twoja aplikacja będzie dostępna globalnie.

Jak to działa

Zainstaluj pakiet TacoTranslate za pomocą npm:

npm install tacotranslate

Gdy moduł jest zainstalowany, musisz utworzyć konto TacoTranslate, projekt tłumaczeniowy oraz powiązane klucze API. Utwórz konto tutaj. To darmowe i nie wymaga podawania karty kredytowej.

W interfejsie aplikacji TacoTranslate utwórz projekt i przejdź do zakładki kluczy API. Utwórz jeden klucz read, oraz jeden klucz read/write. Zapiszemy je jako zmienne środowiskowe. Klucz read nazywamy public, a klucz read/write to secret. Na przykład możesz dodać je do pliku .env w katalogu głównym swojego projektu.

Będziesz także musiał dodać dwie kolejne zmienne środowiskowe: TACOTRANSLATE_DEFAULT_LOCALE oraz TACOTRANSLATE_ORIGIN.

TACOTRANSLATE_DEFAULT_LOCALE: Domyślny kod lokalizacji zapasowej. W tym przykładzie ustawimy go na en dla angielskiego.
TACOTRANSLATE_ORIGIN: „Folder”, w którym będą przechowywane Twoje ciągi znaków, na przykład adres URL Twojej strony internetowej. Przeczytaj więcej o originach tutaj.

.env

TACOTRANSLATE_PUBLIC_API_KEY=123456
TACOTRANSLATE_SECRET_API_KEY=789010
TACOTRANSLATE_DEFAULT_LOCALE=en
TACOTRANSLATE_ORIGIN=your-website-url.com

Upewnij się, że nigdy nie ujawnisz sekretnego klucza API read/write w środowiskach produkcyjnych po stronie klienta.

Konfiguracja TacoTranslate

Zainicjuj TacoTranslate w swojej aplikacji React, owijając ją w dostawcę kontekstu TacoTranslate:

import React, {useState} from 'react';
import TacoTranslate, {Translate} from 'tacotranslate/react';

const tacoTranslate = createTacoTranslateClient({
	apiKey: 'YOUR_API_KEY',
});

export default function App() {
	const [locale, setLocale] = useState('en');

	return (
		<TacoTranslate client={tacoTranslate} locale={locale}>
			<Translate string="Hello, world!"/>
		</TacoTranslate>
	);
}

Teraz możesz używać komponentu Translate w dowolnym miejscu w swojej aplikacji, aby wyświetlać przetłumaczony tekst! Koniecznie sprawdź naszą dokumentację, aby uzyskać więcej informacji oraz przewodniki dotyczące implementacji dostosowane do Twojej konfiguracji.

import {Translate} from 'tacotranslate/react';

export default async function Component() {
	return (
		<Translate string="Hello? This is TacoTranslate speaking." />
	);
}

Korzyści z korzystania z TacoTranslate

Oszczędność czasu: Automatyzuje żmudny proces lokalizacji i zbierania stringów, oszczędzając Twój cenny czas.
Opłacalność: Redukuje potrzebę ręcznych tłumaczeń, obniżając koszty lokalizacji.
Poprawiona dokładność: Tłumaczenia oparte na sztucznej inteligencji zapewniają kontekstowo dokładne i wysokiej jakości rezultaty.
Skalowalne rozwiązanie: Łatwo dodawaj wsparcie dla nowych języków, wraz z rozwojem Twojej aplikacji i bazy klientów.

Zacznij już dziś!

Twoja aplikacja React zostanie przetłumaczona automatycznie, gdy dodasz dowolne ciągi do komponentu Translate. Zauważ, że tylko środowiska z uprawnieniami read/write do klucza API będą mogły tworzyć nowe ciągi do przetłumaczenia.

Zalecamy posiadanie zamkniętego i zabezpieczonego środowiska staging, w którym można testować aplikację produkcyjną, dodając nowe ciągi przed jej uruchomieniem. Zapobiegnie to kradzieży twojego sekretnego klucza API oraz potencjalnemu rozrostowi projektu tłumaczeniowego przez dodawanie nieautoryzowanych ciągów.

Be sure to check out the complete examples over at our GitHub profile. If you encounter any problems, feel free to reach out, and we’ll be more than happy to help.

TacoTranslate lets you automatically localize your React applications quickly to and from over 75 languages. Translate for free!