- Detalhe importante: A internacionalização não foi traduzida com nenhuma serviço profissional, usei o google tradutor para confeccionar, só o fiz para demonstrar o conceito de internacionalização
- Caso fosse fazer esse tipo de trabalho para uma empresa internacional, necessitaria de um tradutor, para cada idioma ser muito bem revisado.
- Os únicos idiomas que eu fiz revisão foram de Inglês e Espanhol, já que são linguas que eu tenho conhecimento. Alemão eu tenho noções bem básicas portanto dei uma olhada também.
- Consultado os idiomas mais falados do mundo aqui
- Para demonstração vou usar o idioma Inglês como exemplo, sendo ele a abreviatura
en
. - Adicione o SVG da bandeira em
src/assets/flags-icons/
, salve com o nome da abreviação.svg, como por exemplo "en.svg". - Crie em
src/languages/
um novo arquivo com o nome da abreviação.json, por exemplo "en.json" - Traduza a partir de outro JSON todos os valores e mantenha a mesmíssima estrutura interna de chaveamento para não ocorrer nenhum bug ou falha.
- Brasileiro fala "Inglês", e o Americano chama o proprio idioma de "English", portanto devemos adicionar EM TODOS OS JSONS uma nova chave no caminho
global.language
com a chave da abreviação e no valor colocar a maneira como o idioma é chamado em cada lingua diferente. Criei um prompt para o chatGPT para realizar essa tradução de forma mais rápida, está logo abaixo. - Após adicionar isso, vá em
src/interfaces/Languages.interface.ts
e adicione uma nova linha para a interfaceLanguageOptions
que está sendo exportada. Ela precisa ser o nome da abreviação, e é uma string. - Agora navegue para
src/components/LanguageSwitcher.tsx
, importe a bandeira criada no passo 1.
import enIcon from "../assets/flags-icons/en.svg";
- Ainda neste arquivo, modifique a constante
languages
e insira um novo objeto dentro, que conterá as seguintes props :
{
code: "en",
name: getTranslatedInformation(selected, "global.language.en"),
icon: enIcon,
}
- Para finalizar navegue até
src/utils/languageFunctions.ts
e faça as seguintes modificações: - Importe o JSON criado no passo 2.
import en from "../languages/en.json";
- Adicione na constante
translations
o json importado no passo 9. - Na função
isLanguage
adicione a abreviatura no array retornado. - Pronto! Agora você já pode atualizar sua aplicação e ela possuirá o novo idioma criado!
Traduza o trecho solicitado para os seguintes idiomas:
1. Árabe (ar)
2. Bengali (be)
3. Mandarim Chinês (ch)
4. Tcheco (cz)
5. Alemão (de)
6. Dinamarquês (di)
7. Inglês Americano (en)
8. Espanhol (es)
9. Estoniano (et)
10. Finlandês (fi)
11. Francês (fr)
12. Grego (gr)
13. Hebraico (he)
14. Hindi (hi)
15. Húngaro (hu)
16. Indonésio (ind)
17. Italiano (it)
18. Japonês (ja)
19. Coreano (ko)
20. Latim (la)
21. Holandês (ne)
22. Norueguês (no)
23. Polonês (po)
24. Português Brasileiro (ptbr)
25. Português de Portugal (ptpt)
26. Russo (ru)
27. Suaíli (sw)
28. Tailandês (ta)
29. Turco (tu)
30. Zulu (zu)
Segue o trecho para ser traduzido, escrito em Português Brasileiro:
insira o que deseja traduzir aqui
Retorne cada um deles dessa forma:
sigla-do-idioma :
resto do json
"key": "TRECHO_TRADUZIDO",
- quero as siglas em ordem alfabetica na chave e o texto traduzido no valor do JSON
- por favor sem as vírgulas no final de cada linha, para facilitar o ato de copiar e colar para os JSONs principais
- Alguns passos podem ser automatizados com Python, como o passo 4 acima, de criar em cada JSON a chave e valor do novo idioma, será criado em breve