Linux Dash: Dashboard ligero para el monitoreo de sistemas Linux

Linux Dash es un panel de control web diseñado específicamente para sistemas Linux, reconocido por su interfaz limpia y elegante, así como por su mínimo consumo de recursos. El proyecto está construido sobre un stack tecnológico web moderno y ofrece implementaciones de backend en cuatro lenguajes: Node.js, Go, Python y PHP, proporcionando a los administradores de sistemas una solución conveniente para monitorear el rendimiento del servidor en tiempo real.

Visión general y características principales del proyecto

El diseño del proyecto se centra en ser ultraligero. Ocupa menos de 400KB en disco después de eliminar el directorio .git, lo que lo hace ideal para entornos con recursos limitados.

Una de sus principales características es el soporte multilenguaje para el backend, permitiendo a los usuarios elegir la implementación que mejor se adapte a su stack tecnológico.

// Ejemplo de inicio de servidor con Node.js
const express = require('express');
const servidor = express();
servidor.use(express.static('app'));
servidor.listen(8080, () => {
    console.log('Linux Dash escuchando en el puerto 8080');
});

// Ejemplo de inicio de servidor con Go
package main

import (
    "net/http"
)

func main() {
    http.Handle("/", http.FileServer(http.Dir("app")))
    http.ListenAndServe(":8080", nil)
}

El monitoreo en tiempo real se logra mediante un mecanismo dual que combina WebSocket y APIs RESTful, garantizando la frescura de los datos. Su arquitectura es altamente modular; cada funcionalidad de monitoreo es un plugin independiente.

// Ejemplo conceptual de un plugin AngularJS para CPU
angular.module('linuxDash')
  .directive('monitorCpu', function(servicioDatos) {
    return {
      restrict: 'E',
      template: '<div class="panel">Gráfico de CPU</div>',
      link: function(scope) {
        servicioDatos.obtener('cpu_stats', function(datos) {
          scope.actualizarGrafico(datos);
        });
      }
    };
  });

Cubre una amplia gama de métricas del sistema.

La interfaz de usuario es responsive, adaptándose a distintos tamaños de pantalla.

/* Ejemplo de diseño responsive */
.componente {
    width: 300px;
    margin: 10px;
    float: left;
}

@media (max-width: 768px) {
    .componente {
        width: 100%;
        margin: 10px 0;
        float: none;
    }
}

El stack tecnológico incluye AngularJS (versión 1.3.4) para el frontend, Gulp como herramienta de construcción, Smoothie Charts para gráficos en tiempo real, SortableJS para funcionalidad de arrastrar y soltar, y la combinación de WebSocket con APIs RESTful para la comunicación.

Arquitectura de soporte multilenguaje para backend

La flexibilidad de despliegue es un punto fuerte. Los usuarios pueden seleccionar antre:

• Node.js: Ofrece el mejor rendimiento, con soporte nativo para WebSocket y un modelo de E/S no bloqueante.
• Go: Se compila en un único binario, facilitando el despliegue. Excelente para entornos de producción y con alta capacidad de concurrencia.
• Python: Ideal para equipos familiarizados con Python y entornos de desarrollo/pruebas.
• PHP: Se integra de forma nativa con servidores web como Apache o Nginx, siendo la opción con mayor compatibilidad, especialmante en hosts compartidos.

Todas las implementaciones comparten un diseño arquitectónico común basado en un script de recopilación de datos (linux_json_api.sh). Esto garantiza que la lógica de obtención de métricas del sistema sea consistente, independientemente del lenguaje backend utilizado. El flujo de datos es uniforme: el cliente solicita un módulo, el backend invoca el script de shell correspondiente y devuelve los datos en formato JSON.

Mecanismo de recopilación de datos en tiempo real y comnuicación por WebSocket

Para lograr actualizaciones instantáneas, Linux Dash implementa una comunicación bidireccional mediante WebSocket. El cliente establece una conexión persistente con el servidor.

// Lógica simplificada del servicio WebSocket en el cliente
var conexionWS = {
  socket: null,
  manejadores: {}
};

function iniciarConexion() {
  var protocolo = (location.protocol === 'https:' ? 'wss://' : 'ws://');
  var urlSocket = protocolo + window.location.hostname + ':' + window.location.port;
  
  conexionWS.socket = new WebSocket(urlSocket);
  
  conexionWS.socket.onmessage = function(evento) {
    var respuesta = JSON.parse(evento.data);
    var nombreModulo = respuesta.moduleName;
    var datosModulo = JSON.parse(respuesta.output);
    
    // Despachar datos al manejador registrado para este módulo
    if (conexionWS.manejadores[nombreModulo]) {
      conexionWS.manejadores[nombreModulo](datosModulo);
    }
  };
}

En el servidor, especialmente en la versión Node.js, se manejan las conexiones WebSocket entrantes. Cuando un cliente envía una solicitud de módulo, el servidor ejecuta el script de shell correspondiente y transmite los resultados de vuelta a través de la misma conexión socket.

Este diseño incluye estrategias de optimización como el reuso de conexiones, la posibilidad de solicitar múltiples módulos por conexión y mecanismos de recuperación ante fallos de conexión, como el fallback a sondeo HTTP. Los diferentes módulos pueden configurarse con frecuencias de actualización distintas según su naturaleza (ej., CPU: 1-2s, Memoria: 3-5s, Disco: 30-60s).

Diseño de componentes frontend con AngularJS

El frontend está construido siguiendo los principios de diseño basado en componentes de AngularJS, lo que promueve la reutilización, el mantenimiento y la extensibilidad. La aplicación se estructura en capas: un módulo de aplicación principal que coordina servicios centrales (para comunicación con el backend y gestión de datos), directivas componentes (cada gráfico o widget de monitoreo es una directiva autónoma) y una capa de configuración de rutas.

Esta arquitectura modular facilita enormemente la adición de nuevos módulos de monitoreo, ya que desarrolladores de la comunidad pueden crear sus propios plugins siguiendo las interfaces y contratos establecidos por el framework existente.