Last updated
Enable Mapbox
By default, the template uses Mapbox for showing interactive maps. This guide will help you create a Mapbox account and assign the access token to an environment variable.
Table of Contents
Generate a Mapbox access token
Sign up to Mapbox and go to
the account page. Then copy the
Default public token
.
If you wish to create a new one, click + Create a token
, give it a
name and make sure all Public scopes are selected. Create the token and
copy its value.
You can make access tokens in your web applications more secure by adding URL restrictions. When you add a URL restriction to a token, that token will only work for requests that originate from the URLs you specify. See the Mapbox documentation for URL restrictions.
Update the API key in Console
If you are using a version of the template v3.4.0 or newer, you can set the API key in the Sharetribe Console.
-
In Sharetribe Console, navigate to Integrations > Map
-
Select "Mapbox"
-
Paste the token into the field
-
Press "Save changes"
Read more in our article on how to set up Mapbox or Google Maps for location services.
You can also choose to assign the map key to an environment variable. However, if you enable the API key configuration through Console, the settings in Console will overwrite the keys stored in environment variables, assuming that you have not made changes to how the template handles loading configurations via assets.
Assign the access token to an environment variable
If you are using a version of the template older than v3.4.0, you need to assign the Mapbox API key to an environment variable.
The template uses the REACT_APP_MAPBOX_ACCESS_TOKEN
environment
variable for the token value. For local development, you can add the
variable in the gitignored .env
file in the project root:
REACT_APP_MAPBOX_ACCESS_TOKEN=my-access-token-here
Further reading
Once you have enabled maps in your marketplace using your chosen map provider, you can change the map's configuration settings. These options allow you to change things like the default search locations and restrict location search to specific countries. Refer to the map configurations article to learn more about the specific configurations you can adjust for maps in your marketplace.