You're absolutely right! Backend should also be in Docker if frontend is.
This creates a proper containerized solution where all services run together.
Changes:
• Created api/Dockerfile with Python 3.11 slim base
- Installs requirements.txt
- Copies api/main.py and models/
- Runs uvicorn on 0.0.0.0:8000
- Includes Python health check
• Created api/.dockerignore for build optimization
• Updated docker-compose.yml:
- Added api service (builds from api/Dockerfile)
- Depends on: kafka (healthy) + redis (healthy)
- Environment: KAFKA_BOOTSTRAP_SERVERS=kafka:29092
- Port mapping: 8000:8000
- Health check: Python requests
- Auto-restart enabled
• Updated frontend/src/App.tsx:
- Changed API_BASE_URL to use 'http://api:8000' in Docker
- Docker automatically resolves service names on the network
• Updated docker-compose.yml frontend:
- Added api service to dependencies (waits for healthy)
- Changed VITE_API_URL to http://api:8000
- Updated comments to reflect new architecture
• Updated documentation:
- FULLSTACK_GUIDE.md - Now 2-terminal setup!
- DOCKER_QUICK_START.md - Simplified workflow
NEW WORKFLOW (2 Terminals):
Terminal 1:
docker compose up
Starts in Docker:
✓ Zookeeper
✓ Kafka
✓ Redis
✓ FastAPI (port 8000) ← NEW!
✓ React Frontend (port 3000)
Terminal 2:
cd consumer && python pipeline.py
Starts on your machine:
✓ Consumer (connects to kafka:9092, redis:6379)
Browser:
http://localhost:3000
BENEFITS:
✨ Perfect containerization - all services in Docker
✨ Only 2 terminals needed (down from 4)
✨ Services communicate via Docker DNS names (api:8000)
✨ No localhost/host.docker.internal networking complexity
✨ Frontend waits for API to be healthy before starting
✨ Consumer still runs on host for development flexibility
✨ Production-ready setup
Co-authored-by: Copilot <[email protected]>
107 lines
2.5 KiB
YAML
107 lines
2.5 KiB
YAML
version: "3.8"
|
|
|
|
services:
|
|
zookeeper:
|
|
image: confluentinc/cp-zookeeper:7.5.0
|
|
environment:
|
|
ZOOKEEPER_CLIENT_PORT: 2181
|
|
ZOOKEEPER_TICK_TIME: 2000
|
|
ports:
|
|
- "2181:2181"
|
|
networks:
|
|
- payguard-network
|
|
|
|
kafka:
|
|
image: confluentinc/cp-kafka:7.5.0
|
|
depends_on:
|
|
- zookeeper
|
|
ports:
|
|
- "9092:9092"
|
|
environment:
|
|
KAFKA_BROKER_ID: 1
|
|
KAFKA_ZOOKEEPER_CONNECT: zookeeper:2181
|
|
KAFKA_ADVERTISED_LISTENERS: PLAINTEXT://kafka:29092,PLAINTEXT_HOST://localhost:9092
|
|
KAFKA_LISTENER_SECURITY_PROTOCOL_MAP: PLAINTEXT:PLAINTEXT,PLAINTEXT_HOST:PLAINTEXT
|
|
KAFKA_INTER_BROKER_LISTENER_NAME: PLAINTEXT
|
|
KAFKA_OFFSETS_TOPIC_REPLICATION_FACTOR: 1
|
|
KAFKA_AUTO_CREATE_TOPICS_ENABLE: "true"
|
|
networks:
|
|
- payguard-network
|
|
healthcheck:
|
|
test: kafka-broker-api-versions --bootstrap-server localhost:9092
|
|
interval: 10s
|
|
timeout: 5s
|
|
retries: 5
|
|
|
|
redis:
|
|
image: redis:7.2-alpine
|
|
ports:
|
|
- "6379:6379"
|
|
networks:
|
|
- payguard-network
|
|
healthcheck:
|
|
test: redis-cli ping
|
|
interval: 10s
|
|
timeout: 5s
|
|
retries: 5
|
|
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
|
|
dockerfile: Dockerfile
|
|
ports:
|
|
- "3000:3000"
|
|
networks:
|
|
- payguard-network
|
|
depends_on:
|
|
kafka:
|
|
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
|
|
timeout: 5s
|
|
retries: 5
|
|
environment:
|
|
- NODE_ENV=production
|
|
- VITE_API_URL=http://api:8000
|
|
restart: unless-stopped
|
|
# 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:
|
|
|
|
networks:
|
|
payguard-network:
|
|
driver: bridge
|