Integrazione di FBT + Crowdin + GitHub

Pubblicato il

(Jorge Dalmendray) (22 dicembre , 2020)

In un (articolo precedente) ho sottolineato come integrare il framework FBT (Facebook Translation) con la tua applicazione React Native. Ho concluso quellarticolo spiegando come abbiamo avuto una lacuna nel processo di traduzione: la traduzione stessa.

Diamo unocchiata al processo di traduzione un po più da vicino:

  1. Scrivi codice durante il wrapping le tue stringhe nei tag fbt
  2. Estrai tutte le stringhe dal codice sorgente e preparale per la traduzione. Questo è gestito da un semplice script nella libreria fbt
  3. GAP: Invia le stringhe per la traduzione
  4. GAP: Dopo aver completato le traduzioni, abbiamo bisogno di un modo per reinserirle nellapp il più velocemente possibile possiamo
  5. Profitto!

Inserisci Crowdin . Crowdin è una soluzione basata su cloud che semplifica la gestione della localizzazione per il tuo team. È uno strumento per gestire le tue stringhe, assumere traduttori e assicurarti che le traduzioni siano accurate e nel contesto della tua app.

In questo articolo spiegherò come integrare il tuo repository GitHub con Crowdin per caricare automaticamente nuove stringhe per le traduzioni e come creare automaticamente una richiesta pull (PR) quando le traduzioni sono pronte.

Quando utilizzi FBT, puoi estrarre tutte le stringhe dal codice sorgente eseguendo due semplici script:

  1. fbt-manifest: questo script troverà tutti i file di origine con chiamate fbt() o tag

  2. fbt-collect: questo script riceve linput dello script fbt-manifest, passa in rassegna tutti i file in esso ed estrae le stringhe e la descrizione in un file separato, chiamiamolo .source\_strings.json

A questo punto devi far sapere a Crowdin dove si trova il tuo file .source\_strings.json, quindi leggerà da esso in base a una pianificazione da te impostata, aggiungi quelle stringhe alla piattaforma e avvisa i traduttori delle nuove stringhe pronte per la traduzione.

Passaggi per lintegrazione di Crowdin con il tuo Repo GitHub

  1. Integra il tuo repository GitHub con Crowdin : questo consentirà Crowdin to r Leggere dal repository e quindi inviare PR per la revisione. Nota: Se non utilizzi GitHub, consulta altre integrazioni di Crowdin
  2. Crea un file di configurazione crowdin.yml nella radice del progetto. Qui è dove dirai a Crowdin dove recuperare le stringhe sorgente e dove inserire le traduzioni una volta che sono presenti. Un esempio del contenuto del file di seguito:
files:
- source: /i18n/fbt/.source\_strings.json
translation: /i18n/fbt/translations/\%two\_letters\_code\%/translation.json

Per ulteriori informazioni su questo file di configurazione, consulta la documentazione di Crowdin .

A questo punto, quando il tuo .source\_strings.json viene aggiornato eseguendo gli script di fbt, le nuove stringhe verranno importate nella piattaforma di Crowdin a seconda della pianificazione della sincronizzazione impostata durante lintegrazione con GitHub.

È quindi possibile ordinare servizi di traduzione professionale tramite la piattaforma o scegli di utilizzare traduzioni automatiche , in entrambi i casi, quando vengono aggiunte nuove traduzioni, Crowdin creerà un PR nel tuo repository. A questo punto puoi accettare e unire manualmente le modifiche o creare unazione GitHub per accettare e unire automaticamente le modifiche!

Conversione delloutput di Crowdin in un formato leggibile FBT

Il passaggio finale prima è possibile utilizzare le traduzioni è eseguire lo script fbt-translate. Questo script genererà un file che la piattaforma FBT comprende ed è il file che alla fine imposterai nel codice.

fbt-translate :

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

Utilizzo in React :

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

Utilizzo in React Native:

  • Per React Native / Android dobbiamo convertire loutput dello script fbt-translate in un file di risorse stringa Android. Uno script ti aiuterà in questo passaggio:

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

Dopo aver eseguito questo, sei pronto per eseguire la tua applicazione Android.

  • Per React Native / iOS dobbiamo convertire loutput del fbt-translate in un file di risorse stringa iOS .Non esiste uno script per raggiungere questo obiettivo ma siamo sempre aperti ai contributi 🙂

Considerazioni finali

A questo punto dovresti essere in grado di estrarre le stringhe dalla tua app, automaticamente caricali su Crowdin e poi ottieni un PR quando le traduzioni sono pronte. Come avrai notato, alcuni passaggi di questo processo sono manuali. Alcuni suggerimenti:

Crea azioni GitHub, passaggi CircleCI (o qualunque cosa usi per CI / CD) da eseguire:

  • fbt-manifest e fbt-collect ogni volta che unisci un PR
  • Unione di PR creati da Crowdin automaticamente
  • In esecuzione fbt-translate dopo lunione dei PR di Crowdin
  • Per Android, eseguendo generate-android-localizables-executor.js dopo fbt-translate scrip

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *