Apuntes

Experiencia de usuario

• ¿Cómo hacemos para detectar el idioma del usuario que está utilizando el sitio?
• ¿Cómo hacemos para mantener en la transición de una página a otra dentro de nuestra aplicación para mantenerlo en el mismo link?
• ¿Cómo podemos forzar para cambiar un idioma a otro?

Next.js detecta el idioma del usuario de forma automatica*

• La manera en la cual Next.js detecta el idioma, es mediante la lectura de la propiedad Accept-Language Header HTTP propio del navegador
  • Una vez obtenido el valor del locale lo aplica a la configuración
• En caso de necesitar deshabilitarla se puede hacer editando la configuración de next.js en next.config.js

module.exports = {
	i18n: {
		localeDetection: false,
	}
}

i18n y next/Link

• next/link navegará al locale actualmente activo
• Una manera de cambiar el idioma al pasar de una página a otra es mediante router.push

router.push(
	url: string,
	as?: string,
	{ locale: 'br' }
)

• De una manera similar se puede deshabilitar esta opción con un link

<Link href="/br/about-us" locale={ false } />

i18n Cookie

• NEXT_LOCALE
  • Podemos enviar el valor para guardar la preferencia del idioma del usuario
• Permite controlar el locale a mostrar de un usuario