docs: add comprehensive README

This commit is contained in:
2026-02-20 20:38:27 -08:00
parent 6dd679b8e0
commit 1f7d55818e

76
README.md Normal file
View File

@@ -0,0 +1,76 @@
# Homelab Topology Visualizer
A responsive, real-time dashboard and visualizer for your homelab infrastructure.
## Features Added via 10-Skill Integration
This project has been thoroughly enhanced with 10 specific infrastructure and development skills:
### 1. Backend & API Security \`api-security-hardening\`, \`nodejs-backend-patterns\`
- Implemented **Helmet** for HTTP response headers.
- Added **Rate Limiting** to prevent abuse on discovery endpoints.
- Structured Error Handling with an object-oriented hierarchy (\`AppError\`) and a global error catching middleware.
### 2. Observability & Logging \`observability-monitoring\`
- Converted from console logs to **Pino** structured logging.
- Includes a custom request logger middleware that outputs formatted JSON in production and readable logs via \`pino-pretty\` in development.
### 3. Real-Time WebSockets \`websocket-engineer\`
- Replaced HTTP polling with **Socket.IO** connections.
- The UI maintains a live connection with the server, receiving \`topology:update\` events exactly when new data is discovered.
- Features resilient reconnection with exponential backoff and connection status indicators in the dashboard footer.
### 4. Containerization \`docker\`
- Full local containerization.
- Features a **Multi-Stage Dockerfile** that builds the Vite frontend and serves via a lightweight Node.js Alpine image.
- A \`docker-compose.yml\` stack makes spinning up both the frontend and backend seamless. Includes a health-check endpoint.
### 5. Testing Infrastructure \`vitest\`
- Integrated **Vitest** for unit testing.
- Includes thorough coverage formatting color utility functions and Zustand store actions. Run with \`npm test\`.
### 6. Dashboards & Visualization \`data-visualizer\`
- Added Recharts-inspired KPI panels (\`MetricsBar.tsx\`).
- Included a pure CSS, screen-reader accessible bar chart mapping services to hosts (\`HostChart.tsx\`).
- Accessible colorblind-safe color loops are enforced.
### 7. Domain Types & Architecture \`infrastructure-monitoring\`, \`proxmox-admin\`, \`network-engineer\`
- **Virtualization:** Native TypeScript support for Proxmox VMs and LXC containers with resource metrics.
- **Networking:** Supported types for VLANs, subnets, and gateways.
- **Monitoring:** API latency and performance are actively measured for network mapping jobs.
## Running Locally
To run this application via Docker Compose:
\`\`\`bash
# Build and start the containers
docker-compose up -d --build
# View logs
docker-compose logs -f
\`\`\`
The applications will be running at:
- **Frontend Dashboard:** http://localhost:3000
- **Backend API:** http://localhost:3001
## Development
\`\`\`bash
# Install dependencies
npm ci
# Start the dev server
npm run dev
\`\`\`
## Testing
\`\`\`bash
# Run unit tests
npm test
# Run tests with coverage
npm run test:coverage
\`\`\`