diff --git a/.github/workflows/android.yml b/.github/workflows/android.yml
index 8b30b1118..a609560c6 100644
--- a/.github/workflows/android.yml
+++ b/.github/workflows/android.yml
@@ -47,6 +47,9 @@ jobs:
       - name: Build translations
         run: |
           npm run build:translations
+      - name: Build env files
+        run: |
+          npm run build:env
       - name: Frontend Tests
         run: |
           npm test
diff --git a/.gitignore b/.gitignore
index 45edb0a3a..1b13068c9 100644
--- a/.gitignore
+++ b/.gitignore
@@ -78,6 +78,7 @@ buck-out/
 # Private env variables
 .env
 .bitrise.secrets.yml
+env.js
 
 # nodejs-mobile assets generated by build script
 # TODO: somehow modify gradle build scripts so that these can be stored in
diff --git a/bitrise.yml b/bitrise.yml
index 28ac9966e..d98284814 100644
--- a/bitrise.yml
+++ b/bitrise.yml
@@ -323,6 +323,11 @@ workflows:
           inputs:
             - npm_version: ""
             - command: run build:translations
+      - npm@1.1:
+          title: Build environment variables
+          inputs:
+            - npm_version: ""
+            - command: run build:env
       - script@1.2.0:
           title: Set version name & code
           inputs:
diff --git a/package.json b/package.json
index 36ec3b4c1..f279b6430 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
     "android-no-backend-rebuild": "react-native run-android --variant=appDebug --appIdSuffix=debug",
     "android-storybook": "react-native run-android --variant=storybookDebug --appIdSuffix=storybook.debug",
     "android-icca": "RN_SRC_EXT=icca react-native run-android --variant=iccaDebug --appIdSuffix=icca.debug",
+    "build:env": "node ./scripts/build-env.js",
     "build:backend": "./scripts/build-backend.sh",
     "build:intl-polyfills": "node ./scripts/build-intl-polyfills.js",
     "build:translations": "node ./scripts/build-translations.js && npm run build:intl-polyfills",
diff --git a/scripts/build-env.js b/scripts/build-env.js
new file mode 100644
index 000000000..320d96bdd
--- /dev/null
+++ b/scripts/build-env.js
@@ -0,0 +1,34 @@
+const fs = require("fs");
+const path = require("path");
+
+// Path to your .env file
+const envPath = path.resolve(__dirname, "../.env");
+
+// Read the contents of the .env file
+const envFileContent = fs.readFileSync(envPath, "utf8");
+
+// Split the file contents into lines
+const lines = envFileContent.split("\n");
+
+// Create an object to hold the environment variables
+const envVariables = {};
+
+// Iterate over each line and set environment variables
+lines.forEach(line => {
+  // Skip empty lines and comments
+  if (line.trim() !== "" && !line.startsWith("#")) {
+    // Split the line into key-value pairs
+    const [key, value] = line.split("=");
+    // Set the environment variable in the object
+    envVariables[key.trim()] = value.trim();
+  }
+});
+
+// Convert the object to a string representation
+const envString = JSON.stringify(envVariables, null, 4);
+
+// Write the environment variables to a JavaScript file
+const outputPath = path.resolve(__dirname, "../env.js");
+fs.writeFileSync(outputPath, `export default ${envString};`, "utf8");
+
+console.log("Environment variables injected into env.js");
diff --git a/src/config.json b/src/config.json
deleted file mode 100644
index 7afaaf204..000000000
--- a/src/config.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "mapboxAccessToken": "pk.eyJ1IjoiZ21hY2xlbm5hbiIsImEiOiJSaWVtd2lRIn0.ASYMZE2HhwkAw4Vt7SavEg"
-}
diff --git a/src/frontend/hooks/useMapAvailability.ts b/src/frontend/hooks/useMapAvailability.ts
index 5d33cafb2..68478ae3d 100644
--- a/src/frontend/hooks/useMapAvailability.ts
+++ b/src/frontend/hooks/useMapAvailability.ts
@@ -4,12 +4,12 @@ import MapboxGL from "@react-native-mapbox-gl/maps";
 
 import api from "../api";
 import { normalizeStyleURL } from "../lib/mapbox";
-import config from "../../config.json";
+import env from "../../../env";
 
 /** URL used for map style when no custom map and user is online */
 export const onlineStyleURL = normalizeStyleURL(
   MapboxGL.StyleURL.Outdoors + "?" + Date.now(),
-  config.mapboxAccessToken
+  env.MAPBOX_ACCESS_TOKEN
 );
 
 export type MapAvailability = "unknown" | "available" | "unavailable";
diff --git a/src/frontend/sharedComponents/Map/MapView.js b/src/frontend/sharedComponents/Map/MapView.js
index b89818aaa..dc34a524f 100644
--- a/src/frontend/sharedComponents/Map/MapView.js
+++ b/src/frontend/sharedComponents/Map/MapView.js
@@ -13,9 +13,9 @@ import type { LocationContextType } from "../../context/LocationContext";
 import type { ObservationsMap } from "../../context/ObservationsContext";
 import { useIsFullyFocused } from "../../hooks/useIsFullyFocused";
 import bugsnag from "../../lib/logger";
-import config from "../../../config.json";
 import { OfflineMapLayers } from "../OfflineMapLayers";
 import { UserLocation } from "./UserLocation";
+import env from "../../../../env";
 
 // This is the default zoom used when the map first loads, and also the zoom
 // that the map will zoom to if the user clicks the "Locate" button and the
@@ -38,7 +38,7 @@ Logger.setLogCallback(log => {
   );
 });
 
-MapboxGL.setAccessToken(config.mapboxAccessToken);
+MapboxGL.setAccessToken(env.MAPBOX_ACCESS_TOKEN);
 // Forces Mapbox to always be in connected state, rather than reading system
 // connectivity state
 MapboxGL.setConnected(true);