██████ ██ ██ ███████ ██████ ██ ██ █████ ████████ ██████ ██ ██
██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██
██ ██ ██ ██ █████ ██████ ██ █ ██ ███████ ██ ██ ███████
██ ██ ██ ██ ██ ██ ██ ██ ███ ██ ██ ██ ██ ██ ██ ██
██████ ████ ███████ ██ ██ ███ ███ ██ ██ ██ ██████ ██ ██
Real-time geospatial intelligence & cyber threat monitoring dashboard
Features · Screenshots · Getting Started · Support This Project
OVERWATCH is a real-time geospatial intelligence platform that fuses live cyber threat data, flight surveillance, OSINT feeds, and regional security scanning into a single unified command dashboard. Powered by bleeding-edge web technologies with a dark cyberpunk aesthetic — glassmorphism panels, particle effects, radar sweeps, and neon-lit data streams.
Global Threat Overview — Live map with threat markers, sector trends, and intelligence feed
|
Geo Tracking |
Aerial Surveillance |
|
Sentinel Scan |
Intelligence Report |
|
Cyber Threats |
OSINT Feeds |
| Module | Description |
|---|---|
| Dashboard | Global threat overview with interactive Mapbox map, live threat markers color-coded by severity, real-time intel feed, sector trend analysis, and system status monitoring |
| Cyber Threats | CVE/vulnerability tracking from the National Vulnerability Database with CVSS scoring, severity filtering, and threat heatmap visualization |
| Geo Tracking | Real-time target tracking with animated trail lines, target classification (friendly / hostile / neutral / unknown), heading & speed telemetry, and fly-to-target navigation |
| OSINT Feeds | Geopolitical intelligence aggregation from GDELT with category filtering, sentiment tone analysis, and source statistics |
| Sentinel Scan | Regional security analysis with animated radar sweep, generated threat assessments, multi-domain indicators, and typewriter-animated intelligence reports |
| Surveillance | Live flight tracking via OpenSky Network with satellite/dark map toggle, altitude & speed telemetry, and click-to-track interaction |
- Glassmorphism UI — Frosted glass panels with backdrop blur and subtle glow borders
- Particle System — Canvas-rendered floating particles with proximity connection lines
- Radar Sweep — CSS conic-gradient radar animation for Sentinel scans
- Scan Line Effects — Animated horizontal scan lines across intelligence panels
- Typewriter Text — Character-by-character rendering for intelligence reports
- Animated Counters — Smooth count-up animations for all numeric displays
- Real-time Data — TanStack Query with configurable refetch intervals (10s – 5min)
- Staggered Animations — Cascading fade-in-up transitions across the UI
| Layer | Technology | Version |
|---|---|---|
| Framework | Next.js (App Router) | 16 |
| UI Library | React | 19 |
| Language | TypeScript | 5 |
| Styling | Tailwind CSS | 4 |
| Maps | Mapbox GL JS | 3 |
| Animation | Framer Motion | 12 |
| State | Zustand | 5 |
| Data Fetching | TanStack Query | 5 |
| Geospatial | Turf.js | 7 |
| Icons | Lucide React | 0.563 |
| Source | Type | Key Required? |
|---|---|---|
| NVD / NIST | CVE Vulnerabilities | No (public API) |
| GDELT Project | Geopolitical Intelligence | No (public API) |
| OpenSky Network | Flight Tracking | No (public API) |
| Mapbox | Map Tiles | Yes (free tier: 50k loads/mo) |
src/
├── app/ # Next.js App Router
│ ├── api/ # API proxy endpoints
│ │ ├── gdelt/ # GDELT article aggregation
│ │ ├── news/ # News feed proxy
│ │ ├── opensky/ # Flight data proxy
│ │ └── threats/ # NVD CVE data proxy
│ ├── cyber-threats/ # CVE tracking page
│ ├── geo-tracking/ # Target tracking page
│ ├── osint-feeds/ # OSINT intelligence page
│ ├── sentinel/ # Regional scan page
│ ├── surveillance/ # Flight surveillance page
│ ├── layout.tsx # Root layout (sidebar + topbar)
│ └── page.tsx # Main dashboard
├── components/
│ ├── effects/ # Visual effects
│ │ ├── CountUp.tsx # Animated number counter
│ │ ├── ParticleField.tsx # Canvas particle system
│ │ ├── RadarSweep.tsx # Radar animation
│ │ ├── StatusDot.tsx # Pulsing status indicator
│ │ └── TypewriterText.tsx # Character-by-character text
│ ├── layout/ # Layout components
│ │ ├── GlassPanel.tsx # Glassmorphism container
│ │ ├── Sidebar.tsx # Navigation sidebar
│ │ └── Topbar.tsx # Status bar header
│ └── map/
│ └── MapContainer.tsx # Mapbox GL wrapper
├── hooks/
│ └── useApiData.ts # TanStack Query hooks
├── lib/api/ # API client functions
│ ├── gdelt.ts # GDELT client
│ ├── news.ts # News aggregation
│ ├── opensky.ts # OpenSky client
│ └── threats.ts # NVD + threat generation
└── stores/ # Zustand state stores
├── mapStore.ts # Map viewport & style
├── sentinelStore.ts # Sentinel scan state
├── trackingStore.ts # Geo tracking targets
└── uiStore.ts # UI state (sidebar, etc.)
- Node.js 18.17 or later
- A free Mapbox access token
-
Clone the repository
git clone https://github.com/deegan4/overwatch.git cd overwatch -
Install dependencies
npm install
-
Configure environment
cp .env.local.example .env.local
Add your Mapbox token to
.env.local:NEXT_PUBLIC_MAPBOX_TOKEN=your_mapbox_token_here
-
Start the dev server
npm run dev
| Variable | Required | Description |
|---|---|---|
NEXT_PUBLIC_MAPBOX_TOKEN |
Yes | Mapbox GL access token (get one free) |
NEWSAPI_KEY |
No | NewsAPI key for enhanced news feeds (register) |
OTX_API_KEY |
No | AlienVault OTX key for threat intelligence |
ABUSEIPDB_KEY |
No | AbuseIPDB key for IP reputation data |
OVERWATCH is free, open-source, and built with passion.
If this project is useful to you or you just think it's cool,
consider buying me a coffee to support continued development.
Contributions are welcome! See CONTRIBUTING.md for guidelines.
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
This project is licensed under the MIT License. See LICENSE for details.
Built by deegan4
OVERWATCH — Operational Vigilance & Electronic Reconnaissance