Linknode Energy Monitor

Real-Time Power Monitoring by Murray Kopit • Powered by Fly.io

Real-Time Energy Monitoring System (at my house!) - Smart Power Consumption Dashboard

3
Active Services
100%
Uptime
24/7
Monitoring
Live
Status

Live Infrastructure Metrics at My House!

⚡ Real-Time Power Consumption

Live
--
24h Min
--
24h Avg
--
24h Max
--
24h Cost

🔌 Service Status

InfluxDB
Checking...
Eagle Monitor
Checking...
Grafana
Checking...
📦 Packets Today
--
👁️ Active Viewers
--
⏱️ Packet Interval
--

📊 Power Consumption Trends

Open full dashboard in new tab →

Technology Stack

Zero-Dependency Frontend

There is no framework. The frontend is 100% vanilla.

No Frameworks

  • No React, Vue, Angular, or Svelte
  • No component library (Material UI, Chakra, Ant Design)
  • No CSS framework (Tailwind, Bootstrap)
  • No build step (Webpack, Vite, esbuild)
  • No npm dependencies for the frontend

Everything Hand-Coded

  • Pure CSS in a single <style> tag (~900 lines)
  • Vanilla ES6+ JavaScript with fetch() API
  • Hand-coded SVG gauge with trigonometric arc calculations
  • CSS Grid + Flexbox for responsive layout
  • CSS Keyframe animations (no animation libraries)
Frontend dependencies - 0
Build time - 0ms (no build step)
Bundle size - ~50KB (just HTML/CSS/JS)
Time to Interactive - < 1 second
Lighthouse Performance - 95+

This demonstrates that modern, polished UIs don't require heavy frameworks. The animated gradient background, floating particles, glassmorphism cards, and real-time gauge are all pure CSS/JS. Most "AI built this" demos ship a React app with numerous npm packages because that's what their training data looks like. This argues the opposite: AI can help you build less, not more, finding the minimal solution rather than the conventional one.

Comprehensive Technology Stack

Languages & Markup
Python 3.11 - Backend services and data processing
JavaScript (ES6+) - Vanilla JS, no frameworks - lightweight and fast
HTML5 - Semantic markup with Schema.org structured data
CSS3 - Modern styling with Grid, Flexbox, animations
Flux - InfluxDB time-series query language
XML - Eagle-200 smart meter data format
Frontend Graphics & Visualization
Custom SVG Gauge - Hand-coded with trigonometric arc path calculations
CSS3 Animations - Keyframe animations (gradient, float, pulse, fadeIn)
CSS3 Transforms - translateY, scale, rotate with GPU acceleration
CSS3 Filters - drop-shadow, blur, backdrop-filter for glass effects
Linear Gradients - Background animations and text gradients
Grafana 11.4.0 - Embedded dashboards via iframe
Grafana Plugins - briangann-gauge-panel, volkovlabs-echarts-panel
Adaptive Resolution - Flux aggregateWindow() decimates data to match screen width
Backend Services
Flask 3.0.0 - Lightweight Python web framework
Flask-CORS - Cross-origin resource sharing
Werkzeug 3.0.1 - WSGI toolkit
influxdb-client - Time-series database integration
Nginx Alpine - High-performance reverse proxy with rate limiting
Databases & Storage
InfluxDB 2.7 - Purpose-built time-series database
Flux Queries - Functional data scripting language
5-Year Retention - 43,800 hours of historical data
Persistent Volumes - Durable storage on Fly.io
Infrastructure & Deployment
Fly.io - Global edge computing platform
Docker - Containerized microservices (Alpine-based for minimal footprint)
Private Mesh Network - Secure internal service communication (*.internal)
Auto-scaling - Automatic instance management with health checks
CDN & Edge Network
Cloudflare - Global anycast network with 300+ PoPs
DDoS Protection - Layer 3/4/7 attack mitigation
Brotli Compression - Modern compression at the edge
HTTP/2 + HTTP/3 (QUIC) - Multiplexed, UDP-based transport
TLS 1.3 with 0-RTT - Fast, secure connections
Early Hints (103) - Preload resources before HTML arrives
Rocket Loader - Async JavaScript optimization
Universal SSL - Wildcard certificate for all subdomains
CI/CD Pipeline
GitHub Actions - Automated workflows
Change Detection - Smart deployments via dorny/paths-filter
Auto-Rollback - Version capture and recovery on failure
Slack Integration - Native GitHub notifications
Testing & Quality
Playwright - E2E browser automation
axe-core - WCAG accessibility auditing
TypeScript - Type-safe test scripts
Visual Regression - Screenshot comparison testing
Security Stack
Semgrep - OWASP Top 10 + Flask/Python/JS scanning
Trivy - Docker image vulnerability scanning
Gitleaks - Secrets detection in code
Rate Limiting - Nginx zones (30r/s general, 10r/s API, 5r/s sensitive)
CSP Headers - Content Security Policy with specific directives
HSTS - HTTP Strict Transport Security
CORS Whitelist - Origin-specific cross-origin policies
IoT Integration
Eagle-200 - Rainforest smart meter bridge
Zigbee SEP - Smart Energy Profile protocol
BC Hydro Rates - Tiered pricing calculations
~9 Second Updates - Near real-time power monitoring
Progressive Web App
Web App Manifest - Installable on mobile/desktop
Responsive Icons - 192px, 512px, maskable variants
Theme Color - Native app feel

