diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000..f5d917b
Binary files /dev/null and b/.DS_Store differ
diff --git a/docker-compose.prod.yml b/docker-compose.prod.yml
index fe9c167..63be4d2 100644
--- a/docker-compose.prod.yml
+++ b/docker-compose.prod.yml
@@ -38,7 +38,7 @@ services:
     depends_on:
       - backend
     ports:
-      - "5173:5173"
+      - "5173:80"
     restart: unless-stopped
 
   rtmp:
diff --git a/docker-compose.yml b/docker-compose.yml
index cc38d19..a4d90da 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -37,7 +37,7 @@ services:
     depends_on:
       - backend
     ports:
-      - "5173:5173"
+      - "5173:80"
     restart: unless-stopped
 
   rtmp:
diff --git a/frontend/Dockerfile b/frontend/Dockerfile
index fdf971e..d005479 100644
--- a/frontend/Dockerfile
+++ b/frontend/Dockerfile
@@ -1,9 +1,18 @@
-FROM node:20-alpine
-
+# --- Build stage ---
+FROM node:20-alpine AS build
 WORKDIR /app
 COPY package*.json ./
 RUN --mount=type=cache,target=/root/.npm npm ci
-
 COPY . .
-EXPOSE 5173
-CMD ["npm", "run", "dev"]
\ No newline at end of file
+RUN npm run build
+
+# --- Production stage ---
+FROM nginx:1.27-alpine AS prod
+COPY --from=build /app/dist /usr/share/nginx/html
+
+# Inject envs at runtime
+COPY env.sh /docker-entrypoint.d/40-env.sh
+RUN chmod +x /docker-entrypoint.d/40-env.sh
+
+EXPOSE 80
+CMD ["nginx", "-g", "daemon off;"]
\ No newline at end of file
diff --git a/frontend/env.sh b/frontend/env.sh
new file mode 100644
index 0000000..2142bf5
--- /dev/null
+++ b/frontend/env.sh
@@ -0,0 +1,10 @@
+#!/bin/sh
+set -eu
+
+cat <<EOF > /usr/share/nginx/html/env-config.js
+window._env_ = {
+  VITE_API_URL: "${VITE_API_URL:-}",
+  VITE_FRONTEND_URL: "${VITE_FRONTEND_URL:-}",
+  VITE_GOOGLE_CLIENT_ID: "${VITE_GOOGLE_CLIENT_ID:-}"
+};
+EOF
\ No newline at end of file
diff --git a/frontend/index.html b/frontend/index.html
index 1dd4518..3a9b00f 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -9,6 +9,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Newsreader:wght@100;200;300;400;500;600;700&family=IBM+Plex+Sans:wght@100;200;300;400;500;600;700&family=IBM+Plex+Mono:wght@100;200;300;400;500;600;700&display=swap" rel="stylesheet">
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <script src="/env-config.js"></script>
     <title>The VoD System</title>
   </head>
   <body>
diff --git a/frontend/src/config.ts b/frontend/src/config.ts
new file mode 100644
index 0000000..eeb871c
--- /dev/null
+++ b/frontend/src/config.ts
@@ -0,0 +1,5 @@
+export const config = {
+    apiUrl: window._env_?.VITE_API_URL ?? import.meta.env.VITE_API_URL ?? '',
+    frontendUrl: window._env_?.VITE_FRONTEND_URL ?? import.meta.env.VITE_FRONTEND_URL ?? '',
+    googleClientId: window._env_?.VITE_GOOGLE_CLIENT_ID ?? import.meta.env.VITE_GOOGLE_CLIENT_ID ?? '',
+};
\ No newline at end of file
diff --git a/frontend/src/vite-env.d.ts b/frontend/src/vite-env.d.ts
index 151aa68..f6d268d 100644
--- a/frontend/src/vite-env.d.ts
+++ b/frontend/src/vite-env.d.ts
@@ -1 +1,9 @@
-/// <reference types="vite/client" />
\ No newline at end of file
+/// <reference types="vite/client" />
+
+interface Window {
+    _env_?: {
+        VITE_API_URL?: string;
+        VITE_FRONTEND_URL?: string;
+        VITE_GOOGLE_CLIENT_ID?: string;
+    };
+}
\ No newline at end of file