Usar globalize.now con Next.js

Configura internacionalización en una app Next.js en menos de cinco minutos.

Next.js tiene soporte de i18n de primera clase a través de bibliotecas como next-intl y next-i18next, pero esas bibliotecas esperan un codebase con claves de traducción ya en su lugar. globalize.now es el paso anterior: toma una app Next.js llena de inglés codificado y produce las claves, archivos de traducción y componentes refactorizados que next-intl (o cualquier biblioteca de runtime) puede servir.

Requisitos previos

  • Un proyecto Next.js (App Router o Pages Router)
  • Un repositorio Git
  • Node.js 18+
  • Una biblioteca de runtime de i18n elegida (next-intl recomendado)

Cómo configurar globalize.now con Next.js

  1. Instala tu biblioteca de runtime

    Añade next-intl o la biblioteca que prefieras para que la app pueda cargar mensajes por locale en tiempo de ejecución.

    npm install next-intl
  2. Configura el enrutamiento básico de next-intl

    Conecta middleware, proveedores y segmentos de ruta como se describe en la documentación de next-intl, o salta este paso si ya lo terminaste.

  3. Ejecuta el instalador de skills de Globalize

    Desde la raíz del proyecto Next.js, instala los skills para que el agente pueda alinearse con tu configuración de enrutamiento.

    npx globalize-skills
  4. Confirma la detección de next-intl

    Deja que el agente verifique que los proveedores y las rutas de mensajes coincidan con las convenciones que globalize.now espera para Next.js.

  5. Revisa el diseño de archivos de traducción propuesto

    Inspecciona el directorio de mensajes sugerido y los nombres de archivo para que sigan el patrón de mensajes por locale que elegiste.

  6. Refactoriza literales a llamadas de traducción

    Aprueba actualizaciones que reemplacen inglés incrustado con t() u helpers equivalentes conectados a tu proveedor.

  7. Envía a Git

    Fusiona la rama y envía para que globalize.now pueda mantener las traducciones sincronizadas en pushes a Git posteriores.

Problemas comunes

next-intl espera una estructura de mensaje específica

Resolución: globalize.now detecta automáticamente la convención de next-intl y escribe JSON que coincida con tus carpetas de locale configuradas, reduciendo la reformulación manual.

Ya tengo algunas cadenas traducidas — ¿sobrescribirá globalize.now?

Resolución: Las claves existentes se preservan siempre que sea posible, y los nuevos literales se añaden incrementalmente para que los traductores no pierdan trabajo anterior.

Preguntas frecuentes

¿Funciona globalize.now con next-intl y next-i18next?

Sí. globalize.now se enfoca en la estructura del repositorio — claves, catálogos JSON y sitios de llamada de componentes — mientras que next-intl o next-i18next continúa cargando mensajes en tiempo de ejecución. Elige el runtime que coincida con tu modelo de enrutamiento; globalize.now adapta su salida a esa elección. Aún ejecutas npx globalize-skills una vez por bootstrap de proyecto a menos que intencionalmente actualices los skills.

¿Admite globalize.now tanto App Router como Pages Router?

Sí. El agente detecta el estilo de router que usas y alinea la extracción con los archivos de layout, route handlers y providers correctos. globalize.now no reemplaza el routing de Next.js; asegura que las cadenas que fluyen a través de esas rutas estén codificadas. Después de la configuración, tanto los server components como los client components de App Router hacen referencia a los mismos archivos de locale que tu runtime espera.

¿Puedo usar globalize.now con una app de Next.js que ya tiene i18n parcial?

Sí. Apunta el agente al repo y extenderá los bundles de mensajes existentes, rellenando los huecos donde aún hay literales. Es común cuando solo se tradujeron primero las páginas de marketing. globalize.now fusiona nuevas claves sin descartar traducciones antiguas, así que los equipos pueden migrar pantalla por pantalla.

¿globalize.now maneja diferente los server components y los client components?

globalize.now reescribe los literales con el helper que tu stack usa en cada límite, respetando las reglas de Next.js sobre dónde pueden ejecutarse hooks y providers. La salida JSON se mantiene compartida entre los bundles de server y client para que no dupliques catálogos. Aún así sigues la documentación de Next.js para marcar client components cuando la interactividad lo requiere.

¿Cómo se integra globalize.now con la generación estática de Next.js?

Los archivos de locale viven en Git, así que `next build` sigue empaquetando el mismo JSON que tus rutas SSG o SSR ya importan a través de next-intl. globalize.now no cambia el pipeline de generación estática más allá de asegurar que las cadenas provengan de archivos de datos en lugar de literales. Cuando nuevo contenido se lanza, otro push a Git refresca las traducciones antes del siguiente despliegue.

¿Debo instalar next-intl antes de ejecutar npx globalize-skills?

Instalar next-intl primero es ideal cuando ya sabes que es tu runtime, porque el agente puede conectar los providers inmediatamente. Si aún no has elegido una biblioteca, aún puedes ejecutar npx globalize-skills — los skills ayudan a recomendar un stack — pero quizá tengas que ejecutar la configuración de nuevo después de instalar dependencias. Ambos caminos terminan con claves guardadas en Git y sincronización en cada push.

Prueba globalize.now con Next.js

Comienza desde la raíz de tu proyecto:

npx globalize-skills

Vuelve a la página de inicio para contexto de producto y precios →

Otras integraciones

Empieza gratis