HCL Commerce Version or later

Enabling a Google API key for Next.js stores

To use Google Maps in a Next.js store, the store build process requires a Google API key access.

This access enables the following services for a Next.js store.
  • Directions API
  • Distance Matrix API
  • Maps JavaScript API
  • Places API


To add a Google API key to the store:
  1. Configure the APIs on your Google account.
    1. Enable the Google API on the Enable and disable APIs page of your Google account.
    2. Configure the Google API on the Setting up API keys page of your Google account.
  2. Export the environment variable MAP_API_KEY=<your-google-API-key>.
    1. Development environment: Set MAP_API_KEY=<your-google-API-key> in .env.local file.
    2. Production environment: Set or export MAP_API_KEY=<your-google-API-key> system environment variable for your container.
    Note: Refers to the actual Google API key fetched in Step 1.a.
  3. Start development server or production server.


Once the API key is enabled, users can access the Google Maps with the Store Locator feature.
Note: To start the Nextjs (Ruby) store Docker container, see Starting the Nextjs (Ruby) store Docker container by retrieving parameters from Vault.