Bezproblemowa lokalizacja aplikacji React
Czy chcesz rozszerzyć swoją aplikację React na nowe rynki? TacoTranslate sprawia, że lokalizacja aplikacji React jest niezwykle prosta, pozwalając dotrzeć do globalnej publiczności bez zbędnych komplikacji.
Dlaczego wybrać TacoTranslate dla Reacta?
- Bezproblemowa integracja: Stworzony specjalnie dla aplikacji React, TacoTranslate integruje się bezproblemowo z twoim obecnym przepływem pracy.
- Automatyczne zbieranie łańcuchów znaków: Koniec z ręcznym zarządzaniem plikami JSON. TacoTranslate automatycznie zbiera łańcuchy znaków z twojej bazy kodu.
- Tłumaczenia wspomagane sztuczną inteligencją: Wykorzystaj moc sztucznej inteligencji, aby zapewnić tłumaczenia wierne kontekstowi i dopasowane do tonu twojej aplikacji.
- Błyskawiczne 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 tacotranslatePo zainstalowaniu modułu należy utworzyć konto TacoTranslate, projekt tłumaczeniowy oraz powiązane klucze API. Załóż konto tutaj. Jest darmowe 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 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 naendla języka angielskiego.TACOTRANSLATE_ORIGIN: „folder”, w którym będą przechowywane twoje ciągi znaków, na przykład adres URL twojej witryny. Więcej informacji o originach znajdziesz tutaj.
TACOTRANSLATE_PUBLIC_API_KEY=123456
TACOTRANSLATE_SECRET_API_KEY=789010
TACOTRANSLATE_DEFAULT_LOCALE=en
TACOTRANSLATE_ORIGIN=your-website-url.comUpewnij się, że nigdy nie ujawnisz tajnego read/write klucza API w produkcyjnych środowiskach po stronie klienta.
Konfigurowanie TacoTranslate
Zainicjalizuj TacoTranslate w aplikacji React, opakowując ją 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 i przewodniki dotyczące wdrożenia, 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 używania TacoTranslate
- Oszczędność czasu: Automatyzuje żmudny proces lokalizacji i zbierania tekstów, co pozwala zaoszczędzić cenny czas.
- Opłacalne: Zmniejsza potrzebę ręcznych tłumaczeń, obniżając koszty lokalizacji.
- Poprawiona dokładność: Tłumaczenia wspomagane 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 użytkowników.
Zacznij już dziś!
Twoja aplikacja React zostanie przetłumaczona automatycznie, gdy dodasz jakiekolwiek ciągi do komponentu Translate. Należy pamiętać, że tylko środowiska posiadające uprawnienia read/write na kluczu 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 przetestować aplikację produkcyjną, dodając nowe ciągi przed uruchomieniem. Zapobiegnie to kradzieży twojego tajnego klucza API przez niepowołane osoby oraz ewentualnemu nadmiernemu rozrostowi projektu tłumaczeniowego poprzez 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!