diff --git a/FULLSTACK_GUIDE.md b/FULLSTACK_GUIDE.md index a72f300..e4c2e67 100644 --- a/FULLSTACK_GUIDE.md +++ b/FULLSTACK_GUIDE.md @@ -1,26 +1,22 @@ -# PayGuard Full Stack - API + Frontend Setup +# PayGuard Full Stack - Docker-Complete Setup -Complete guide for running the PayGuard fraud detection system with the React web interface. +Complete guide for running the entire PayGuard fraud detection system in Docker. -## 🎉 FASTEST START - Docker-Integrated Frontend +## 🎉 COMPLETE DOCKER SETUP - Everything in Containers! -**NEW**: The React frontend is now integrated into Docker Compose! +**NEW**: All services now run in Docker (infrastructure + API + frontend)! ```bash -# Start EVERYTHING (infrastructure + frontend) with ONE command +# Start EVERYTHING with ONE command docker compose up -# In another terminal, start the API -source venv/bin/activate -uvicorn api.main:app --reload - -# In another terminal, start the consumer +# In another terminal, start just the consumer cd consumer && python pipeline.py # Open browser: http://localhost:3000 ``` -✨ **No manual npm dev server needed!** The frontend runs as an optimized production build inside Docker. +✨ **Perfect setup!** All services (Zookeeper, Kafka, Redis, API, Frontend) run in Docker. Only the Consumer (Python) runs on your machine for live development. For more details: See `DOCKER_QUICK_START.md` diff --git a/api/.dockerignore b/api/.dockerignore new file mode 100644 index 0000000..f79b062 --- /dev/null +++ b/api/.dockerignore @@ -0,0 +1,13 @@ +__pycache__ +*.pyc +*.pyo +*.egg-info +.pytest_cache +.coverage +.env +.venv +venv +.DS_Store +.git +.gitignore +README.md diff --git a/api/Dockerfile b/api/Dockerfile new file mode 100644 index 0000000..38daf84 --- /dev/null +++ b/api/Dockerfile @@ -0,0 +1,23 @@ +FROM python:3.11-slim + +WORKDIR /app + +# Install dependencies +COPY requirements.txt . +RUN pip install --no-cache-dir -r requirements.txt + +# Copy API code +COPY api/main.py . + +# Copy models +COPY models/ ./models/ + +# Expose port +EXPOSE 8000 + +# Health check +HEALTHCHECK --interval=10s --timeout=5s --retries=5 \ + CMD python -c "import requests; requests.get('http://localhost:8000/health')" + +# Run the application +CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "8000"] diff --git a/docker-compose.yml b/docker-compose.yml index 885d526..d9f944c 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -47,6 +47,29 @@ services: volumes: - redis_data:/data + api: + build: + context: ./api + dockerfile: Dockerfile + ports: + - "8000:8000" + networks: + - payguard-network + depends_on: + kafka: + condition: service_healthy + redis: + condition: service_healthy + environment: + - KAFKA_BOOTSTRAP_SERVERS=kafka:29092 + - REDIS_URL=redis://redis:6379 + healthcheck: + test: python -c "import requests; requests.get('http://localhost:8000/health')" || exit 1 + interval: 10s + timeout: 5s + retries: 5 + restart: unless-stopped + frontend: build: context: ./frontend @@ -60,6 +83,8 @@ services: condition: service_healthy redis: condition: service_healthy + api: + condition: service_healthy healthcheck: test: wget --quiet --tries=1 --spider http://localhost:3000 || exit 1 interval: 10s @@ -67,11 +92,11 @@ services: retries: 5 environment: - NODE_ENV=production - - VITE_API_URL=http://host.docker.internal:8000 + - VITE_API_URL=http://api:8000 restart: unless-stopped - # NOTE: Frontend connects to API running on host machine via host.docker.internal - # This allows docker compose up to start infrastructure + frontend, - # while API and Consumer run locally on the same machine + # NOTE: All services now run in Docker on the same network + # Frontend: http://api:8000 (Docker service name resolution) + # Consumer: Still runs on host, connects to kafka:29092 volumes: redis_data: diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 5a10102..bceffdd 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -28,10 +28,10 @@ interface Result { timestamp: string; } -// Use host.docker.internal when running in Docker, localhost when running locally +// Use Docker service name when in Docker, localhost when running locally const API_BASE_URL = process.env.NODE_ENV === 'production' - ? 'http://host.docker.internal:8000' - : 'http://localhost:8000'; + ? 'http://api:8000' // Docker: use service name (automatically resolves) + : 'http://localhost:8000'; // Dev: use localhost const App: React.FC = () => { const [auth, setAuth] = useState({