diff --git a/.dockerignore b/.dockerignore
new file mode 100644
index 0000000..206a126
--- /dev/null
+++ b/.dockerignore
@@ -0,0 +1,63 @@
+# Version control
+.git
+.gitignore
+
+# Documentation
+README.md
+*.md
+
+# IDE and editor files
+.vscode/
+.idea/
+*.swp
+*.swo
+*~
+
+# OS generated files
+.DS_Store
+.DS_Store?
+._*
+.Spotlight-V100
+.Trashes
+ehthumbs.db
+Thumbs.db
+
+# Python
+__pycache__/
+*.py[cod]
+*$py.class
+*.so
+.Python
+build/
+develop-eggs/
+dist/
+downloads/
+eggs/
+.eggs/
+lib/
+lib64/
+parts/
+sdist/
+var/
+wheels/
+*.egg-info/
+.installed.cfg
+*.egg
+
+# Virtual environments
+venv/
+env/
+ENV/
+
+# Testing
+.pytest_cache/
+.coverage
+htmlcov/
+.tox/
+
+# Logs
+*.log
+
+# Temporary files
+*.tmp
+*.temp
\ No newline at end of file
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..b39e0aa
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,4 @@
+# Trivy security scanner files
+.trivy/
+trivy.yaml
+reports/
\ No newline at end of file
diff --git a/.img/1.png b/.img/1.png
new file mode 100644
index 0000000..a48c0ab
Binary files /dev/null and b/.img/1.png differ
diff --git a/.img/2.png b/.img/2.png
new file mode 100644
index 0000000..b391791
Binary files /dev/null and b/.img/2.png differ
diff --git a/.trivyignore b/.trivyignore
new file mode 100644
index 0000000..ba5fc95
--- /dev/null
+++ b/.trivyignore
@@ -0,0 +1,38 @@
+# Trivy ignore file
+# Format: https://aquasecurity.github.io/trivy/latest/docs/vulnerability/examples/filter/
+
+# Ignore test files and development dependencies
+**/test/**
+**/tests/**
+**/*test*
+**/node_modules/**
+**/.git/**
+**/.pytest_cache/**
+**/__pycache__/**
+
+# Ignore specific low-impact vulnerabilities (example)
+# CVE-2023-xxxxx
+
+# Ignore base image vulnerabilities that cannot be fixed
+# debian:bookworm-slim known issues
+# CVE-2024-xxxxx
+
+# Ignore supervisor-related root user requirement  
+AVD-DS-0002
+
+# Ignore documentation and example files
+**/docs/**
+**/examples/**
+**/*.md
+**/*.txt
+LICENSE
+README*
+
+# Ignore static assets
+**/static/**
+**/assets/**
+**/*.css
+**/*.js
+**/*.png
+**/*.jpg
+**/*.gif
\ No newline at end of file
diff --git a/Dockerfile b/Dockerfile
index b29e9a6..de88ab3 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -1,25 +1,42 @@
-FROM debian:stretch-slim
+FROM debian:bookworm-slim
 
-MAINTAINER Phillip Bailey <phillip@bailey.st>
+LABEL maintainer="Phillip Bailey"
 
-ENV DEBIAN_FRONTEND noninteractive
+ENV DEBIAN_FRONTEND=noninteractive
 
