↓ Ir para o conteúdo principal

← todas as notas

📎 Webclip

i18next para Internacionalização

O texto conta que a necessidade de atender três idiomas em um projeto levou à busca por uma forma de internacionalização. A proposta é usar o i18next para centralizar traduções em JSON, preencher o HTML por meio de data-i18n e deixar o conteúdo mudar conforme a língua do usuário ou a escolha feita no clique.

Fichamento
#

  • A necessidade de suportar inglês, espanhol e português fez o autor procurar uma solução de internacionalização.
  • O i18next é apresentado como a lib que organiza esse fluxo e não se limita a JavaScript.
  • As traduções ficam em arquivos translation.json dentro de subpastas como /en-US, /es e /pt-BR.
  • O HTML pode ficar sem texto fixo, porque o conteúdo é inserido de forma dinâmica conforme a linguagem.
  • O atributo data-i18n serve para aplicar traduções ao texto e também a atributos como title e alt.
  • A inicialização mostrada usa fallbackLng, debug, fixLng e load para definir idioma padrão, exibir informações de desenvolvimento, preservar o cookie de idioma e carregar só a linguagem atual.
  • A lib detecta a linguagem do navegador e usa o valor de fallbackLng quando a língua detectada não tem tradução.
  • Em uma interação do usuário, i18n.setLng('es', {fixLng: true}, ...) atualiza a linguagem e reaplica as traduções na página.
  • O artigo diz que o resultado é um conteúdo mais acessível em vários idiomas e aponta um repositório com o exemplo e o código comentado.