Desplegando a Producción (5m)

Resumen

Este es un breve tutorial para ayudarte a desplegar tu aplicación react con GT.

Haremos esto en 3 pasos:

Agrega tus claves API de producción.

Ejecuta el comando init para configurar tu proyecto.

Comparte tu configuración con tu aplicación.

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

Prerrequisitos

Asegúrate de haber seguido la Guía de Inicio Rápido para configurar tu aplicación react con GT.

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

Agrega tu clave API de producción y el ID del Proyecto a tus variables de entorno de producción.

Desde tu panel de control, ve a Claves API en la barra lateral. Haz clic en Crear Clave API y agrégalas a tu entorno de producción.

GT_API_KEY="YOUR_GT_API_KEY"
GT_PROJECT_ID="YOUR_GT_PROJECT_ID"

¡Protege tus claves API!

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

Paso 2: Ejecuta el comando init 🔧

Ejecuta el comando init para configurar tu proyecto.

npx gtx-cli init

Si no deseas que tus traducciones se alojen en el GT CDN, selecciona "Local" cuando se te pregunte dónde se almacenan tus archivos de idioma. También necesitarás configurar la función loadTranslations().

Paso 3: Comparte tu configuración con tu aplicación ⚙️

El comando init generará un archivo de configuración en la raíz.

Pasa el archivo de configuración a <GTProvider>. Si has especificado algún locale en tu proveedor, elimínalos. El archivo de configuración se encargará de eso.

src/App.js

import { GTProvider } from "gt-react";
import MyApp from "./MyApp";
import config from "../gt.config.json";  
 
export default function App() {
  return (
    <GTProvider {...config}> 
      <MyApp />
    </GTProvider> 
  );
}

Paso 4: Agrega el comando translate a tu script de construcción 🏗️

El último paso es agregar el comando translate a tu script de construcción. Asegúrate de que el comando translate venga antes del comando de construcción.

package.json

{
  "scripts": {
    "build": "npx gtx-cli translate && <YOUR_BUILD_COMMAND>"
  }
}

¡Eso es todo! ¡Ahora estás listo para desplegar tu aplicación react con GT!

Próximos pasos

Consulte la documentación de CLI para obtener más información sobre la herramienta CLI.
Aprenda cómo Traducir Cadenas.
Conozca el componente <T>.