Despliegue en producción

Cómo desplegar tu app de React con GT.

Descripción general

Este es un breve tutorial para ayudarte a implementar tu app de React con GT.

En total, esto debería llevar menos de 5 minutos.

Lo haremos en 3 pasos:

Agrega tus claves de API de producción.

Ejecuta el comando gtx-cli configure para configurar tu proyecto.

Agrega el comando translate a tu script de compilación.

Requisitos previos

Supondremos que ya has configurado tu app de React con GT. Si no, primero configura tu proyecto siguiendo la Guía de inicio rápido.

Paso 1: Cambia a tus claves de API de producción 🔑

Para desplegar tu app en producción, necesitarás usar una clave de API de producción.

Desde tu dashboard, ve a API Keys en la barra lateral. Haz clic en Create API Key y agrégala a tu entorno de producción.

GT_API_KEY="YOUR_GT_API_KEY"
GT_PROJECT_ID="YOUR_GT_PROJECT_ID"

¡Protege tus API Keys!

Las claves de producción solo deben usarse en producción. Del mismo modo, las claves de desarrollo solo deben usarse en desarrollo. ¡Nunca subas tus claves de API a un repositorio público!

Paso 2: Ejecuta el comando gtx-cli configure 🔧

Si ya ejecutaste el asistente de configuración, puedes omitir este paso. El asistente de configuración ya habrá ejecutado el comando gtx-cli configure por ti.

Ejecuta el comando gtx-cli configure para configurar tu proyecto.

npx gtx-cli configure

Si no deseas que tus traducciones se alojen en el GT CDN (Red de distribución de contenidos), selecciona «No» cuando se te pregunte. También deberás configurar la función loadTranslations.

Paso 3: Añade el comando translate a tu script de build 🏗️

El último paso es añadir el comando translate a tu script de build. Asegúrate de que el comando translate vaya antes del comando build.

package.json
{
  "scripts": {
    "build": "npx gtx-cli translate && <...TU_COMANDO_DE COMPILACIÓN...>"
  }
}

¡Listo! Ahora, cuando despliegues tu app a producción y ejecutes npm run build, tu proyecto se traducirá automáticamente y se desplegará junto con tu app.


Próximos pasos

  • Consulta la documentación de la CLI para obtener más información sobre la herramienta CLI.
  • Conoce las diferentes options de configuración de la herramienta CLI aquí.
  • Lee sobre la diferencia entre los entornos de producción y desarrollo aquí.

¿Qué te parece esta guía?