diff --git a/packages/builder/src/pages/builder/portal/manage/envVars/index.svelte b/packages/builder/src/pages/builder/portal/manage/envVars/index.svelte
new file mode 100644
index 0000000000..9fb19fe676
--- /dev/null
+++ b/packages/builder/src/pages/builder/portal/manage/envVars/index.svelte
@@ -0,0 +1,39 @@
+
+
+
+
+ Envrironment Variables
+ Add and manage environment variable for development and production
+
+
+
+ {#each $envVars as envVar}
+
+ {envVar}
+
+
+ {/each}
+
+
+
+
diff --git a/packages/builder/src/stores/portal/envVars.js b/packages/builder/src/stores/portal/envVars.js
new file mode 100644
index 0000000000..9c9880511a
--- /dev/null
+++ b/packages/builder/src/stores/portal/envVars.js
@@ -0,0 +1,20 @@
+import { writable } from "svelte/store"
+import { API } from "api"
+
+export function createEnvVarsStore() {
+ const { subscribe, set, update } = writable([])
+
+ async function load() {
+ const envVars = await API.fetchEnvVars()
+
+ let testVars = ['blah', 'blah123']
+ set(testVars)
+ }
+
+ return {
+ subscribe,
+ load,
+ }
+}
+
+export const envVars = createEnvVarsStore()
diff --git a/packages/frontend-core/src/api/envVars.js b/packages/frontend-core/src/api/envVars.js
new file mode 100644
index 0000000000..5f02a2b889
--- /dev/null
+++ b/packages/frontend-core/src/api/envVars.js
@@ -0,0 +1,11 @@
+export const buildEnvironmentVariableEndpoints = API => ({
+ /**
+ * Fetches a list of environment variables
+ */
+ fetchEnvVars: async () => {
+ return await API.get({
+ url: `/api/env/variables`,
+ json: false,
+ })
+ }
+})