📎 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.jsondentro de subpastas como/en-US,/ese/pt-BR. - O HTML pode ficar sem texto fixo, porque o conteúdo é inserido de forma dinâmica conforme a linguagem.
- O atributo
data-i18nserve para aplicar traduções ao texto e também a atributos comotitleealt. - A inicialização mostrada usa
fallbackLng,debug,fixLngeloadpara 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
fallbackLngquando 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.
