Localização sem esforço para aplicações React

Como funciona

Instale o pacote TacoTranslate via npm:

npm install tacotranslate

Quando tiver o módulo instalado, precisará de criar uma conta TacoTranslate, um projeto de tradução e as respetivas chaves API. Crie uma conta aqui. É gratuito e não requer que adicione um cartão de crédito.

Dentro da interface da aplicação TacoTranslate, crie um projeto e navegue até ao separador das chaves API. Crie uma chave read e uma chave read/write. Iremos guardá-las como variáveis de ambiente. A chave read é o que chamamos de public e a chave read/write é secret. Por exemplo, pode adicioná-las a um ficheiro .env na raiz do seu projeto.

Também precisará de adicionar mais duas variáveis de ambiente: TACOTRANSLATE_DEFAULT_LOCALE e TACOTRANSLATE_ORIGIN.

• TACOTRANSLATE_DEFAULT_LOCALE: O código do locale predefinido de reserva. Neste exemplo, vamos defini-lo como en para Inglês.
• TACOTRANSLATE_ORIGIN: A “pasta” onde as suas strings serão armazenadas, como a URL do seu site. Leia mais sobre origens aqui.

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

Certifique-se de nunca expor a chave API secreta read/write em ambientes de produção no lado do cliente.

Configurar o TacoTranslate

Inicie o TacoTranslate na sua aplicação React ao envolver a sua aplicação no fornecedor de contexto do 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>
	);
}

Agora pode usar o componente Translate em qualquer parte da sua aplicação para mostrar texto traduzido! Não deixe de consultar a nossa documentação para mais informações e para guias de implementação específicos para a sua configuração.

import {Translate} from 'tacotranslate/react';

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

Vantagens de usar o TacoTranslate

• Poupa tempo: Automatiza o processo tedioso de localização e recolha de strings, poupando-lhe tempo valioso.
• Rentável: Reduz a necessidade de traduções manuais, diminuindo os seus custos de localização.
• Precisão melhorada: Traduções alimentadas por IA garantem resultados contextualmente precisos e de alta qualidade.
• Solução escalável: Adicione facilmente suporte para novas línguas à medida que a sua aplicação e base de clientes crescem.

Comece hoje!

A sua aplicação React será traduzida automaticamente quando adicionar quaisquer cadeias de texto a um componente Translate. Note que apenas ambientes com permissões read/write na chave API poderão criar novas cadeias para serem traduzidas.

Recomendamos ter um ambiente de staging fechado e seguro onde possa testar a sua aplicação de produção, adicionando novas cadeias antes de ir para produção. Isto irá impedir que alguém roube a sua chave API secreta e potencialmente infle o seu projeto de tradução ao adicionar cadeias não autorizadas.

Não se esqueça de consultar os exemplos completos no nosso perfil do GitHub. Se encontrar algum problema, não hesite em contactar-nos, teremos todo o prazer em ajudar.

O TacoTranslate permite-lhe localizar automaticamente as suas aplicações React de forma rápida para e a partir de qualquer língua. Traduza gratuitamente!