Deploy to Production
Let's deploy your Next.js app with GT.
Overview
This is a short tutorial to help you deploy your Next.js app with GT.
In total, this should take less than 5 minutes to complete.
We will do this in 3 steps:
Add your production API keys.
Run the gtx-cli configure
command to configure your project.
Add the translate command to your build script.
Prerequisites
We'll assume that you have already setup your Next.js app with GT. If you haven't, first setup your project by following the Quick Start Guide.
Step 1: Add your production API keys 🔑
To deploy your app to production, you'll need to use a production API key.
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"
Protect Your API Keys!
Production keys should only ever be used in production. Likewise, development keys should only ever be used in development. Never commit your API keys to a public repository!
Step 2: Run the gtx-cli configure
command 🔧
If you've previously run the Setup Wizard, you can skip this step.
The setup wizard will have already run the gtx-cli configure
command for you.
Run the gtx-cli configure
command to configure your project.
npx gtx-cli configure
If you do not want your translations to be hosted on the GT CDN, select "No" when asked.
You will also need to configure the loadTranslations()
function.
Step 3: 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! Now, when you deploy your app to production and run npm run build
,
your project will be automatically translated and deployed alongside your app.
Next steps
How is this guide?