Bereitstellung in der Produktion

So setzen Sie Ihre React-App mit GT in Produktion ein.

Übersicht

Dies ist ein kurzes Tutorial, das Ihnen hilft, Ihre React-App mit GT bereitzustellen.

Insgesamt sollte dies weniger als 5 Minuten dauern.

Wir erledigen dies in 3 Schritten:

Fügen Sie Ihre produktiven API-Schlüssel hinzu.

Führen Sie den Befehl gtx-cli configure aus, um Ihr Projekt zu konfigurieren.

Fügen Sie den translate-Befehl zu Ihrem Build-Skript hinzu.

Voraussetzungen

Wir gehen davon aus, dass Ihre React-App bereits mit GT eingerichtet ist. Falls nicht, richten Sie Ihr Projekt zunächst ein, indem Sie der Schnellstartanleitung folgen.

Schritt 1: Auf Produktions-API-Schlüssel umschalten 🔑

Um deine App für die Produktion bereitzustellen, musst du einen Produktions-API-Schlüssel verwenden.

Wechsle in deinem Dashboard in der Seitenleiste zu API Keys. Klicke auf Create API Key und füge ihn deiner Produktionsumgebung hinzu.

GT_API_KEY="YOUR_GT_API_KEY"
GT_PROJECT_ID="YOUR_GT_PROJECT_ID"

Schützen Sie Ihre API-Schlüssel!

Produktionsschlüssel sollten nur in der Produktion verwendet werden. Ebenso sollten Entwicklungsschlüssel nur in der Entwicklung verwendet werden. Committen Sie Ihre API-Schlüssel niemals in ein öffentliches Repository!

Schritt 2: Führe den Befehl gtx-cli configure aus 🔧

Wenn du den Einrichtungsassistenten bereits ausgeführt hast, kannst du diesen Schritt überspringen. Der Einrichtungsassistent hat den Befehl gtx-cli configure bereits für dich ausgeführt.

Führe den Befehl gtx-cli configure aus, um dein Projekt zu konfigurieren.

npx gtx-cli konfigurieren

Wenn Sie nicht möchten, dass Ihre Übersetzungen über das GT‑CDN (Content Delivery Network) bereitgestellt werden, wählen Sie bei der Abfrage „No“. Sie müssen außerdem die Funktion loadTranslations konfigurieren.

Schritt 3: Fügen Sie den translate-Befehl zu Ihrem Build-Skript hinzu 🏗️

Der letzte Schritt besteht darin, den translate-Befehl zu Ihrem Build-Skript hinzuzufügen. Stellen Sie sicher, dass der translate-Befehl vor dem Build-Befehl ausgeführt wird.

package.json
{
  "scripts": {
    "build": "npx gtx-cli translate && <...IHR_BUILD_COMMAND...>"
  }
}

Das war’s! Wenn du deine App jetzt für die Produktion bereitstellst und npm run build ausführst, wird dein Projekt automatisch übersetzt und zusammen mit deiner App bereitgestellt.


Nächste Schritte

  • Siehe die CLI-Dokumentation für weitere Informationen zum CLI-Tool.
  • Erfahren Sie mehr über die verschiedenen options für das CLI-Tool hier.
  • Lesen Sie mehr über den Unterschied zwischen Produktions- und Entwicklungsumgebungen hier.

Wie ist diese Anleitung?