Deploying to Production (5m)

Overview

This is a short tutorial to help you deploy your react app with GT.

We will do this in 3 steps:

Prerequisites

Make sure that you have followed the Quick Start Guide to set up your react app with GT.

Step 1: Switch to your production API keys 🔑

Add your production API key and Project ID to your production environment variables.

From your dashboard, go to API Keys in the sidebar. Click on Create API Key, and add them to your production envrionment.

GT_API_KEY="YOUR_GT_API_KEY"
GT_PROJECT_ID="YOUR_GT_PROJECT_ID"

Step 2: Run the init command 🔧

Run the init command to configure your project.

npx gtx-cli init

Step 3: Share your configuration with your app ⚙️

The init command will generate a configuration file in the root.

Pass the config file to <GTProvider>. If you have specified any locales in your provider, remove them. The configuration file will take care of that.

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

Step 4: Add the translate command to your build script 🏗️

The last step is to add the translate command to your build script. Make sure that the translate command comes before the build command.

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

That's it! You are now ready to deploy your react app with GT!

Next steps

• See the CLI docs for more information on the CLI tool.
• Learn how to Translate Strings.
• Learn about the <T> component.