Bezproblemowa lokalizacja aplikacji React

Planujesz rozszerzyć swoją aplikację React na nowe rynki? TacoTranslate niezwykle ułatwia lokalizację aplikacji React, pozwalając dotrzeć do globalnej publiczności bez zbędnych kłopotów.

Dlaczego warto wybrać TacoTranslate dla React?

Płynna integracja: Zaprojektowany specjalnie dla aplikacji React, TacoTranslate bezproblemowo integruje się z twoim istniejącym procesem pracy.
Automatyczne zbieranie tekstów: Koniec z ręcznym zarządzaniem plikami JSON. TacoTranslate automatycznie zbiera teksty z twojej bazy kodu.
Tłumaczenia wspierane przez AI: Wykorzystaj moc sztucznej inteligencji, aby dostarczać kontekstowo trafne tłumaczenia, które pasują do tonu twojej aplikacji.
Szybkie dodawanie języków: Dodaj obsługę nowych języków jednym kliknięciem, dzięki czemu twoja aplikacja będzie dostępna globalnie.

Jak to działa

Zainstaluj pakiet TacoTranslate za pomocą npm:

npm install tacotranslate

Po zainstalowaniu modułu musisz utworzyć konto TacoTranslate, projekt tłumaczeniowy oraz powiązane klucze API. Załóż konto tutaj. To bezpłatne i nie wymaga podawania karty kredytowej.

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

Musisz także dodać jeszcze dwie 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 języka angielskiego.
TACOTRANSLATE_ORIGIN: „folder”, w którym będą przechowywane Twoje teksty, na przykład adres URL Twojej strony. 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

Pamiętaj, aby nigdy nie ujawniać tajnego read/write klucza API w środowiskach produkcyjnych po stronie klienta.

Konfiguracja TacoTranslate

Zainicjalizuj TacoTranslate w swojej aplikacji React, opakowują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>
	);
}

Możesz teraz używać komponentu Translate w dowolnym miejscu 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." />
	);
}

Zalety korzystania z TacoTranslate

Oszczędność czasu: Automatyzuje żmudny proces lokalizacji i zbierania tekstów, oszczędzając cenny czas.
Opłacalne: Zmniejsza zapotrzebowanie na ręczne tłumaczenia, obniżając koszty lokalizacji.
Wyższa dokładność: Tłumaczenia wspomagane przez AI zapewniają kontekstowo trafne i wysokiej jakości wyniki.
Skalowalne rozwiązanie: Łatwo dodawaj obsługę nowych języków w miarę rozwoju aplikacji i bazy klientów.

Rozpocznij już dziś!

Twoja aplikacja React zostanie przetłumaczona automatycznie, gdy dodasz jakiekolwiek ciągi tekstowe do komponentu Translate. Zwróć uwagę, że tylko środowiska posiadające uprawnienia read/write do klucza API będą mogły tworzyć nowe ciągi do przetłumaczenia.

Zalecamy posiadanie zamkniętego i zabezpieczonego środowiska stagingowego, w którym możesz testować aplikację produkcyjną, dodając nowe ciągi przed uruchomieniem. To zapobiegnie kradzieży twojego sekretnego klucza API i potencjalnemu rozrostowi projektu tłumaczeń 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!