diff --git a/.env b/.env
index 6a9a3cc..c2c8d5d 100644
--- a/.env
+++ b/.env
@@ -21,7 +21,7 @@ POSTGRES_DB=postgres
 POSTGRES_USER=postgres
 POSTGRES_PASSWORD=postgres
 # expose postgres on localhost for dev
-# POSTGRES_EXPOSE=127.0.0.1:5432
+POSTGRES_EXPOSE=127.0.0.1:5432
 
 # The top-level domain used for Open Food Facts,
 # it's either `net` (staging) or `org` (production) 
diff --git a/interface/.env b/interface/.env
new file mode 100644
index 0000000..759b102
--- /dev/null
+++ b/interface/.env
@@ -0,0 +1,8 @@
+# Dev Mode
+# ---------
+VITE_DEVELOPPEMENT_MODE = "development"
+# VITE_DEVELOPPEMENT_MODE = ""
+
+# ApiUrl
+# ------
+VITE_API_URL = "http://localhost:8000"
\ No newline at end of file
diff --git a/interface/components/ArchiveButton.tsx b/interface/components/ArchiveButton.tsx
index bb2c703..109f01d 100644
--- a/interface/components/ArchiveButton.tsx
+++ b/interface/components/ArchiveButton.tsx
@@ -3,7 +3,7 @@ import Button from '@mui/material/Button';
 
 // Change status of ticket to archived
 function handleArchive(id: number) {
-    axios.put(`http://localhost:8000/tickets/${id}/status?status=archived`)
+    axios.put(`${import.meta.env.VITE_API_URL}/tickets/${id}/status?status=archived`)
     window.location.reload();
 }
 
diff --git a/interface/components/CloseButton.tsx b/interface/components/CloseButton.tsx
index e0dff74..08f795f 100644
--- a/interface/components/CloseButton.tsx
+++ b/interface/components/CloseButton.tsx
@@ -4,7 +4,7 @@ import Button from '@mui/material/Button';
 
 // Change status of ticket to closed
 function handleClose(id: number) {
-    axios.put(`http://localhost:8000/tickets/${id}/status?status=closed`)
+    axios.put(`${import.meta.env.VITE_API_URL}/tickets/${id}/status?status=closed`)
     window.location.reload();
 }
 
diff --git a/interface/pages/ModerationPage.tsx b/interface/pages/ModerationPage.tsx
index a375277..ade7271 100644
--- a/interface/pages/ModerationPage.tsx
+++ b/interface/pages/ModerationPage.tsx
@@ -15,7 +15,7 @@ export default function ModerationPage() {
 
     useEffect(() => {
         // send get request to api to get tickets and set Tickets to the response
-        axios.get('http://localhost:8000/tickets').then((res) => {
+        axios.get(`${import.meta.env.VITE_API_URL}/tickets`).then((res) => {
             setTickets(res.data.tickets)
         })
     }, [])
diff --git a/interface/src/App.tsx b/interface/src/App.tsx
index 787aa53..ab4a96c 100644
--- a/interface/src/App.tsx
+++ b/interface/src/App.tsx
@@ -16,7 +16,8 @@ import NotFound from "../pages/NotFound.tsx";
 export default function App() {
 
   // turn in to true to test the moderation page - it will always be logged in
-  const devMode = false;
+  const devMode = (import.meta.env.VITE_DEVELOPPEMENT_MODE === "development");
+  
 
   const [userState, setUserState] = useState(() => {
     if (devMode) {