Project Economics

Monthly Infrastructure Cost - ~$15/month
Fly.io Hosting - 5 VMs (shared CPU, 256-512MB RAM)
Persistent Storage - 2GB for InfluxDB and Grafana data
Domain - ~$1/month (amortized annual cost)
Frontend Stack - $0
No React, Vue, Angular - Avoided complexity debt and bundle bloat
No CSS frameworks - No Tailwind/Bootstrap overhead
No build tooling - Zero Webpack/Vite configuration
No npm dependencies - Zero supply chain risk
Database & Visualization - $0
InfluxDB - Self-hosted open source (vs $50-200/mo for cloud)
Grafana - Self-hosted open source (vs $100-500/mo for Datadog)
DevOps & CI/CD - $0
GitHub Actions - Free tier for public repositories
Docker - Open source containerization
Automated deployments - No CircleCI/GitLab fees ($15-50/mo saved)
Security Stack - $0
Semgrep - Open source SAST (vs $30-100/mo for Snyk)
Trivy - Open source container scanning
Gitleaks - Open source secrets detection
Infrastructure Services - $0
Cloudflare Free Tier - CDN, DDoS protection, HTTP/3, compression
SSL/TLS Certificates - Universal SSL via Cloudflare + Let's Encrypt via Fly.io
Rate Limiting - Nginx built-in zones
Health Monitoring - Fly.io built-in checks
Total Savings
Typical SaaS stack for equivalent functionality - $300-1,000/month
This project - ~$15/month
Monthly savings - 95-98% cost reduction
🚀

Cloud Native Architecture

This energy monitoring system showcases a modern cloud-native application deployed on Fly.io's global edge network.

Built with containerization best practices and designed for global scalability.

Docker Fly.io Python

Real-Time Data Processing

Continuous monitoring of power consumption with sub-second data updates from Eagle-200 smart meter.

Time-series data stored in InfluxDB for efficient querying and visualization.

InfluxDB Grafana REST API
🔒

Secure & Reliable

Deployed across multiple regions with automatic failover and SSL encryption.

Built-in authentication and secure API endpoints protect your energy data.

HTTPS Auth Tokens Edge Network
Deployment Information:
Platform: Fly.io Global Edge Network
Services: Eagle Monitor, InfluxDB, Web Interface
Region: Automatically selected based on your location
Stack: Python/Flask, InfluxDB 2.x, Grafana

🚀 Witnessing the Future of IoT Development

What Makes This Special?

This entire energy monitoring platform - from IoT integration to real-time visualization - was built in under 24 hours using revolutionary AI-augmented development. What you're seeing isn't just a demo, it's live production infrastructure processing real energy data.

⚡ 10x Faster Delivery

Transform months of IoT development into days. Deploy production-ready monitoring solutions at unprecedented speed.

🔧 Full-Stack Excellence

From embedded systems to cloud infrastructure, from real-time processing to beautiful dashboards.

🌐 Global Scale

Auto-scaling, multi-region deployment, edge computing. Built for the demands of modern IoT.

Transform Your Business

  • IoT & Smart Home Integration - Connect any device, visualize any metric
  • Real-Time Data Platforms - Process millions of events with sub-second latency
  • Cloud Migration - Modernize legacy systems with containerized microservices
  • Custom Monitoring Solutions - Energy, Environmental, Industrial, Healthcare
24hrs Concept to Production
80% Cost Reduction
10x Faster Delivery

Ready to Accelerate Your IoT Journey?

Let's discuss how AI-augmented development can revolutionize your monitoring infrastructure.

🔧 Deployment Status

Version: Loading...
Build Date: Loading...
Branch: Loading...
Commit: Loading...
Build #: Loading...
Environment: Loading...
Morty Proxy This is a proxified and sanitized view of the page, visit original site.