Integrando FBT + Crowdin + GitHub

(Jorge Dalmendray) (22 de dezembro , 2020)

Em um (artigo anterior) eu esbocei como integrar a estrutura FBT (Facebook Translation) ao seu aplicativo React Native. Concluí aquele artigo explicando como havia uma lacuna no processo de tradução: a tradução em si.

Vamos examinar o processo de tradução um pouco mais de perto:

  1. Escreva o código durante o empacotamento suas strings em fbt tags
  2. Extraia todas as strings do código-fonte e deixe-as prontas para traduções. Isso é gerenciado por um script simples na biblioteca fbt
  3. GAP: Envie as strings para tradução
  4. GAP: Depois que as traduções estiverem concluídas, precisamos encontrar uma maneira de colocá-las de volta no aplicativo o mais rápido podemos
  5. Lucro!

Insira Crowdin . Crowdin é uma solução baseada em nuvem que agiliza o gerenciamento de localização para sua equipe. É uma ferramenta para gerenciar suas strings, contratar tradutores e garantir que as traduções sejam precisas e dentro do contexto de seu aplicativo.

Neste artigo, explicarei como integrar seu repositório GitHub ao Crowdin para carregar automaticamente novas strings para traduções e como criar automaticamente um Pull Request (PR) quando suas traduções estiverem prontas.

Ao usar o FBT, você pode extrair todas as strings de seu código-fonte executando dois scripts simples:

  1. fbt-manifest: Este script encontrará todos os arquivos de origem com fbt() chamadas ou tags neles

  2. fbt-collect: Este script recebe a entrada do script fbt-manifest, percorre todos os arquivos nele e extrai as strings e a descrição em um arquivo separado, vamos chamá-lo de .source\_strings.json

Neste ponto, você precisa informar ao Crowdin onde seu .source\_strings.json arquivo está, ele então lerá a partir dele, em uma programação definida por você, adicione essas strings à plataforma e alerte os tradutores sobre as novas strings prontas para tradução.

Etapas para integrar o Crowdin ao seu GitHub repo

  1. Integre seu GitHub repo com Crowdin : Isso permitirá Crowdin para r leiam do seu repo e, em seguida, envie os PRs para revisão. Observação: Se não estiver usando o GitHub, consulte outras integrações Crowdin
  2. Crie um arquivo de configuração crowdin.yml na raiz do seu projeto. Aqui é onde você dirá ao Crowdin onde buscar as strings de origem e onde colocar as traduções, uma vez que estejam. Um exemplo do conteúdo do arquivo abaixo:
files:
- source: /i18n/fbt/.source\_strings.json
translation: /i18n/fbt/translations/\%two\_letters\_code\%/translation.json

Para obter mais informações sobre este arquivo de configuração, consulte a documentação do Crowdin .

Neste ponto, quando seu .source\_strings.json arquivo é atualizado executando scripts fbt, novas strings serão importadas para a plataforma Crowdin dependendo do cronograma de sincronização definido ao integrá-lo com GitHub.

Você pode então solicitar serviços de tradução profissional por meio da plataforma ou opte por usar traduções automáticas , de qualquer maneira, quando novas traduções forem adicionadas, Crowdin criará um PR no seu repo. Neste ponto, você pode aceitar manualmente e mesclar as alterações ou criar uma ação do GitHub para aceitar e mesclar automaticamente as alterações!

Converter a saída do Crowdin em um formato legível FBT

A etapa final antes você pode usar as traduções para executar o script fbt-translate. Este script irá gerar um arquivo que a plataforma FBT entende e é o arquivo que você definirá no código.

fbt-translate :

"translate-fbts": "fbt-translate --translations translations/*.json --jenkins > src/translatedFbts.json"

Uso no React :

init({
translations: require("../translatedFbts.json"),
hooks: {
getViewerContext: () => viewerContext,
},
});

Uso no React Native:

  • Para React Native / Android precisamos converter a saída do script fbt-translate em um arquivo de recurso de string Android. Um script o ajudará nesta etapa:

"generate-android-fbt": "babel-node i18n/scripts/generate-android-localizables-executor.js"

Depois de executar isso, você está pronto para executar seu aplicativo Android.

  • Para React Native / iOS, precisamos converter a saída do fbt-translate script em um arquivo de recurso de string iOS .Não há script para fazer isso, mas estamos sempre abertos a contribuições 🙂

Considerações finais

Neste ponto, você deve ser capaz de extrair strings de seu aplicativo, automaticamente carregue-os no Crowdin e obtenha um PR quando as traduções estiverem prontas. Como você deve ter notado, algumas etapas deste processo são manuais. Algumas sugestões:

Crie ações do GitHub, etapas do CircleCI (ou o que você usar para CI / CD) para executar:

  • fbt-manifest e fbt-collect sempre que você mesclar um PR
  • Mesclar PRs criados pela Crowdin automaticamente
  • Executar fbt-translate depois que os PRs Crowdin são mesclados
  • Para Android, execute o generate-android-localizables-executor.js após o fbt-translate script

Deixe uma resposta

O seu endereço de email não será publicado. Campos obrigatórios marcados com *