-RUN apt-get update && apt-get dist-upgrade && apt-get install -y \
-    python-pip python-dev uwsgi-plugin-python \
-    nginx supervisor
+RUN apt-get update && apt-get dist-upgrade -y && apt-get install -y --no-install-recommends \
+    python3-dev build-essential gcc \
+    nginx supervisor curl ca-certificates \
+    && apt-get clean \
+    && rm -rf /var/lib/apt/lists/*
+
+# Install uv
+COPY --from=ghcr.io/astral-sh/uv:latest /uv /usr/local/bin/uv
+
+# Create non-root user and add to www-data group
+RUN groupadd -r appuser && useradd -r -g appuser appuser \
+    && usermod -a -G www-data appuser
 
 COPY nginx/flask.conf /etc/nginx/sites-available/
 COPY supervisor/supervisord.conf /etc/supervisor/conf.d/supervisord.conf
 
 COPY app /var/www/app
 
-RUN mkdir -p /var/log/nginx/app /var/log/uwsgi/app /var/log/supervisor \
+RUN mkdir -p /var/log/nginx/app /var/log/supervisor \
     && rm /etc/nginx/sites-enabled/default \
     && ln -s /etc/nginx/sites-available/flask.conf /etc/nginx/sites-enabled/flask.conf \
     && echo "daemon off;" >> /etc/nginx/nginx.conf \
-    &&  pip install -r /var/www/app/requirements.txt \
-    && chown -R www-data:www-data /var/www/app \
-    && chown -R www-data:www-data /var/log
+    && sed -i 's|pid /run/nginx.pid;|pid /var/run/nginx.pid;|' /etc/nginx/nginx.conf \
+    && uv pip install --system --no-cache --break-system-packages -r /var/www/app/requirements.txt \
+    && chown -R appuser:appuser /var/www/app \
+    && chown -R appuser:appuser /var/log \
+    && chown -R appuser:appuser /var/run
+
+EXPOSE 8080
 
+HEALTHCHECK --interval=30s --timeout=10s --start-period=5s --retries=3 \
+  CMD curl -f http://localhost:8080/ || exit 1
 
-CMD ["/usr/bin/supervisord"]
+# Run as non-root user for security (nginx can now bind to non-privileged port 8080)
+USER appuser
+CMD ["/usr/bin/supervisord", "-c", "/etc/supervisor/conf.d/supervisord.conf"]
diff --git a/Makefile b/Makefile
new file mode 100644
index 0000000..eaf3192
--- /dev/null
+++ b/Makefile
@@ -0,0 +1,357 @@
+# Docker Flask Application Makefile
+# Variables
+IMAGE_NAME = docker-flask
+CONTAINER_NAME = flask-app
+COMPOSE_FILE = docker-compose.yml
+PORT = 8080
+
+# Security Configuration
+# Set to 'true' to enable security scanning and /security endpoint
+# Set to 'false' to disable security features for faster deployment
+ENABLE_SECURITY ?= true
+
+# Default target
+.DEFAULT_GOAL := help
+
+# Build targets
+.PHONY: build
+build: ## Build Docker image
+	docker build -t $(IMAGE_NAME) .
+
+.PHONY: build-no-cache
+build-no-cache: ## Build Docker image without cache
+	docker build --no-cache -t $(IMAGE_NAME) .
+
+# Run targets
+.PHONY: run
+run: rm ## Build and run container (with optional security scanning)
+ifeq ($(ENABLE_SECURITY),true)
+	@echo "Starting deployment with security scanning enabled..."
+	$(MAKE) trivy-pull build scan-json
+	@echo "Starting container with security reports..."
+	docker run -d --name $(CONTAINER_NAME) -p $(PORT):8080 $(IMAGE_NAME)
+	@echo "Updating security reports in running container..."
+	@sleep 3
+	$(MAKE) update-security-reports
+	@echo "Generating markdown security report..."
+	$(MAKE) scan-markdown
+	@echo "Container started successfully with latest security reports!"
+	@echo "Access application: http://localhost:8080"
+	@echo "Security dashboard: http://localhost:8080/security"
+	@echo "Markdown report: reports/security-report.md"
+else
+	@echo "Starting deployment without security scanning..."
+	$(MAKE) build
+	@echo "Starting container..."
+	docker run -d --name $(CONTAINER_NAME) -p $(PORT):8080 $(IMAGE_NAME)
+	@echo "Generating markdown security report..."
+	$(MAKE) scan-markdown
+	@echo "Container started successfully!"
+	@echo "Access application: http://localhost:8080"
+	@echo "Note: Security scanning disabled. Set ENABLE_SECURITY=true to enable."
+	@echo "Markdown report: reports/security-report.md"
+endif
+
+.PHONY: run-secure
+run-secure: rm ## Build and run container with security scanning (always enabled)
+	@echo "Starting secure deployment with security scanning..."
+	$(MAKE) trivy-pull build scan-json
+	@echo "Starting container with security reports..."
+	docker run -d --name $(CONTAINER_NAME) -p $(PORT):8080 $(IMAGE_NAME)
+	@echo "Updating security reports in running container..."
+	@sleep 3
+	$(MAKE) update-security-reports
+	@echo "Container started successfully with latest security reports!"
+	@echo "Access application: http://localhost:8080"
+	@echo "Security dashboard: http://localhost:8080/security"
+
+.PHONY: run-basic
+run-basic: rm ## Build and run container without security scanning (fast deployment)
+	@echo "Starting basic deployment without security scanning..."
+	$(MAKE) build
+	@echo "Starting container..."
+	docker run -d --name $(CONTAINER_NAME) -p $(PORT):8080 $(IMAGE_NAME)
+	@echo "Container started successfully!"
+	@echo "Access application: http://localhost:8080"
+
+.PHONY: run-fg
+run-fg: ## Run container in foreground
+	docker run --rm --name $(CONTAINER_NAME) -p $(PORT):8080 $(IMAGE_NAME)
+
+.PHONY: up
+up: ## Start services using docker-compose
+	docker-compose -f $(COMPOSE_FILE) up -d
+
+.PHONY: up-build
+up-build: ## Start services and rebuild if needed
+	docker-compose -f $(COMPOSE_FILE) up -d --build
+
+.PHONY: down
+down: ## Stop and remove containers
+	docker-compose -f $(COMPOSE_FILE) down
+
+# Development targets
+.PHONY: dev
+dev: ## Start development environment
+	docker-compose -f $(COMPOSE_FILE) up --build
+
+.PHONY: shell
+shell: ## Access running container shell
+	docker exec -it $(CONTAINER_NAME) /bin/bash
+
+.PHONY: logs
+logs: ## Show container logs
+	docker logs -f $(CONTAINER_NAME)
+
+.PHONY: logs-compose
+logs-compose: ## Show docker-compose logs
+	docker-compose -f $(COMPOSE_FILE) logs -f
+
+# Testing targets
+.PHONY: test
+test: ## Run tests inside container
+	docker run --rm $(IMAGE_NAME) python3 -m pytest /var/www/app/test.py
+
+.PHONY: test-local
+test-local: ## Run tests locally (requires Python 3)
+	cd app && python3 test.py
+
+.PHONY: lint
+lint: ## Run linting inside container
+	docker run --rm $(IMAGE_NAME) python3 -m flake8 /var/www/app/
+
+# Health and status targets
+.PHONY: health
+health: ## Check container health status
+	docker inspect --format='{{.State.Health.Status}}' $(CONTAINER_NAME)
+
+.PHONY: status
+status: ## Show container status
+	docker ps -f name=$(CONTAINER_NAME)
+
+.PHONY: inspect
+inspect: ## Inspect container details
+	docker inspect $(CONTAINER_NAME)
+
+# Cleanup targets
+.PHONY: stop
+stop: ## Stop running container
+	docker stop $(CONTAINER_NAME) || true
+
+.PHONY: rm
+rm: stop ## Remove container
+	docker rm $(CONTAINER_NAME) || true
+
+.PHONY: clean
+clean: rm ## Clean up containers and images
+	docker rmi $(IMAGE_NAME) || true
+
+.PHONY: clean-all
+clean-all: ## Remove all unused containers, networks, images
+	docker system prune -af
+
+.PHONY: clean-volumes
+clean-volumes: ## Remove all unused volumes
+	docker volume prune -f
+
+# Maintenance targets
+.PHONY: pull
+pull: ## Pull latest base image
+	docker pull debian:bookworm-slim
+
+.PHONY: size
+size: ## Show image size
+	docker images $(IMAGE_NAME)
+
+.PHONY: history
+history: ## Show image build history
+	docker history $(IMAGE_NAME)
+
+# Security targets with Trivy
+.PHONY: trivy-pull
+trivy-pull: ## Pull latest Trivy Docker image
+	@echo "Pulling latest Trivy Docker image..."
+	docker pull aquasec/trivy:latest
+
+.PHONY: trivy-install
+trivy-install: trivy-pull ## Pull Trivy Docker image (replaces host installation)
+	@echo "Trivy Docker image ready for use"
+
+.PHONY: scan-image
+scan-image: ## Scan Docker image for vulnerabilities with Trivy
+	@echo "Scanning Docker image $(IMAGE_NAME) for vulnerabilities..."
+	docker run --rm -v /var/run/docker.sock:/var/run/docker.sock \
+		-v $(PWD):/workspace \
+		-v trivy-cache:/root/.cache \
+		aquasec/trivy:latest image \
+		--exit-code 0 --severity HIGH,CRITICAL --format table $(IMAGE_NAME)
+
+.PHONY: scan-dockerfile
+scan-dockerfile: ## Scan Dockerfile for misconfigurations
+	@echo "Scanning Dockerfile for misconfigurations..."
+	docker run --rm -v $(PWD):/workspace \
+		-v trivy-cache:/root/.cache \
+		aquasec/trivy:latest config \
+		--exit-code 0 --severity HIGH,CRITICAL --format table /workspace
+
+.PHONY: scan-fs
+scan-fs: ## Scan filesystem/source code for vulnerabilities
+	@echo "Scanning filesystem for vulnerabilities and secrets..."
+	docker run --rm -v $(PWD):/workspace \
+		-v trivy-cache:/root/.cache \
+		aquasec/trivy:latest fs \
+		--exit-code 0 --severity HIGH,CRITICAL --scanners vuln,secret,misconfig --format table /workspace
+
+.PHONY: scan-python
+scan-python: ## Scan Python dependencies for vulnerabilities
+	@echo "Scanning Python dependencies..."
+	docker run --rm -v $(PWD):/workspace \
+		-v trivy-cache:/root/.cache \
+		aquasec/trivy:latest fs \
+		--exit-code 0 --severity HIGH,CRITICAL --scanners vuln --format table /workspace/app/
+
+.PHONY: scan-all
+scan-all: scan-dockerfile scan-fs scan-python build scan-image ## Run all security scans
+	@echo "All security scans completed!"
+
+.PHONY: scan-json
+scan-json: ## Generate JSON security reports
+	@mkdir -p reports
+	@echo "Generating JSON security reports..."
+	docker run --rm -v /var/run/docker.sock:/var/run/docker.sock \
+		-v $(PWD):/workspace \
+		-v trivy-cache:/root/.cache \
+		aquasec/trivy:latest image \
+		--exit-code 0 --format json --output /workspace/reports/image-scan.json $(IMAGE_NAME) || true
+	docker run --rm -v $(PWD):/workspace \
+		-v trivy-cache:/root/.cache \
+		aquasec/trivy:latest config \
+		--exit-code 0 --format json --output /workspace/reports/dockerfile-scan.json /workspace || true
+	docker run --rm -v $(PWD):/workspace \
+		-v trivy-cache:/root/.cache \
+		aquasec/trivy:latest fs \
+		--exit-code 0 --scanners vuln,secret,misconfig --format json --output /workspace/reports/fs-scan.json /workspace || true
+	@echo "Reports generated in reports/ directory"
+
+.PHONY: scan-markdown
+scan-markdown: ## Generate markdown security report (always runs regardless of ENABLE_SECURITY)
+	@mkdir -p reports
+	@echo "Generating formatted markdown security report..."
+	$(MAKE) trivy-pull
+	@echo "# Security Report" > reports/security-report.md
+	@echo "" >> reports/security-report.md
+	@echo "## Overview" >> reports/security-report.md
+	@echo "" >> reports/security-report.md
+	@echo "- **Image**: $(IMAGE_NAME)" >> reports/security-report.md
+	@echo "- **Generated**: $$(date)" >> reports/security-report.md
+	@echo "- **Scanner**: Trivy (dockerized)" >> reports/security-report.md
+	@echo "" >> reports/security-report.md
+	@echo "---" >> reports/security-report.md
+	@echo "" >> reports/security-report.md
+	@echo "## 🐳 Docker Image Vulnerabilities" >> reports/security-report.md
+	@echo "" >> reports/security-report.md
+	docker run --rm -v /var/run/docker.sock:/var/run/docker.sock \
+		-v $(PWD):/workspace \
+		-v trivy-cache:/root/.cache \
+		aquasec/trivy:latest image \
+		--exit-code 0 --format table $(IMAGE_NAME) >> reports/security-report.md || true
+	@echo "" >> reports/security-report.md
+	@echo "---" >> reports/security-report.md
+	@echo "" >> reports/security-report.md
+	@echo "## 📋 Dockerfile Security Analysis" >> reports/security-report.md
+	@echo "" >> reports/security-report.md
+	docker run --rm -v $(PWD):/workspace \
+		-v trivy-cache:/root/.cache \
+		aquasec/trivy:latest config \
+		--exit-code 0 --format table /workspace >> reports/security-report.md || true
+	@echo "" >> reports/security-report.md
+	@echo "---" >> reports/security-report.md
+	@echo "" >> reports/security-report.md
+	@echo "## 📁 Filesystem Security Analysis" >> reports/security-report.md
+	@echo "" >> reports/security-report.md
+	docker run --rm -v $(PWD):/workspace \
+		-v trivy-cache:/root/.cache \
+		aquasec/trivy:latest fs \
+		--exit-code 0 --scanners vuln,secret,misconfig --format table /workspace >> reports/security-report.md || true
+	@echo "" >> reports/security-report.md
+	@echo "---" >> reports/security-report.md
+	@echo "" >> reports/security-report.md
+	@echo "## Summary" >> reports/security-report.md
+	@echo "" >> reports/security-report.md
+	@echo "This report was automatically generated as part of the security-first deployment workflow." >> reports/security-report.md
+	@echo "The container now runs as non-root user (appuser) on port 8080 for enhanced security." >> reports/security-report.md
+	@echo "" >> reports/security-report.md
+	@echo "> Generated with [Trivy](https://trivy.dev/) security scanner" >> reports/security-report.md
+	@echo "Formatted markdown security report generated: reports/security-report.md"
+
+.PHONY: update-security-reports
+update-security-reports: scan-json ## Update security reports in running container
+	@echo "Copying security reports to running container..."
+	docker exec $(CONTAINER_NAME) mkdir -p /var/www/app/reports || true
+	docker cp reports/. $(CONTAINER_NAME):/var/www/app/reports/ || true
+	@echo "Security reports updated in container"
+
+.PHONY: scan-ci
+scan-ci: ## CI-friendly scan with exit codes for failures
+	@echo "Running CI security scans..."
+	docker run --rm -v /var/run/docker.sock:/var/run/docker.sock \
+		-v $(PWD):/workspace \
+		-v trivy-cache:/root/.cache \
+		aquasec/trivy:latest image \
+		--exit-code 1 --severity HIGH,CRITICAL --quiet $(IMAGE_NAME)
+	docker run --rm -v $(PWD):/workspace \
+		-v trivy-cache:/root/.cache \
+		aquasec/trivy:latest config \
+		--exit-code 1 --severity HIGH,CRITICAL --quiet /workspace
+	docker run --rm -v $(PWD):/workspace \
+		-v trivy-cache:/root/.cache \
+		aquasec/trivy:latest fs \
+		--exit-code 1 --severity HIGH,CRITICAL --scanners vuln,secret,misconfig --quiet /workspace
+
+.PHONY: scan
+scan: ## Scan image for vulnerabilities (legacy compatibility)
+	$(MAKE) scan-image
+
+.PHONY: security-check
+security-check: ## Run comprehensive security checks
+	@echo "Running comprehensive security checks..."
+	$(MAKE) scan-all
+	@echo "Checking for running processes..."
+	docker run --rm $(IMAGE_NAME) ps aux || true
+	@echo "Checking file permissions..."
+	docker run --rm $(IMAGE_NAME) ls -la /var/www/app/ || true
+
+# Quick commands
+.PHONY: restart
+restart: stop run ## Restart container
+
+.PHONY: rebuild
+rebuild: clean build run ## Rebuild and run container
+
+.PHONY: fresh
+fresh: clean pull build run ## Fresh build with latest base image
+
+# Help target
+.PHONY: help
+help: ## Show this help message
+	@echo "Docker Flask Application Commands:"
+	@echo ""
+	@grep -E '^[a-zA-Z_-]+:.*?## .*$$' $(MAKEFILE_LIST) | \
+		awk 'BEGIN {FS = ":.*?## "}; {printf "  \033[36m%-15s\033[0m %s\n", $$1, $$2}'
+	@echo ""
+	@echo "Variables:"
+	@echo "  IMAGE_NAME      = $(IMAGE_NAME)"
+	@echo "  CONTAINER_NAME  = $(CONTAINER_NAME)"
+	@echo "  PORT           = $(PORT)"
+	@echo "  ENABLE_SECURITY = $(ENABLE_SECURITY)"
+	@echo ""
+	@echo "Quick Start:"
+	@echo "  make run          # Run (security: $(ENABLE_SECURITY))"
+	@echo "  make run-basic    # Run without security"
+	@echo "  make run-secure   # Run with security"
+	@echo "  make logs         # View logs"
+	@echo "  make stop         # Stop container"
+	@echo ""
+	@echo "Security Control:"
+	@echo "  Edit ENABLE_SECURITY in Makefile (currently: $(ENABLE_SECURITY))"
+	@echo "  Or: make ENABLE_SECURITY=true run"
\ No newline at end of file
diff --git a/README.md b/README.md
index 79185a0..c02f11e 100644
--- a/README.md
+++ b/README.md
@@ -1,20 +1,381 @@
-[![Build Status](https://travis-ci.org/p0bailey/docker-flask.svg?branch=master)](https://travis-ci.org/p0bailey/docker-flask)
+# Flask Docker Application
 
+<div style="text-align: center;">
+  <img src=".img/1.png" alt="Agentic AI Top 10 Overview" width="500">
+</div>
 
-This image is a boilerplate for any Flask application,  pages are served by uwsgi and Nginx.
 
-On Docker host run: docker run -d -p 80:80 p0bailey/docker-flask
 
-On Docker machine run: docker run -d -p 80:80 p0bailey/docker-flask
+A modern Flask web application containerized with Docker, featuring automated security scanning and comprehensive monitoring capabilities.
 
-Docker compose: docker-compose up -d
+## Overview
 
-Source code: https://github.com/p0bailey/docker-flask
+This project provides a production-ready Flask application running in Docker with:
 
-DockerHub: https://hub.docker.com/r/p0bailey/docker-flask/
+- **Modern Python Stack**: Python 3.11, Flask 3.0, Gunicorn 23.0
+- **Fast Package Management**: uv package manager for blazing-fast dependency resolution
+- **Web Server**: Nginx reverse proxy with Gunicorn WSGI server
+- **Process Management**: Supervisor for robust service orchestration
+- **Integrated Security**: Dockerized Trivy security scanning with automated reporting
+- **Security Dashboard**: Interactive web interface for vulnerability analysis
+- **Production Ready**: Optimized Dockerfile with security best practices
 
-![Hello Flask][2]
+## Quick Start
 
+### Prerequisites
 
+- Docker
+- Make
 
-[2]: http://s14.postimg.org/mwmg7p0v5/hello_flask.png
+### One-Command Deployment
+
+```bash
+# Complete security-first deployment (recommended)
+make run
+```
+
+This single command automatically:
+- Pulls latest Trivy security scanner
+- Builds the Docker image with latest dependencies
+- Performs comprehensive security scanning (image, dockerfile, filesystem)
+- Generates fresh security reports
+- Starts the application container
+- Updates security reports in the running container
+
+### Alternative Commands
+
+```bash
+# Build only
+make build
+
+# View logs
+make logs
+
+# Stop the application
+make stop
+
+# Clean up
+make clean
+```
+
+### Access Points
+
+- **Application**: `http://localhost:8080`
+- **Security Dashboard**: `http://localhost:8080/security`
+
+## Security Features
+
+
+<div style="text-align: center;">
+  <img src=".img/2.png" alt="Agentic AI Top 10 Overview" width="500">
+</div>
+
+### Dockerized Trivy Integration
+
+This application features fully containerized security scanning with no host dependencies:
+
+```bash
+# Complete security-first deployment (includes all scans)
+make run
+
+# Manual security operations
+make trivy-pull         # Pull latest Trivy Docker image
+make scan-all          # Run all security scans
+make scan-json         # Generate JSON security reports
+
+# Individual scans (all containerized)
+make scan-dockerfile    # Scan Dockerfile for misconfigurations
+make scan-image        # Scan Docker image for vulnerabilities  
+make scan-python       # Scan Python dependencies
+make scan-fs           # Scan filesystem for secrets and configs
+
+# CI/CD friendly (exits with error codes on findings)
+make scan-ci
+
+# Update reports in running container
+make update-security-reports
+```
+
+### Automated Security Workflow
+
+
+The `make run` command now provides a complete security-first deployment:
+
+1. **Latest Scanner**: Pulls `aquasec/trivy:latest` Docker image
+2. **Fresh Build**: Builds application with latest dependencies
+3. **Comprehensive Scanning**: Analyzes image, Dockerfile, and filesystem
+4. **Report Generation**: Creates JSON reports for web dashboard
+5. **Container Deployment**: Starts application with security data
+6. **Real-time Updates**: Copies fresh reports to running container
+
+### Security Report Interface
+
+Access the interactive security dashboard at `http://localhost:8080/security`
+
+Features:
+- Real-time vulnerability statistics
+- Interactive charts and visualizations
+- Severity-sorted vulnerability lists (Critical → High → Medium → Low)
+- Detailed CVE information with references
+- Dockerfile misconfiguration analysis
+- Secret detection and filesystem scanning
+- **Formatted Markdown Reports**: Enhanced `reports/security-report.md` with emojis and clear sections
+
+### Security Configurations
+
+- **Trivy Configuration**: `trivy.yaml`
+- **Ignore Rules**: `.trivyignore`
+- **Secret Detection**: `.trivy/secret.yaml`
+
+## Architecture
+
+### Application Stack
+
+- **Base Image**: Debian 12 (bookworm-slim)
+- **Python**: 3.11.2 with uv package manager
+- **Web Framework**: Flask 3.0.0
+- **WSGI Server**: Gunicorn 23.0.0 (3 workers)
+- **Web Server**: Nginx 1.22.1
+- **Process Manager**: Supervisor 4.2.5
+
+### Directory Structure
+
+```
+├── app/
+│   ├── app.py              # Flask application
+│   ├── requirements.txt    # Python dependencies
+│   └── templates/          # HTML templates
+├── nginx/
+│   └── flask.conf         # Nginx configuration
+├── supervisor/
+│   └── supervisord.conf   # Supervisor configuration
+├── reports/               # Security scan reports
+├── .trivy/               # Trivy configurations
+├── Dockerfile
+├── Makefile
+└── README.md
+```
+
+### Container Architecture
+
+The application runs multiple services managed by Supervisor:
+- **Gunicorn**: Python WSGI server on port 8000 (as `appuser`)
+- **Nginx**: Reverse proxy on port 8080 (non-privileged port)
+- **Security**: Container runs as non-root user (`appuser`) for enhanced security
+
+## Development
+
+### Local Development
+
+```bash
+# Complete development environment (with security scanning)
+make run
+
+# View application logs
+make logs
+
+# Access container shell
+docker exec -it flask-app /bin/bash
+
+# Quick development iteration (build only)
+make build
+```
+
+### Adding Features
+
+1. Modify the Flask application in `app/app.py`
+2. Update dependencies in `app/requirements.txt`
+3. Deploy with security scanning: `make run`
+4. Review security dashboard: `http://localhost:8080/security`
+
+### Security Best Practices
+
+The Dockerfile implements security best practices:
+- **Non-root user execution**: Container runs as `appuser` (resolves AVD-DS-0002)
+- **Non-privileged port**: Uses port 8080 instead of 80 for enhanced security
+- **Minimal package installation**: Uses `--no-install-recommends` flag
+- **Multi-stage build**: Optimized for smaller image size
+- **Health checks**: Built-in container health monitoring on port 8080
+- **Proper file permissions**: Secure ownership and access controls
+- **Automated markdown reports**: Enhanced security documentation generation
+
+## Configuration
+
+### Environment Variables
+
+The application can be configured through environment variables:
+- `FLASK_ENV`: Set to `development` or `production`
+- `GUNICORN_WORKERS`: Number of Gunicorn worker processes (default: 3)
+
+### Nginx Configuration
+
+Customize the reverse proxy settings in `nginx/flask.conf`:
+- Server name and port configuration
+- SSL/TLS settings
+- Rate limiting and security headers
+
+### Supervisor Configuration
+
+Modify process management in `supervisor/supervisord.conf`:
+- Service startup order
+- Restart policies
+- Logging configuration
+
+## Monitoring and Logging
+
+### Application Logs
+
+```bash
+# View all container logs
+make logs
+
+# Follow logs in real-time
+docker logs -f flask-app
+
+# View specific service logs
+docker exec flask-app supervisorctl tail -f gunicorn
+docker exec flask-app supervisorctl tail -f nginx
+```
+
+### Health Checks
+
+The container includes built-in health checks:
+- **Endpoint**: `http://localhost:8080/`
+- **Interval**: 30 seconds
+- **Timeout**: 10 seconds
+- **Retries**: 3
+
+### Performance Monitoring
+
+Monitor application performance:
+- **Process Status**: `docker exec flask-app supervisorctl status`
+- **Resource Usage**: `docker stats flask-app`
+- **Container Health**: `docker ps` (shows health status)
+
+## Deployment
+
+### Production Deployment
+
+For production deployment, consider:
+
+1. **Environment Variables**: Set production configurations
+2. **SSL/TLS**: Configure HTTPS in nginx
+3. **Database**: Add database connectivity
+4. **Load Balancing**: Use multiple container instances
+5. **Monitoring**: Implement comprehensive logging and monitoring
+
+### Docker Compose Example
+
+```yaml
+version: '3.8'
+services:
+  flask-app:
+    build: .
+    ports:
+      - "8080:8080"
+    environment:
+      - FLASK_ENV=production
+    restart: unless-stopped
+    healthcheck:
+      test: ["CMD", "curl", "-f", "http://localhost:8080/"]
+      interval: 30s
+      timeout: 10s
+      retries: 3
+```
+
+### CI/CD Integration
+
+For automated security scanning in CI/CD pipelines:
+
+```bash
+# CI-friendly security scan (exits with error codes on vulnerabilities)
+make scan-ci
+
+# Complete deployment workflow for CI/CD
+make run  # Includes build, scan, and deploy
+```
+
+The dockerized Trivy approach eliminates host dependencies, making CI/CD integration seamless across different environments.
+
+## Troubleshooting
+
+### Common Issues
+
+**Container won't start:**
+```bash
+# Check container logs
+make logs
+
+# Verify image build
+docker images docker-flask
+```
+
+**Application not accessible:**
+```bash
+# Check port binding (should show 8080:8080)
+docker ps
+
+# Verify nginx configuration
+docker exec flask-app nginx -t
+
+# Test direct access
+curl http://localhost:8080
+```
+
+**Security scan failures:**
+```bash
+# Pull latest Trivy image and clear cache
+make trivy-pull
+
+# Check Trivy configuration with dockerized scanner
+docker run --rm -v $(PWD):/workspace aquasec/trivy:latest config /workspace
+```
+
+### Debug Mode
+
+Enable debug logging:
+```bash
+# Run with debug output
+docker run -it --rm -p 8080:8080 docker-flask
+
+# Check service status
+docker exec flask-app supervisorctl status
+```
+
+## Contributing
+
+1. Fork the repository
+2. Create a feature branch
+3. Make your changes
+4. Deploy with security scanning: `make run`
+5. Verify security dashboard shows no new issues
+6. Submit a pull request
+
+## License
+
+This project is licensed under the MIT License - see the LICENSE file for details.
+
+## Changelog
+
+### Latest Version
+- **Security Hardening**: Resolved AVD-DS-0002 by running as non-root user (`appuser`)
+- **Non-Privileged Port**: Migrated from port 80 to 8080 for enhanced security
+- **Enhanced Markdown Reports**: Formatted security reports with emojis and sections
+- **Dockerized Security Scanning**: Full containerization of Trivy security analysis
+- **One-Command Deployment**: `make run` includes build, scan, and deploy workflow
+- **Automated Security Reports**: Real-time vulnerability data with markdown generation
+- **Interactive Security Dashboard**: Severity-sorted vulnerability interface
+- **Dependency-Free CI/CD**: No host tool requirements for security scanning
+- **Enhanced Make Targets**: Comprehensive security scanning automation
+- **Upgraded Security Stack**: Gunicorn 23.0.0 and latest Trivy integration
+- **Fast Package Management**: uv package manager for optimized builds
+
+## Support
+
+For issues and questions:
+- Check the troubleshooting section above
+- Review container logs with `make logs`
+- Deploy with `make run` for comprehensive diagnostics
+- Check security dashboard at `http://localhost:8080/security`
+- Review markdown security report at `reports/security-report.md`
+- Create an issue in the project repository
diff --git a/app/app.py b/app/app.py
index d36abb4..ed0fe0a 100644
--- a/app/app.py
+++ b/app/app.py
@@ -1,6 +1,8 @@
-#!flask/bin/python
-from flask import render_template
+#!/usr/bin/env python3
+from flask import render_template, jsonify, send_file
 from flask import Flask
+import os
+import json
 
 app = Flask(__name__)
 
@@ -8,5 +10,105 @@
 def hello():
     return render_template('app.html')
 
+@app.route('/security')
+def security_report():
+    return render_template('security-report.html')
+
+@app.route('/api/security-report/<report_name>')
+def get_security_report(report_name):
+    """API endpoint to serve security report JSON data"""
+    try:
+        # Map report names to file paths
+        report_files = {
+            'image-scan': 'reports/image-scan.json',
+            'dockerfile-scan': 'reports/dockerfile-scan.json', 
+            'fs-scan': 'reports/fs-scan.json'
+        }
+        
+        if report_name not in report_files:
+            return jsonify({"error": "Report not found"}), 404
+            
+        # Get the absolute path to the report file
+        report_path = os.path.join(os.path.dirname(__file__), report_files[report_name])
+        
+        if not os.path.exists(report_path):
+            return jsonify({"error": "Report file not found", "path": report_path}), 404
+            
+        with open(report_path, 'r') as f:
+            report_data = json.load(f)
+            
+        return jsonify(report_data)
+        
+    except Exception as e:
+        return jsonify({"error": str(e)}), 500
+
+@app.route('/api/security-summary')
+def security_summary():
+    """API endpoint to get security summary statistics"""
+    try:
+        summary = {
+            'total_vulnerabilities': 0,
+            'critical': 0,
+            'high': 0, 
+            'medium': 0,
+            'low': 0,
+            'last_scan': None,
+            'reports_available': []
+        }
+        
+        # Check which reports exist
+        report_files = {
+            'image-scan': 'reports/image-scan.json',
+            'dockerfile-scan': 'reports/dockerfile-scan.json',
+            'fs-scan': 'reports/fs-scan.json'
+        }
+        
+        base_path = os.path.dirname(__file__)
+        
+        for report_name, report_file in report_files.items():
+            report_path = os.path.join(base_path, report_file)
+            if os.path.exists(report_path):
+                summary['reports_available'].append(report_name)
+                
+                try:
+                    with open(report_path, 'r') as f:
+                        data = json.load(f)
+                        
+                    # Count vulnerabilities
+                    if 'Results' in data:
+                        for result in data['Results']:
+                            if 'Vulnerabilities' in result:
+                                for vuln in result['Vulnerabilities']:
+                                    summary['total_vulnerabilities'] += 1
+                                    severity = vuln.get('Severity', '').upper()
+                                    if severity == 'CRITICAL':
+                                        summary['critical'] += 1
+                                    elif severity == 'HIGH':
+                                        summary['high'] += 1
+                                    elif severity == 'MEDIUM':
+                                        summary['medium'] += 1
+                                    elif severity == 'LOW':
+                                        summary['low'] += 1
+                                        
+                            if 'Misconfigurations' in result:
+                                for misc in result['Misconfigurations']:
+                                    summary['total_vulnerabilities'] += 1
+                                    severity = misc.get('Severity', '').upper()
+                                    if severity == 'CRITICAL':
+                                        summary['critical'] += 1
+                                    elif severity == 'HIGH':
+                                        summary['high'] += 1
+                                    elif severity == 'MEDIUM':
+                                        summary['medium'] += 1
+                                    elif severity == 'LOW':
+                                        summary['low'] += 1
+                except:
+                    continue
+        
+        return jsonify(summary)
+        
+    except Exception as e:
+        return jsonify({"error": str(e)}), 500
+
 if __name__ == '__main__':
     app.run(host='0.0.0.0')
diff --git a/app/requirements.txt b/app/requirements.txt
index 5d19166..c38d9c5 100644
--- a/app/requirements.txt
+++ b/app/requirements.txt
@@ -1,2 +1,2 @@
-uwsgi 
-flask
+gunicorn==23.0.0
+flask==3.0.0
diff --git a/app/templates/app.html b/app/templates/app.html
index bf0c52e..70614c5 100644
--- a/app/templates/app.html
+++ b/app/templates/app.html
@@ -4,81 +4,378 @@
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <meta name="description" content="">
-  <meta name="author" content="">
-  <link rel="icon" href="../../favicon.ico">
+  <meta name="description" content="Modern Flask Docker Application">
+  <meta name="author" content="Flask Docker Team">
+  
+  <title>🐍 Flask Docker App</title>
 
-  <title>HELLO FLASK!!!</title>
+  <!-- Bootstrap 5 from CDN for modern styling -->
+  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+  <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
+  
+  <!-- Custom styles -->
+  <style>
+    :root {
+      --primary-color: #667eea;
+      --secondary-color: #764ba2;
+      --accent-color: #f093fb;
+      --text-dark: #2d3748;
+      --text-light: #718096;
+    }
 
-  <!-- Bootstrap core CSS -->
-  <link href="/static/css/bootstrap.min.css" rel="stylesheet">
+    body {
+      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+      background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
+      min-height: 100vh;
+      margin: 0;
+    }
 
-  <!-- Custom styles for this template -->
-  <link href="jumbotron-narrow.css" rel="stylesheet">
+    .main-container {
+      background: rgba(255, 255, 255, 0.95);
+      backdrop-filter: blur(10px);
+      border-radius: 20px;
+      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
+      margin: 2rem auto;
+      max-width: 1200px;
+      overflow: hidden;
+    }
 
-  <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
-  <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
-  <script src="/static/js/ie-emulation-modes-warning.js"></script>
+    .hero-section {
+      background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
+      color: white;
+      text-align: center;
+      padding: 4rem 2rem;
+      position: relative;
+      overflow: hidden;
+    }
 
-  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
-  <!--[if lt IE 9]>
-  <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
-  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
-  <![endif]-->
-</head>
+    .hero-section::before {
+      content: '';
+      position: absolute;
+      top: -50%;
+      left: -50%;
+      width: 200%;
+      height: 200%;
+      background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);
+      animation: float 6s ease-in-out infinite;
+    }
 
-<body>
+    @keyframes float {
+      0%, 100% { transform: translateY(0px) rotate(0deg); }
+      50% { transform: translateY(-20px) rotate(180deg); }
+    }
 
-  <div class="container">
-    <div class="header">
-      <nav>
-        <ul class="nav nav-pills pull-right">
-          <li role="presentation" class="active"><a href="#">Home</a></li>
-          <li role="presentation"><a href="#">About</a></li>
-          <li role="presentation"><a href="#">Contact</a></li>
-        </ul>
-      </nav>
-      <h3 class="text-muted">Project name</h3>
-    </div>
+    .hero-title {
+      font-size: 3.5rem;
+      font-weight: 700;
+      margin-bottom: 1rem;
+      text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
+      position: relative;
+      z-index: 1;
+    }
 
-    <div class="jumbotron">
-      <h1>Hello Flask!!!</h1>
-      <p class="lead">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
-      <p><a class="btn btn-lg btn-success" href="#" role="button">Sign up today</a></p>
-    </div>
+    .hero-subtitle {
+      font-size: 1.3rem;
+      opacity: 0.9;
+      margin-bottom: 2rem;
+      position: relative;
+      z-index: 1;
+    }
 
-    <div class="row marketing">
-      <div class="col-lg-6">
-        <h4>Subheading</h4>
-        <p>Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.</p>
+    .btn-custom {
+      background: linear-gradient(45deg, #ff6b6b, #feca57);
+      border: none;
+      color: white;
+      padding: 1rem 2rem;
+      font-size: 1.1rem;
+      border-radius: 50px;
+      transition: all 0.3s ease;
+      text-decoration: none;
+      display: inline-block;
+      position: relative;
+      z-index: 1;
+    }
 
-        <h4>Subheading</h4>
-        <p>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras mattis consectetur purus sit amet fermentum.</p>
+    .btn-custom:hover {
+      transform: translateY(-3px);
+      box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
+      color: white;
+      text-decoration: none;
+    }
 
-        <h4>Subheading</h4>
-        <p>Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-      </div>
+    .features-section {
+      padding: 4rem 2rem;
+    }
+
+    .feature-card {
+      background: white;
+      border-radius: 15px;
+      padding: 2rem;
+      margin-bottom: 2rem;
+      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
+      transition: all 0.3s ease;
+      border: 1px solid rgba(102, 126, 234, 0.1);
+      height: 100%;
+    }
+
+    .feature-card:hover {
+      transform: translateY(-5px);
+      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
+    }
+
+    .feature-icon {
+      font-size: 3rem;
+      background: linear-gradient(45deg, var(--primary-color), var(--accent-color));
+      -webkit-background-clip: text;
+      -webkit-text-fill-color: transparent;
+      background-clip: text;
+      margin-bottom: 1rem;
+    }
+
+    .feature-title {
+      color: var(--text-dark);
+      font-weight: 600;
+      margin-bottom: 1rem;
+    }
+
+    .feature-text {
+      color: var(--text-light);
+      line-height: 1.6;
+    }
+
+    .stats-section {
+      background: linear-gradient(135deg, var(--text-dark) 0%, #1a202c 100%);
+      color: white;
+      padding: 3rem 2rem;
+      text-align: center;
+    }
+
+    .stat-item {
+      margin-bottom: 2rem;
+    }
+
+    .stat-number {
+      font-size: 3rem;
+      font-weight: 700;
+      background: linear-gradient(45deg, var(--accent-color), #feca57);
+      -webkit-background-clip: text;
+      -webkit-text-fill-color: transparent;
+      background-clip: text;
+      display: block;
+    }
 
-      <div class="col-lg-6">
-        <h4>Subheading</h4>
-        <p>Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.</p>
+    .stat-label {
+      font-size: 1.1rem;
+      opacity: 0.8;
+      text-transform: uppercase;
+      letter-spacing: 1px;
+    }
 
-        <h4>Subheading</h4>
-        <p>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras mattis consectetur purus sit amet fermentum.</p>
+    .footer-section {
+      background: var(--text-dark);
+      color: white;
+      text-align: center;
+      padding: 2rem;
+    }
 
-        <h4>Subheading</h4>
-        <p>Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
+    .tech-badge {
+      background: linear-gradient(45deg, var(--primary-color), var(--secondary-color));
+      color: white;
+      padding: 0.5rem 1rem;
+      border-radius: 25px;
+      font-size: 0.9rem;
+      margin: 0.25rem;
+      display: inline-block;
+    }
+
+    @media (max-width: 768px) {
+      .hero-title { font-size: 2.5rem; }
+      .main-container { margin: 1rem; }
+      .hero-section { padding: 3rem 1rem; }
+      .features-section { padding: 3rem 1rem; }
+    }
+  </style>
+</head>
+
+<body>
+  <div class="main-container">
+    <!-- Hero Section -->
+    <div class="hero-section">
+      <h1 class="hero-title">
+        <i class="fab fa-python"></i> Flask Docker
+      </h1>
+      <p class="hero-subtitle">
+        Modern Python web application running in Docker with Gunicorn & uv
+      </p>
+      <div class="d-flex flex-wrap justify-content-center gap-3">
+        <a href="#features" class="btn-custom">
+          <i class="fas fa-rocket"></i> Explore Features
+        </a>
+        <a href="/security" class="btn-custom" style="background: linear-gradient(45deg, #e74c3c, #c0392b);">
+          <i class="fas fa-shield-alt"></i> Security Report
+        </a>
       </div>
     </div>
 
-    <footer class="footer">
-      <p>&copy; Company 2014</p>
-    </footer>
+    <!-- Tech Stack -->
+    <div class="container py-4 text-center">
+      <div class="tech-badge"><i class="fab fa-python"></i> Python 3.11</div>
+      <div class="tech-badge"><i class="fas fa-flask"></i> Flask 3.0</div>
+      <div class="tech-badge"><i class="fab fa-docker"></i> Docker</div>
+      <div class="tech-badge"><i class="fas fa-server"></i> Gunicorn</div>
+      <div class="tech-badge"><i class="fas fa-bolt"></i> uv Package Manager</div>
+      <div class="tech-badge"><i class="fas fa-shield-alt"></i> Nginx</div>
+    </div>
 
-  </div> <!-- /container -->
+    <!-- Features Section -->
+    <div id="features" class="features-section">
+      <div class="container">
+        <div class="row text-center mb-5">
+          <div class="col-12">
+            <h2 class="display-5 fw-bold" style="color: var(--text-dark);">Why This Stack?</h2>
+            <p class="lead" style="color: var(--text-light);">Modern, fast, and production-ready</p>
+          </div>
+        </div>
+        
+        <div class="row">
+          <div class="col-md-4">
+            <div class="feature-card text-center">
+              <div class="feature-icon">
+                <i class="fas fa-bolt"></i>
+              </div>
+              <h4 class="feature-title">Lightning Fast</h4>
+              <p class="feature-text">
+                Built with uv package manager for blazing fast dependency resolution and Gunicorn for optimal performance.
+              </p>
+            </div>
+          </div>
+          
+          <div class="col-md-4">
+            <div class="feature-card text-center">
+              <div class="feature-icon">
+                <i class="fab fa-docker"></i>
+              </div>
+              <h4 class="feature-title">Containerized</h4>
+              <p class="feature-text">
+                Fully containerized with Docker for consistent deployments across any environment. No more "it works on my machine"!
+              </p>
+            </div>
+          </div>
+          
+          <div class="col-md-4">
+            <div class="feature-card text-center">
+              <div class="feature-icon">
+                <i class="fas fa-shield-alt"></i>
+              </div>
+              <h4 class="feature-title">Production Ready</h4>
+              <p class="feature-text">
+                Nginx reverse proxy, Gunicorn WSGI server, and supervisor process management for enterprise-grade reliability.
+              </p>
+            </div>
+          </div>
+        </div>
 
+        <div class="row mt-4">
+          <div class="col-md-6">
+            <div class="feature-card">
+              <div class="feature-icon text-start">
+                <i class="fas fa-cogs"></i>
+              </div>
+              <h4 class="feature-title">Modern Architecture</h4>
+              <p class="feature-text">
+                • Python 3.11 with latest Flask framework<br>
+                • uv for ultra-fast package management<br>
+                • Gunicorn replacing legacy uWSGI<br>
+                • Nginx for high-performance reverse proxy
+              </p>
+            </div>
+          </div>
+          
+          <div class="col-md-6">
+            <div class="feature-card">
+              <div class="feature-icon text-start">
+                <i class="fas fa-rocket"></i>
+              </div>
+              <h4 class="feature-title">Developer Experience</h4>
+              <p class="feature-text">
+                • Simple Makefile commands for easy management<br>
+                • Hot-reload development environment<br>
+                • Comprehensive logging and monitoring<br>
+                • Clean, maintainable codebase
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- Stats Section -->
+    <div class="stats-section">
+      <div class="container">
+        <div class="row">
+          <div class="col-md-3">
+            <div class="stat-item">
+              <span class="stat-number">3.11</span>
+              <div class="stat-label">Python Version</div>
+            </div>
+          </div>
+          <div class="col-md-3">
+            <div class="stat-item">
+              <span class="stat-number">21ms</span>
+              <div class="stat-label">Package Install Time</div>
+            </div>
+          </div>
+          <div class="col-md-3">
+            <div class="stat-item">
+              <span class="stat-number">100%</span>
+              <div class="stat-label">Docker Optimized</div>
+            </div>
+          </div>
+          <div class="col-md-3">
+            <div class="stat-item">
+              <span class="stat-number">⚡</span>
+              <div class="stat-label">uv Fast</div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- Footer -->
+    <div class="footer-section">
+      <div class="container">
+        <div class="row">
+          <div class="col-12">
+            <p class="mb-2">
+              <i class="fas fa-heart" style="color: #ff6b6b;"></i>
+              Built with modern Flask, Docker, and uv
+            </p>
+            <p class="mb-0">
+              <small>&copy; 2025 Flask Docker App | 
+              <a href="https://github.com" class="text-light">
+                <i class="fab fa-github"></i> Source Code
+              </a>
+              </small>
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
 
-  <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
-  <script src="/static/js/ie10-viewport-bug-workaround.js"></script>
+  <!-- Bootstrap 5 JavaScript -->
+  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+  
+  <!-- Smooth scrolling -->
+  <script>
+    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+      anchor.addEventListener('click', function (e) {
+        e.preventDefault();
+        document.querySelector(this.getAttribute('href')).scrollIntoView({
+          behavior: 'smooth'
+        });
+      });
+    });
+  </script>
 </body>
 </html>
diff --git a/app/templates/security-report.html b/app/templates/security-report.html
new file mode 100644
index 0000000..74a59ca
--- /dev/null
+++ b/app/templates/security-report.html
@@ -0,0 +1,952 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <meta name="description" content="Trivy Security Report for Flask Docker Application">
+  <meta name="author" content="Flask Docker Team">
+  
+  <title>🔒 Security Report - Flask Docker App</title>
+
+  <!-- Bootstrap 5 and FontAwesome -->
+  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+  <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
+  <link href="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.min.css" rel="stylesheet">
+  
+  <!-- Custom styles -->
+  <style>
+    :root {
+      --critical-color: #dc3545;
+      --high-color: #fd7e14;
+      --medium-color: #ffc107;
+      --low-color: #28a745;
+      --info-color: #17a2b8;
+      --bg-dark: #1a1d23;
+      --bg-card: #2d3748;
+      --text-primary: #f8f9fa;
+      --text-secondary: #adb5bd;
+      --border-color: #495057;
+    }
+
+    body {
+      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+      background: linear-gradient(135deg, var(--bg-dark) 0%, #2c3e50 100%);
+      min-height: 100vh;
+      color: var(--text-primary);
+    }
+
+    .navbar {
+      background: rgba(26, 29, 35, 0.95) !important;
+      backdrop-filter: blur(10px);
+      border-bottom: 1px solid var(--border-color);
+    }
+
+    .main-container {
+      padding: 2rem 0;
+    }
+
+    .security-card {
+      background: var(--bg-card);
+      border: 1px solid var(--border-color);
+      border-radius: 15px;
+      padding: 1.5rem;
+      margin-bottom: 2rem;
+      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
+      transition: all 0.3s ease;
+    }
+
+    .security-card:hover {
+      transform: translateY(-5px);
+      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
+    }
+
+    .card-header {
+      border-bottom: 1px solid var(--border-color);
+      background: transparent;
+      padding: 1rem 0;
+      margin-bottom: 1rem;
+    }
+
+    .severity-badge {
+      padding: 0.5rem 1rem;
+      border-radius: 20px;
+      font-size: 0.875rem;
+      font-weight: 600;
+      text-transform: uppercase;
+      letter-spacing: 0.5px;
+    }
+
+    .severity-critical {
+      background: var(--critical-color);
+      color: white;
+    }
+
+    .severity-high {
+      background: var(--high-color);
+      color: white;
+    }
+
+    .severity-medium {
+      background: var(--medium-color);
+      color: #212529;
+    }
+
+    .severity-low {
+      background: var(--low-color);
+      color: white;
+    }
+
+    .summary-stats {
+      display: grid;
+      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+      gap: 1rem;
+      margin-bottom: 2rem;
+    }
+
+    .stat-card {
+      background: var(--bg-card);
+      border: 1px solid var(--border-color);
+      border-radius: 10px;
+      padding: 1.5rem;
+      text-align: center;
+      position: relative;
+      overflow: hidden;
+    }
+
+    .stat-card::before {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+      height: 4px;
+      background: linear-gradient(90deg, var(--critical-color), var(--high-color), var(--medium-color), var(--low-color));
+    }
+
+    .stat-number {
+      font-size: 2.5rem;
+      font-weight: 700;
+      margin-bottom: 0.5rem;
+      color: var(--text-primary);
+    }
+
+    .stat-label {
+      color: var(--text-secondary);
+      font-size: 0.875rem;
+      text-transform: uppercase;
+      letter-spacing: 1px;
+    }
+
+    .vulnerability-item {
+      background: rgba(255, 255, 255, 0.05);
+      border: 1px solid var(--border-color);
+      border-radius: 8px;
+      padding: 1rem;
+      margin-bottom: 1rem;
+      transition: all 0.2s ease;
+    }
+
+    .vulnerability-item:hover {
+      background: rgba(255, 255, 255, 0.1);
+      border-color: var(--high-color);
+    }
+
+    .vuln-header {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      margin-bottom: 0.5rem;
+    }
+
+    .vuln-id {
+      font-family: 'Monaco', 'Consolas', monospace;
+      font-size: 0.875rem;
+      color: var(--info-color);
+      font-weight: 600;
+    }
+
+    .vuln-title {
+      font-size: 0.95rem;
+      color: var(--text-secondary);
+      margin: 0.5rem 0;
+      line-height: 1.4;
+    }
+
+    .vuln-details {
+      display: grid;
+      grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
+      gap: 1rem;
+      font-size: 0.875rem;
+    }
+
+    .detail-item {
+      display: flex;
+      flex-direction: column;
+    }
+
+    .detail-label {
+      color: var(--text-secondary);
+      font-size: 0.75rem;
+      text-transform: uppercase;
+      margin-bottom: 0.25rem;
+    }
+
+    .detail-value {
+      color: var(--text-primary);
+      font-weight: 500;
+    }
+
+    .chart-container {
+      background: var(--bg-card);
+      border: 1px solid var(--border-color);
+      border-radius: 15px;
+      padding: 2rem;
+      margin-bottom: 2rem;
+      position: relative;
+      height: 400px;
+    }
+
+    .chart-container canvas {
+      max-height: 300px !important;
+      width: 100% !important;
+    }
+
+    .scan-status {
+      display: inline-flex;
+      align-items: center;
+      gap: 0.5rem;
+      padding: 0.5rem 1rem;
+      border-radius: 20px;
+      font-size: 0.875rem;
+      font-weight: 500;
+    }
+
+    .status-clean {
+      background: rgba(40, 167, 69, 0.2);
+      color: var(--low-color);
+      border: 1px solid var(--low-color);
+    }
+
+    .status-issues {
+      background: rgba(220, 53, 69, 0.2);
+      color: var(--critical-color);
+      border: 1px solid var(--critical-color);
+    }
+
+    .loading {
+      text-align: center;
+      padding: 3rem;
+      color: var(--text-secondary);
+    }
+
+    .error {
+      background: rgba(220, 53, 69, 0.1);
+      border: 1px solid var(--critical-color);
+      border-radius: 8px;
+      padding: 1rem;
+      color: var(--critical-color);
+      margin: 1rem 0;
+    }
+
+    .tab-pane {
+      animation: fadeIn 0.3s ease-in-out;
+    }
+
+    @keyframes fadeIn {
+      from { opacity: 0; transform: translateY(10px); }
+      to { opacity: 1; transform: translateY(0); }
+    }
+
+    .nav-pills .nav-link {
+      background: rgba(255, 255, 255, 0.1);
+      border: 1px solid var(--border-color);
+      color: var(--text-secondary);
+      margin-right: 0.5rem;
+      margin-bottom: 0.5rem;
+    }
+
+    .nav-pills .nav-link.active {
+      background: var(--high-color);
+      border-color: var(--high-color);
+      color: white;
+    }
+
+    .metadata {
+      background: rgba(255, 255, 255, 0.05);
+      border-radius: 8px;
+      padding: 1rem;
+      margin-bottom: 1rem;
+      font-size: 0.875rem;
+    }
+
+    .back-button {
+      background: var(--bg-card);
+      border: 1px solid var(--border-color);
+      color: var(--text-primary);
+      padding: 0.5rem 1rem;
+      border-radius: 8px;
+      text-decoration: none;
+      transition: all 0.2s ease;
+    }
+
+    .back-button:hover {
+      background: var(--high-color);
+      border-color: var(--high-color);
+      color: white;
+      text-decoration: none;
+    }
+
+    @media (max-width: 768px) {
+      .summary-stats {
+        grid-template-columns: repeat(2, 1fr);
+      }
+      
+      .vuln-details {
+        grid-template-columns: 1fr;
+      }
+    }
+  </style>
+</head>
+
+<body>
+  <!-- Navigation -->
+  <nav class="navbar navbar-expand-lg">
+    <div class="container">
+      <a class="navbar-brand d-flex align-items-center" href="/">
+        <i class="fas fa-shield-alt me-2 text-warning"></i>
+        <span class="text-light">Flask Docker Security</span>
+      </a>
+      <div class="ms-auto">
+        <a href="/" class="back-button">
+          <i class="fas fa-arrow-left me-1"></i> Back to App
+        </a>
+      </div>
+    </div>
+  </nav>
+
+  <div class="container main-container">
+    <!-- Header -->
+    <div class="text-center mb-4">
+      <h1 class="display-5 fw-bold mb-3">
+        <i class="fas fa-shield-alt text-warning me-3"></i>
+        Security Report
+      </h1>
+      <p class="lead text-secondary">
+        Comprehensive Trivy security analysis for Flask Docker application
+      </p>
+      <div class="metadata">
+        <div class="row">
+          <div class="col-md-4">
+            <strong>Scan Date:</strong> <span id="scan-date">Loading...</span>
+          </div>
+          <div class="col-md-4">
+            <strong>Scanner:</strong> Trivy
+          </div>
+          <div class="col-md-4">
+            <strong>Version:</strong> <span id="trivy-version">Latest</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- Summary Statistics -->
+    <div id="summary-stats" class="summary-stats">
+      <!-- Populated by JavaScript -->
+    </div>
+
+    <!-- Charts Section -->
+    <div class="row mb-4">
+      <div class="col-md-6">
+        <div class="chart-container">
+          <h5 class="mb-3">Vulnerability Distribution</h5>
+          <div style="position: relative; height: 300px;">
+            <canvas id="severityChart"></canvas>
+          </div>
+        </div>
+      </div>
+      <div class="col-md-6">
+        <div class="chart-container">
+          <h5 class="mb-3">Scan Results Overview</h5>
+          <div style="position: relative; height: 300px;">
+            <canvas id="scanResultsChart"></canvas>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- Report Tabs -->
+    <div class="security-card">
+      <ul class="nav nav-pills mb-4" id="reportTabs" role="tablist">
+        <li class="nav-item" role="presentation">
+          <button class="nav-link active" id="image-tab" data-bs-toggle="pill" data-bs-target="#image-report" type="button" role="tab">
+            <i class="fab fa-docker me-1"></i> Image Scan
+          </button>
+        </li>
+        <li class="nav-item" role="presentation">
+          <button class="nav-link" id="dockerfile-tab" data-bs-toggle="pill" data-bs-target="#dockerfile-report" type="button" role="tab">
+            <i class="fas fa-file-code me-1"></i> Dockerfile Scan
+          </button>
+        </li>
+        <li class="nav-item" role="presentation">
+          <button class="nav-link" id="filesystem-tab" data-bs-toggle="pill" data-bs-target="#filesystem-report" type="button" role="tab">
+            <i class="fas fa-folder-open me-1"></i> Filesystem Scan
+          </button>
+        </li>
+      </ul>
+
+      <div class="tab-content" id="reportTabsContent">
+        <!-- Docker Image Report -->
+        <div class="tab-pane fade show active" id="image-report" role="tabpanel">
+          <div class="d-flex justify-content-between align-items-center mb-3">
+            <h4><i class="fab fa-docker me-2"></i>Docker Image Vulnerabilities</h4>
+            <div id="image-status" class="scan-status">
+              <i class="fas fa-spinner fa-spin"></i> Loading...
+            </div>
+          </div>
+          <div id="image-vulnerabilities" class="loading">
+            <i class="fas fa-spinner fa-spin fa-2x mb-3"></i><br>
+            Loading image scan results...
+          </div>
+        </div>
+
+        <!-- Dockerfile Report -->
+        <div class="tab-pane fade" id="dockerfile-report" role="tabpanel">
+          <div class="d-flex justify-content-between align-items-center mb-3">
+            <h4><i class="fas fa-file-code me-2"></i>Dockerfile Misconfigurations</h4>
+            <div id="dockerfile-status" class="scan-status">
+              <i class="fas fa-spinner fa-spin"></i> Loading...
+            </div>
+          </div>
+          <div id="dockerfile-issues" class="loading">
+            <i class="fas fa-spinner fa-spin fa-2x mb-3"></i><br>
+            Loading Dockerfile scan results...
+          </div>
+        </div>
+
+        <!-- Filesystem Report -->
+        <div class="tab-pane fade" id="filesystem-report" role="tabpanel">
+          <div class="d-flex justify-content-between align-items-center mb-3">
+            <h4><i class="fas fa-folder-open me-2"></i>Filesystem Analysis</h4>
+            <div id="filesystem-status" class="scan-status">
+              <i class="fas fa-spinner fa-spin"></i> Loading...
+            </div>
+          </div>
+          <div id="filesystem-results" class="loading">
+            <i class="fas fa-spinner fa-spin fa-2x mb-3"></i><br>
+            Loading filesystem scan results...
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <!-- Bootstrap JavaScript -->
+  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.js"></script>
+
+  <!-- Security Report JavaScript -->
+  <script>
+    class SecurityReportDashboard {
+      constructor() {
+        this.charts = {};
+        this.reportData = {};
+        this.init();
+      }
+
+      async init() {
+        try {
+          await this.loadReportData();
+          this.renderSummaryStats();
+          this.renderCharts();
+          this.renderReports();
+          this.updateScanDate();
+        } catch (error) {
+          console.error('Error loading security reports:', error);
+          this.showError('Failed to load security reports');
+        }
+      }
+
+      async loadReportData() {
+        const reports = ['image-scan', 'dockerfile-scan', 'fs-scan'];
+        
+        for (const report of reports) {
+          try {
+            const response = await fetch(`/api/security-report/${report}`);
+            if (response.ok) {
+              this.reportData[report] = await response.json();
+            } else {
+              console.warn(`Failed to load ${report}:`, response.status);
+              this.reportData[report] = { Results: [] };
+            }
+          } catch (error) {
+            console.warn(`Error loading ${report}:`, error);
+            this.reportData[report] = { Results: [] };
+          }
+        }
+      }
+
+      renderSummaryStats() {
+        const stats = this.calculateStats();
+        const container = document.getElementById('summary-stats');
+        
+        container.innerHTML = `
+          <div class="stat-card">
+            <div class="stat-number text-danger">${stats.critical}</div>
+            <div class="stat-label">Critical</div>
+          </div>
+          <div class="stat-card">
+            <div class="stat-number text-warning">${stats.high}</div>
+            <div class="stat-label">High</div>
+          </div>
+          <div class="stat-card">
+            <div class="stat-number text-info">${stats.medium}</div>
+            <div class="stat-label">Medium</div>
+          </div>
+          <div class="stat-card">
+            <div class="stat-number text-success">${stats.low}</div>
+            <div class="stat-label">Low</div>
+          </div>
+          <div class="stat-card">
+            <div class="stat-number">${stats.total}</div>
+            <div class="stat-label">Total Issues</div>
+          </div>
+        `;
+      }
+
+      calculateStats() {
+        let critical = 0, high = 0, medium = 0, low = 0;
+
+        Object.values(this.reportData).forEach(report => {
+          if (report.Results) {
+            report.Results.forEach(result => {
+              if (result.Vulnerabilities) {
+                result.Vulnerabilities.forEach(vuln => {
+                  switch (vuln.Severity) {
+                    case 'CRITICAL': critical++; break;
+                    case 'HIGH': high++; break;
+                    case 'MEDIUM': medium++; break;
+                    case 'LOW': low++; break;
+                  }
+                });
+              }
+              if (result.Misconfigurations) {
+                result.Misconfigurations.forEach(misc => {
+                  switch (misc.Severity) {
+                    case 'CRITICAL': critical++; break;
+                    case 'HIGH': high++; break;
+                    case 'MEDIUM': medium++; break;
+                    case 'LOW': low++; break;
+                  }
+                });
+              }
+            });
+          }
+        });
+
+        return {
+          critical,
+          high,
+          medium,
+          low,
+          total: critical + high + medium + low
+        };
+      }
+
+      renderCharts() {
+        this.renderSeverityChart();
+        this.renderScanResultsChart();
+      }
+
+      renderSeverityChart() {
+        const stats = this.calculateStats();
+        const ctx = document.getElementById('severityChart').getContext('2d');
+        
+        this.charts.severity = new Chart(ctx, {
+          type: 'doughnut',
+          data: {
+            labels: ['Critical', 'High', 'Medium', 'Low'],
+            datasets: [{
+              data: [stats.critical, stats.high, stats.medium, stats.low],
+              backgroundColor: [
+                'rgb(220, 53, 69)',
+                'rgb(253, 126, 20)',
+                'rgb(255, 193, 7)',
+                'rgb(40, 167, 69)'
+              ],
+              borderWidth: 2,
+              borderColor: '#2d3748'
+            }]
+          },
+          options: {
+            responsive: true,
+            maintainAspectRatio: false,
+            aspectRatio: 1,
+            plugins: {
+              legend: {
+                position: 'bottom',
+                labels: {
+                  color: '#f8f9fa',
+                  padding: 15
+                }
+              }
+            }
+          }
+        });
+      }
+
+      renderScanResultsChart() {
+        const imageResults = this.reportData['image-scan']?.Results?.length || 0;
+        const dockerfileResults = this.reportData['dockerfile-scan']?.Results?.length || 0;
+        const fsResults = this.reportData['fs-scan']?.Results?.length || 0;
+
+        const ctx = document.getElementById('scanResultsChart').getContext('2d');
+        
+        this.charts.results = new Chart(ctx, {
+          type: 'bar',
+          data: {
+            labels: ['Image', 'Dockerfile', 'Filesystem'],
+            datasets: [{
+              label: 'Results Found',
+              data: [imageResults, dockerfileResults, fsResults],
+              backgroundColor: [
+                'rgba(54, 162, 235, 0.8)',
+                'rgba(255, 99, 132, 0.8)',
+                'rgba(255, 205, 86, 0.8)'
+              ],
+              borderColor: [
+                'rgb(54, 162, 235)',
+                'rgb(255, 99, 132)',
+                'rgb(255, 205, 86)'
+              ],
+              borderWidth: 1,
+              borderRadius: 5
+            }]
+          },
+          options: {
+            responsive: true,
+            maintainAspectRatio: false,
+            aspectRatio: 1.2,
+            plugins: {
+              legend: {
+                display: false
+              }
+            },
+            scales: {
+              y: {
+                beginAtZero: true,
+                max: Math.max(imageResults, dockerfileResults, fsResults) + 2,
+                ticks: {
+                  color: '#f8f9fa',
+                  stepSize: 1
+                },
+                grid: {
+                  color: '#495057'
+                }
+              },
+              x: {
+                ticks: {
+                  color: '#f8f9fa'
+                },
+                grid: {
+                  display: false
+                }
+              }
+            }
+          }
+        });
+      }
+
+      renderReports() {
+        this.renderImageReport();
+        this.renderDockerfileReport();
+        this.renderFilesystemReport();
+      }
+
+      renderImageReport() {
+        const container = document.getElementById('image-vulnerabilities');
+        const statusElement = document.getElementById('image-status');
+        const data = this.reportData['image-scan'];
+
+        if (!data || !data.Results || data.Results.length === 0) {
+          container.innerHTML = '<div class="text-center text-success"><i class="fas fa-check-circle fa-2x mb-3"></i><br>No vulnerabilities found in Docker image</div>';
+          statusElement.innerHTML = '<i class="fas fa-check-circle"></i> Clean';
+          statusElement.className = 'scan-status status-clean';
+          return;
+        }
+
+        let vulnerabilityCount = 0;
+        let html = '';
+
+        data.Results.forEach(result => {
+          if (result.Vulnerabilities && result.Vulnerabilities.length > 0) {
+            html += `<h5 class="mb-3"><i class="fas fa-package me-2"></i>${result.Target}</h5>`;
+            
+            // Sort vulnerabilities by severity (Critical -> High -> Medium -> Low)
+            const severityOrder = { 'CRITICAL': 0, 'HIGH': 1, 'MEDIUM': 2, 'LOW': 3, 'UNKNOWN': 4 };
+            const sortedVulns = result.Vulnerabilities.sort((a, b) => {
+              const severityA = severityOrder[a.Severity] ?? 5;
+              const severityB = severityOrder[b.Severity] ?? 5;
+              if (severityA !== severityB) {
+                return severityA - severityB;
+              }
+              // Secondary sort by VulnerabilityID if same severity
+              return a.VulnerabilityID.localeCompare(b.VulnerabilityID);
+            });
+            
+            sortedVulns.forEach(vuln => {
+              vulnerabilityCount++;
+              html += this.renderVulnerability(vuln);
+            });
+          }
+        });
+
+        if (vulnerabilityCount > 0) {
+          statusElement.innerHTML = `<i class="fas fa-exclamation-triangle"></i> ${vulnerabilityCount} Issues`;
+          statusElement.className = 'scan-status status-issues';
+        } else {
+          statusElement.innerHTML = '<i class="fas fa-check-circle"></i> Clean';
+          statusElement.className = 'scan-status status-clean';
+        }
+
+        container.innerHTML = html || '<div class="text-center text-success"><i class="fas fa-check-circle fa-2x mb-3"></i><br>No vulnerabilities found</div>';
+      }
+
+      renderDockerfileReport() {
+        const container = document.getElementById('dockerfile-issues');
+        const statusElement = document.getElementById('dockerfile-status');
+        const data = this.reportData['dockerfile-scan'];
+
+        if (!data || !data.Results || data.Results.length === 0) {
+          container.innerHTML = '<div class="text-center text-success"><i class="fas fa-check-circle fa-2x mb-3"></i><br>No misconfigurations found in Dockerfile</div>';
+          statusElement.innerHTML = '<i class="fas fa-check-circle"></i> Clean';
+          statusElement.className = 'scan-status status-clean';
+          return;
+        }
+
+        let issueCount = 0;
+        let html = '';
+
+        data.Results.forEach(result => {
+          if (result.Misconfigurations && result.Misconfigurations.length > 0) {
+            // Sort misconfigurations by severity (Critical -> High -> Medium -> Low)
+            const severityOrder = { 'CRITICAL': 0, 'HIGH': 1, 'MEDIUM': 2, 'LOW': 3, 'UNKNOWN': 4 };
+            const sortedMisconfigs = result.Misconfigurations.sort((a, b) => {
+              const severityA = severityOrder[a.Severity] ?? 5;
+              const severityB = severityOrder[b.Severity] ?? 5;
+              if (severityA !== severityB) {
+                return severityA - severityB;
+              }
+              // Secondary sort by ID if same severity
+              return a.ID.localeCompare(b.ID);
+            });
+            
+            sortedMisconfigs.forEach(misc => {
+              issueCount++;
+              html += this.renderMisconfiguration(misc);
+            });
+          }
+        });
+
+        if (issueCount > 0) {
+          statusElement.innerHTML = `<i class="fas fa-exclamation-triangle"></i> ${issueCount} Issues`;
+          statusElement.className = 'scan-status status-issues';
+        } else {
+          statusElement.innerHTML = '<i class="fas fa-check-circle"></i> Clean';
+          statusElement.className = 'scan-status status-clean';
+        }
+
+        container.innerHTML = html || '<div class="text-center text-success"><i class="fas fa-check-circle fa-2x mb-3"></i><br>No misconfigurations found</div>';
+      }
+
+      renderFilesystemReport() {
+        const container = document.getElementById('filesystem-results');
+        const statusElement = document.getElementById('filesystem-status');
+        const data = this.reportData['fs-scan'];
+
+        if (!data || !data.Results || data.Results.length === 0) {
+          container.innerHTML = '<div class="text-center text-success"><i class="fas fa-check-circle fa-2x mb-3"></i><br>No issues found in filesystem scan</div>';
+          statusElement.innerHTML = '<i class="fas fa-check-circle"></i> Clean';
+          statusElement.className = 'scan-status status-clean';
+          return;
+        }
+
+        let issueCount = 0;
+        let html = '';
+        const severityOrder = { 'CRITICAL': 0, 'HIGH': 1, 'MEDIUM': 2, 'LOW': 3, 'UNKNOWN': 4 };
+
+        data.Results.forEach(result => {
+          html += `<h5 class="mb-3"><i class="fas fa-file me-2"></i>${result.Target}</h5>`;
+          
+          // Collect and sort all issues by severity
+          let allIssues = [];
+          
+          if (result.Vulnerabilities && result.Vulnerabilities.length > 0) {
+            result.Vulnerabilities.forEach(vuln => {
+              allIssues.push({type: 'vulnerability', data: vuln, severity: vuln.Severity});
+            });
+          }
+
+          if (result.Secrets && result.Secrets.length > 0) {
+            result.Secrets.forEach(secret => {
+              allIssues.push({type: 'secret', data: secret, severity: 'CRITICAL'});
+            });
+          }
+
+          if (result.Misconfigurations && result.Misconfigurations.length > 0) {
+            result.Misconfigurations.forEach(misc => {
+              allIssues.push({type: 'misconfiguration', data: misc, severity: misc.Severity});
+            });
+          }
+          
+          // Sort all issues by severity
+          allIssues.sort((a, b) => {
+            const severityA = severityOrder[a.severity] ?? 5;
+            const severityB = severityOrder[b.severity] ?? 5;
+            return severityA - severityB;
+          });
+          
+          // Render sorted issues
+          allIssues.forEach(issue => {
+            issueCount++;
+            switch(issue.type) {
+              case 'vulnerability':
+                html += this.renderVulnerability(issue.data);
+                break;
+              case 'secret':
+                html += this.renderSecret(issue.data);
+                break;
+              case 'misconfiguration':
+                html += this.renderMisconfiguration(issue.data);
+                break;
+            }
+          });
+        });
+
+        if (issueCount > 0) {
+          statusElement.innerHTML = `<i class="fas fa-exclamation-triangle"></i> ${issueCount} Issues`;
+          statusElement.className = 'scan-status status-issues';
+        } else {
+          statusElement.innerHTML = '<i class="fas fa-check-circle"></i> Clean';
+          statusElement.className = 'scan-status status-clean';
+        }
+
+        container.innerHTML = html || '<div class="text-center text-success"><i class="fas fa-check-circle fa-2x mb-3"></i><br>No issues found</div>';
+      }
+
+      renderVulnerability(vuln) {
+        const severityClass = `severity-${vuln.Severity.toLowerCase()}`;
+        return `
+          <div class="vulnerability-item">
+            <div class="vuln-header">
+              <span class="vuln-id">${vuln.VulnerabilityID}</span>
+              <span class="severity-badge ${severityClass}">${vuln.Severity}</span>
+            </div>
+            <div class="vuln-title">${vuln.Title || 'No title available'}</div>
+            <div class="vuln-details">
+              <div class="detail-item">
+                <div class="detail-label">Package</div>
+                <div class="detail-value">${vuln.PkgName || 'N/A'}</div>
+              </div>
+              <div class="detail-item">
+                <div class="detail-label">Installed Version</div>
+                <div class="detail-value">${vuln.InstalledVersion || 'N/A'}</div>
+              </div>
+              <div class="detail-item">
+                <div class="detail-label">Fixed Version</div>
+                <div class="detail-value">${vuln.FixedVersion || 'Not available'}</div>
+              </div>
+              <div class="detail-item">
+                <div class="detail-label">Reference</div>
+                <div class="detail-value">
+                  ${vuln.References && vuln.References.length > 0 
+                    ? `<a href="${vuln.References[0]}" target="_blank" class="text-info">View Details</a>` 
+                    : 'N/A'}
+                </div>
+              </div>
+            </div>
+          </div>
+        `;
+      }
+
+      renderMisconfiguration(misc) {
+        const severityClass = `severity-${misc.Severity.toLowerCase()}`;
+        return `
+          <div class="vulnerability-item">
+            <div class="vuln-header">
+              <span class="vuln-id">${misc.ID}</span>
+              <span class="severity-badge ${severityClass}">${misc.Severity}</span>
+            </div>
+            <div class="vuln-title">${misc.Title || 'No title available'}</div>
+            <div class="vuln-details">
+              <div class="detail-item">
+                <div class="detail-label">Type</div>
+                <div class="detail-value">${misc.Type || 'Configuration'}</div>
+              </div>
+              <div class="detail-item">
+                <div class="detail-label">Category</div>
+                <div class="detail-value">${misc.Category || 'N/A'}</div>
+              </div>
+              <div class="detail-item">
+                <div class="detail-label">Status</div>
+                <div class="detail-value">${misc.Status || 'N/A'}</div>
+              </div>
+              <div class="detail-item">
+                <div class="detail-label">Reference</div>
+                <div class="detail-value">
+                  ${misc.PrimaryURL 
+                    ? `<a href="${misc.PrimaryURL}" target="_blank" class="text-info">View Details</a>` 
+                    : 'N/A'}
+                </div>
+              </div>
+            </div>
+          </div>
+        `;
+      }
+
+      renderSecret(secret) {
+        return `
+          <div class="vulnerability-item">
+            <div class="vuln-header">
+              <span class="vuln-id">SECRET-${secret.RuleID}</span>
+              <span class="severity-badge severity-critical">SECRET</span>
+            </div>
+            <div class="vuln-title">${secret.Title || 'Secret detected'}</div>
+            <div class="vuln-details">
+              <div class="detail-item">
+                <div class="detail-label">Category</div>
+                <div class="detail-value">${secret.Category || 'Secret'}</div>
+              </div>
+              <div class="detail-item">
+                <div class="detail-label">Location</div>
+                <div class="detail-value">${secret.StartLine ? `Line ${secret.StartLine}` : 'N/A'}</div>
+              </div>
+            </div>
+          </div>
+        `;
+      }
+
+      updateScanDate() {
+        document.getElementById('scan-date').textContent = new Date().toLocaleString();
+      }
+
+      showError(message) {
+        const container = document.querySelector('.main-container');
+        container.innerHTML = `
+          <div class="error text-center">
+            <i class="fas fa-exclamation-triangle fa-3x mb-3"></i>
+            <h3>Error Loading Security Reports</h3>
+            <p>${message}</p>
+            <p>Please ensure the security scan reports are generated and accessible.</p>
+          </div>
+        `;
+      }
+    }
+
+    // Initialize dashboard when page loads
+    document.addEventListener('DOMContentLoaded', () => {
+      new SecurityReportDashboard();
+    });
+  </script>
+</body>
+</html>
\ No newline at end of file
diff --git a/app/uwsgi.ini b/app/uwsgi.ini
deleted file mode 100644
index 332f5c2..0000000
--- a/app/uwsgi.ini
+++ /dev/null
@@ -1,15 +0,0 @@
-[uwsgi]
-#application's base folder
-base = /var/www/app
-#python module to import
-module = app
-#the variable that holds a flask application inside the module imported at line #6
-callable = app
-#socket file's location
-socket = /var/www/app/uwsgi.sock
-#permissions for the socket file
-chmod-socket    = 666
-#Log directory
-logto = /var/log/uwsgi/app/app.log
-
-chdir = /var/www/app
diff --git a/docker-compose.yml b/docker-compose.yml
index 3e673fb..d7fc374 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -1,5 +1,7 @@
 
-nginx:
+services:
+  nginx:
     build: .
     ports:
-      - "80:80"
+      - "8080:8080"
+    restart: unless-stopped
diff --git a/nginx/flask.conf b/nginx/flask.conf
index 8cca391..4b2c791 100644
--- a/nginx/flask.conf
+++ b/nginx/flask.conf
@@ -1,14 +1,17 @@
 
 server {
-    listen      80;
+    listen      8080;
     server_name localhost;
     charset     utf-8;
     client_max_body_size 75M;
 
    
     location / {
-        include uwsgi_params;
-        uwsgi_pass unix:/var/www/app/uwsgi.sock;
+        proxy_pass http://127.0.0.1:8000;
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_set_header X-Forwarded-Proto $scheme;
     }
 
     location /static {
diff --git a/supervisor/supervisord.conf b/supervisor/supervisord.conf
index 2651367..59ed57c 100644
--- a/supervisor/supervisord.conf
+++ b/supervisor/supervisord.conf
@@ -1,8 +1,18 @@
 [supervisord]
 nodaemon=true
+user=appuser
+logfile=/var/log/supervisor/supervisord.log
+pidfile=/var/run/supervisord.pid
 
 [program:nginx]
 command=/usr/sbin/nginx
+user=appuser
+autorestart=true
 
-[program:uwsgi]
-command =/usr/local/bin/uwsgi --ini  /var/www/app/uwsgi.ini
+[program:gunicorn]
+command=gunicorn --bind 127.0.0.1:8000 --workers 3 --user appuser --group appuser app:app
+directory=/var/www/app
+user=appuser
+autorestart=true
+stdout_logfile=/var/log/supervisor/gunicorn_stdout.log
+stderr_logfile=/var/log/supervisor/gunicorn_stderr.log