Bezproblemowa lokalizacja aplikacji React

Chcesz rozszerzyć swoją aplikację React na nowe rynki? TacoTranslate sprawia, że lokalizacja aplikacji React jest niezwykle prosta, umożliwiając dotarcie do odbiorców na całym świecie bez zbędnych trudności.

Dlaczego warto wybrać TacoTranslate dla Reacta?

Bezproblemowa integracja: Zaprojektowany specjalnie dla aplikacji React, TacoTranslate bezproblemowo integruje się z twoim istniejącym przepływem pracy.
Automatyczne zbieranie tekstów: Koniec z ręcznym zarządzaniem plikami JSON. TacoTranslate automatycznie zbiera teksty z kodu źródłowego.
Tłumaczenia wspierane przez sztuczną inteligencję: Wykorzystaj moc sztucznej inteligencji, aby zapewnić kontekstowo dokładne tłumaczenia, które pasują do tonu twojej aplikacji.
Natychmiastowe wsparcie językowe: 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 w TacoTranslate, projekt tłumaczeniowy oraz powiązane klucze API. Utwórz konto tutaj. Jest bezpłatne i nie wymaga podawania karty kredytowej.

W interfejsie aplikacji TacoTranslate utwórz projekt i przejdź do zakładki z kluczami 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 projektu.

Musisz także dodać dwie dodatkowe zmienne środowiskowe: TACOTRANSLATE_DEFAULT_LOCALE i 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 witryny. Więcej informacji o originach znajdziesz 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.

Konfigurowanie 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>
	);
}

Teraz możesz 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 wdrożeniowe dopasowane 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 tekstów, oszczędzając cenny czas.
Opłacalne: Zmniejsza potrzebę ręcznych tłumaczeń, obniżając koszty lokalizacji.
Lepsza dokładność: Tłumaczenia wspierane przez AI zapewniają kontekstowo trafne i wysokiej jakości rezultaty.
Skalowalne rozwiązanie: Łatwo dodawaj obsługę nowych języków w miarę rozwoju aplikacji i bazy klientów.

Zacznij już dziś!

Twoja aplikacja React zostanie przetłumaczona automatycznie, gdy dodasz dowolne ciągi tekstowe do komponentu Translate. Zwróć uwagę, że tylko środowiska posiadające uprawnienia read/write dla 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żesz testować aplikację produkcyjną, dodając nowe ciągi przed wdrożeniem na żywo. Zapobiegnie to kradzieży twojego tajnego klucza API oraz potencjalnemu rozrostowi projektu tłumaczeniowego spowodowanemu dodawaniem 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!