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 chaves API associadas. Crie uma conta aqui. É grátis e não exige que adicione um cartão de crédito.

Dentro da interface da aplicação TacoTranslate, crie um projeto e navegue até à aba das suas 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 será necessário adicionar mais duas variáveis de ambiente: TACOTRANSLATE_DEFAULT_LOCALE e TACOTRANSLATE_ORIGIN.

• TACOTRANSLATE_DEFAULT_LOCALE: O código do locale de fallback padrão. Neste exemplo, iremos defini-lo como en para Inglês.
• TACOTRANSLATE_ORIGIN: A “pasta” onde as suas strings serão armazenadas, como a URL do seu website. 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 divulgar a chave API secreta read/write em ambientes de produção do lado do cliente.

Configurar o TacoTranslate

Inicialize o TacoTranslate na sua aplicação React envolvendo 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 utilizar 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." />
	);
}

Benefícios 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 com 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 qualquer cadeia de texto a um componente Translate. Note que apenas os 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 entrar em produção. Isto evitará que alguém roube a sua chave API secreta e, potencialmente, infle o seu projeto de tradução adicionando cadeias indesejadas.

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

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