chore(gelistirme): frontend servisini docker compose yapisina ekle

README.md

@@ -25,6 +25,7 @@ docker compose -f docker-compose.dev.yml up --build
 ```
 
 API şu adreste çalışacak: `http://localhost:3000`
+Frontend şu adreste çalışacak: `http://localhost:5173`
 
 ## API Kullanımı
 

docker-compose.dev.yml

@@ -48,6 +48,25 @@ services:
     networks:
       - netflix-scraper-network
 
+  frontend:
+    image: node:20-alpine
+    container_name: netflix-scraper-frontend-dev
+    restart: unless-stopped
+    working_dir: /app
+    ports:
+      - "5173:5173"
+    environment:
+      - VITE_API_PROXY_TARGET=http://app:3000
+    command: sh -c "npm install && npm run dev -- --host 0.0.0.0 --port 5173"
+    volumes:
+      - ./frontend:/app:delegated
+      - frontend_node_modules_data:/app/node_modules
+    depends_on:
+      app:
+        condition: service_healthy
+    networks:
+      - netflix-scraper-network
+
   postgres:
     image: postgres:16-alpine
     container_name: netflix-scraper-postgres-dev
@@ -89,6 +108,7 @@ volumes:
   postgres_data_dev:
   redis_data_dev:
   node_modules_data:
+  frontend_node_modules_data:
 
 networks:
   netflix-scraper-network:

frontend/vite.config.ts

@@ -1,18 +1,21 @@
 import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react'
 
+const apiTarget = process.env.VITE_API_PROXY_TARGET || 'http://localhost:3000'
+
 // https://vite.dev/config/
 export default defineConfig({
   plugins: [react()],
   server: {
     port: 5173,
+    host: '0.0.0.0',
     proxy: {
       '/api': {
-        target: 'http://localhost:3000',
+        target: apiTarget,
         changeOrigin: true,
       },
       '/socket.io': {
-        target: 'http://localhost:3000',
+        target: apiTarget,
         changeOrigin: true,
         ws: true,
       },