🔍 Website Monitoring Platform

Full-stack website monitoring platform that uses Google Lighthouse to audit performance, SEO, accessibility, and best practices — with real-time progress tracking, team collaboration, and alerting.

┌─────────────────────────────────────────────────────────┐
│                    Website Monitoring                     │
│                                                          │
│  ┌──────────┐    ┌──────────┐    ┌──────────────────┐   │
│  │ Frontend  │───▶│ Backend  │───▶│  PostgreSQL (DB)  │   │
│  │ Next.js   │    │ Express  │    │  via Supabase     │   │
│  │ Port 3000 │◀───│ Port 5000│    └──────────────────┘   │
│  └──────────┘    └──────────┘                            │
│       │               │                                  │
│       │               ▼                                  │
│       │          ┌──────────┐                            │
│       │          │Lighthouse│                            │
│       └─── SSE ──│ + Chrome │                            │
│       (progress) │ Headless │                            │
│                  └──────────┘                            │
└─────────────────────────────────────────────────────────┘

✨ Features

Feature	Status	Description
Lighthouse Audits	✅ Real	Performance, SEO, accessibility, best practices scores
Real-time Progress	✅ Real	Server-Sent Events stream during scans
Dashboard	✅ Real	Overview with charts, metrics, and website list
Performance Monitoring	✅ Real	Track scores over time with Recharts
SEO Analysis	✅ Real	SEO score tracking and recommendations
Uptime Monitoring	✅ Real	HTTP HEAD checks every 5 min, response time + SSL tracking
Alert Engine	✅ Real	Evaluates scans against thresholds, auto-resolves on recovery
Notifications	✅ Real	Email (Resend) + webhook delivery with debouncing
Admin Dashboard	✅ Real	System stats, user CRUD, org management (role-protected)
Billing & Usage	✅ Real	4 tiers (free/starter/pro/enterprise), usage bars, limit enforcement
Competitor Analysis	✅ Real	Lighthouse comparison + response time benchmarking
Team/Organization	✅ Real	Multi-user orgs with 4-level RBAC
Authentication	✅ Real	Supabase Auth (email, OAuth)
Scheduled Scans	✅ Real	Cron-based Lighthouse scans (6h) + uptime checks (5min)
Website Crawler	✅ Real	Crawl and discover pages on your websites

🛠 Tech Stack

Layer	Technology	Cost
Frontend	Next.js 15, React 19, TypeScript, Tailwind CSS 4, Shadcn/UI	Free
Backend	Express.js, TypeScript, Node.js 18+	Free
Database	PostgreSQL via Supabase	Free tier
Auth	Supabase Auth	Free tier
Auditing	Google Lighthouse + Headless Chrome	Free (OSS)
Charts	Recharts + Chart.js	Free (OSS)
CI/CD	GitHub Actions	Free (public repos)
Containers	Docker + Docker Compose	Free
Linting	ESLint + Prettier	Free (OSS)
Testing	Jest + Supertest + Testing Library	Free (OSS)
Email	Resend	Free tier (3000/mo)
Pre-commit	Husky	Free (OSS)

🚀 Quick Start

Prerequisites

• Node.js 18+
• npm
• Docker & Docker Compose (for full stack)
• Supabase account (free tier)

Option 1: Local Development

# Clone the repo
git clone <repo-url>
cd website-monitoring

# Install root dependencies (Husky, concurrently)
npm install

# Setup backend
cd website-monitoring-backend
cp .env.example .env
npm install
npm run build
cd ..

# Setup frontend
cd website-monitoring-frontend
cp .env.example .env    # Fill in your Supabase keys
npm install
cd ..

# Run everything
npm run dev

Option 2: Docker Compose

# Copy and fill in environment variables
cp .env.example .env

# Start all services
npm run docker:up

# Access at http://localhost:3000

📁 Project Structure

website-monitoring/
├── website-monitoring-backend/    # Express.js API + Lighthouse engine
│   ├── src/
│   │   ├── index.ts              # Server entry, health check, routing
│   │   └── routes/
│   │       └── lighthouse.ts     # Lighthouse audit + SSE progress
│   ├── Dockerfile
│   └── package.json
│
├── website-monitoring-frontend/   # Next.js 15 dashboard
│   ├── src/
│   │   ├── app/                  # Pages & API routes (20+ endpoints)
│   │   ├── components/           # React components (dashboard, UI, auth)
│   │   ├── services/             # Business logic (scanning, monitoring)
│   │   └── types/                # TypeScript type definitions
│   ├── Dockerfile
│   └── package.json
│
├── website-monitoring-devops/     # Infrastructure
│   ├── docker-compose.yml        # Full stack orchestration
│   └── .devcontainer/            # VS Code Dev Container config
│
├── .github/
│   ├── workflows/
│   │   ├── backend.yml           # Backend CI: lint, test, build
│   │   ├── frontend.yml          # Frontend CI: lint, test, build
│   │   └── docker.yml            # Docker Compose integration test
│   └── pull_request_template.md
│
├── CONTRIBUTING.md               # Branch strategy, code review, guidelines
├── .env.example                  # Unified environment template
└── package.json                  # Root scripts (dev, build, test, lint)

🧪 Testing

# Run all tests (22 total)
npm test

# Backend only (11 tests: health, routes, validation, CORS, 404)
npm run test:backend

# Frontend only (11 tests: tier limits, chart components)
npm run test:frontend

📊 CI/CD Pipelines

Workflow	Trigger	What it does
backend.yml	Push/PR to backend	Lint → Test → Build (Node 18 & 20)
frontend.yml	Push/PR to frontend	Lint → Test → Build (Node 18 & 20)
docker.yml	Push/PR to main	Docker Compose build → Backend health check

🔑 Key API Routes

Route	Method	Description
/api/cron/uptime	GET	Runs uptime checks on all active websites
/api/cron/scan	GET	Triggers Lighthouse scans for due websites
/api/notifications/process	POST	Processes pending alerts and sends notifications
/api/admin/stats	GET	System-wide stats (admin only)
/api/admin/users	GET/PATCH/DELETE	User management (admin only)
/api/admin/organizations	GET/PATCH	Organization management (admin only)
/api/billing/usage	GET	Current org usage vs tier limits
/api/competitor-analysis	GET/POST	Competitor benchmarking

🏗 Tier System

Tier	Websites	Scans/mo	Members	Price
Free	3	50	2	$0
Starter	10	500	5	$9/mo
Professional	50	5,000	25	$29/mo
Enterprise	∞	∞	∞	$99/mo

🤝 Contributing

See CONTRIBUTING.md for branch strategy, code style, and PR process.

📄 License

ISC