# vazgiselle8-sys/monitor-recursos architecture

> Architecture diagram of the GitHub repository vazgiselle8-sys/monitor-recursos, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-10). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/vazgiselle8-sys/monitor-recursos
- Repository: https://github.com/vazgiselle8-sys/monitor-recursos

## Overview

Monitor de Recursos is a browser-based monitor for the Debian machine running its backend. A user opens the web interface; Express serves the frontend, while the browser receives live metrics over Socket.IO and can also request them through REST. The documented metric stages cover CPU, RAM/SWAP, disks, network, and operating-system information. The README describes these responsibilities, but no source excerpts were provided, so relationships below are limited to those it documents.

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_backend["Metrics backend"]
  node_express["Express server"]
  node_metric_collection["Metric collection"]
  node_rest_api["REST API"]
end

subgraph group_realtime["Live delivery"]
  node_socketio["Socket.IO service"]
  node_periodic_updates["Periodic updates"]
end

subgraph group_web["Web interface"]
  node_frontend_page["Monitor page"]
  node_frontend_app["Dashboard behavior"]
  node_frontend_styles["Responsive styling"]
end

subgraph group_metrics["Metric domains"]
  node_cpu["CPU metrics"]
  node_memory["RAM and SWAP"]
  node_disks["Disk metrics"]
  node_network["Network metrics"]
  node_os_info["OS information"]
end

node_user(("User"))
node_browser(("Browser client"))
node_systeminformation["systeminformation"]
node_debian_resources[("Debian resources")]

node_user -->|"opens monitor"| node_browser
node_browser -->|"requests page"| node_express
node_express -->|"serves static files"| node_frontend_page
node_frontend_page -->|"loads script"| node_frontend_app
node_frontend_page -->|"loads styles"| node_frontend_styles
node_frontend_app -->|"opens connection"| node_socketio
node_browser -->|"requests JSON"| node_rest_api
node_rest_api -->|"returns metrics"| node_metric_collection
node_socketio -->|"starts updates"| node_periodic_updates
node_periodic_updates -->|"reads every 2s"| node_metric_collection
node_metric_collection -->|"queries metrics"| node_systeminformation
node_systeminformation -->|"reads resources"| node_debian_resources
node_metric_collection -->|"collects"| node_cpu
node_metric_collection -->|"collects"| node_memory
node_metric_collection -->|"collects"| node_disks
node_metric_collection -->|"collects"| node_network
node_metric_collection -->|"collects"| node_os_info
node_periodic_updates -->|"emits sistema"| node_frontend_app
node_frontend_app -->|"renders"| node_cpu
node_frontend_app -->|"renders"| node_memory
node_frontend_app -->|"renders"| node_disks
node_frontend_app -->|"renders"| node_network
node_frontend_app -->|"renders"| node_os_info

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_express,node_metric_collection,node_rest_api,node_user,node_browser toneBlue
class node_socketio,node_periodic_updates,node_debian_resources toneAmber
class node_frontend_page,node_frontend_app,node_frontend_styles toneMint
class node_cpu,node_memory,node_disks,node_network,node_os_info toneRose
class node_systeminformation toneIndigo
```

## Components

### Metrics backend

- **Express server**
- **Metric collection**
- **REST API**

### Live delivery

- **Socket.IO service**
- **Periodic updates**

### Web interface

- **Monitor page**
- **Dashboard behavior**
- **Responsive styling**

### Metric domains

- **CPU metrics**
- **RAM and SWAP**
- **Disk metrics**
- **Network metrics**
- **OS information**

### Other components

- **User**
- **Browser client**
- **systeminformation**
- **Debian resources**

## Connections

- User → Browser client: opens monitor (evidence: `README.md`)
- Browser client → Express server: requests page (evidence: `README.md`)
- Express server → Monitor page: serves static files (evidence: `README.md`)
- Monitor page → Dashboard behavior: loads script (evidence: `README.md`)
- Monitor page → Responsive styling: loads styles (evidence: `README.md`)
- Dashboard behavior → Socket.IO service: opens connection (evidence: `README.md`)
- Browser client → REST API: requests JSON (evidence: `README.md`)
- REST API → Metric collection: returns metrics (evidence: `README.md`)
- Socket.IO service → Periodic updates: starts updates (evidence: `README.md`)
- Periodic updates → Metric collection: reads every 2s (evidence: `README.md`)
- Metric collection → systeminformation: queries metrics (evidence: `README.md`)
- systeminformation → Debian resources: reads resources (evidence: `README.md`)
- Metric collection → CPU metrics: collects (evidence: `README.md`)
- Metric collection → RAM and SWAP: collects (evidence: `README.md`)
- Metric collection → Disk metrics: collects (evidence: `README.md`)
- Metric collection → Network metrics: collects (evidence: `README.md`)
- Metric collection → OS information: collects (evidence: `README.md`)
- Periodic updates → Dashboard behavior: emits sistema (evidence: `README.md`)
- Dashboard behavior → CPU metrics: renders (evidence: `README.md`)
- Dashboard behavior → RAM and SWAP: renders (evidence: `README.md`)
- Dashboard behavior → Disk metrics: renders (evidence: `README.md`)
- Dashboard behavior → Network metrics: renders (evidence: `README.md`)
- Dashboard behavior → OS information: renders (evidence: `README.md`)
