Surveiller la santé de son application avec des outils gratuits

Introduction au monitoring d’applications

Le monitoring applicatif est essentiel pour maintenir la qualité de service et anticiper les problèmes. Dans cet article, nous découvrirons comment mettre en place une surveillance efficace avec des outils gratuits.

Pourquoi surveiller la santé de son application ?

Les enjeux du monitoring

• Prévention des pannes : Détecter les problèmes avant qu’ils n’affectent les utilisateurs
• Performance optimale : Identifier les goulots d’étranglement et optimiser les performances
• Expérience utilisateur : Garantir une expérience fluide et rapide
• Diagnostic rapide : Réduire le temps de résolution des incidents

Métriques essentielles à surveiller

• Disponibilité (uptime) : Pourcentage de temps où l’application est accessible
• Temps de réponse : Latence des requêtes et pages
• Taux d’erreurs : Erreurs HTTP, exceptions et crashs
• Utilisation des ressources : CPU, mémoire, stockage
• Throughput : Nombre de requêtes par seconde

Outils gratuits de monitoring

1. Uptime Kuma

Surveillance de disponibilité simple et efficace

# Installation avec Docker
docker run -d --restart=always -p 3001:3001 -v uptime-kuma:/app/data --name uptime-kuma louislam/uptime-kuma:1

Fonctionnalités :

• Interface web intuitive
• Notifications multi-canaux (email, Slack, Discord)
• Monitoring HTTP, TCP, ping
• Tableaux de bord personnalisables

2. Prometheus + Grafana

Stack complète pour métriques avancées

# docker-compose.yml
version: '3.8'
services:
  prometheus:
    image: prom/prometheus
    ports:
      - "9090:9090"
    volumes:
      - ./prometheus.yml:/etc/prometheus/prometheus.yml

  grafana:
    image: grafana/grafana
    ports:
      - "3000:3000"
    environment:
      - GF_SECURITY_ADMIN_PASSWORD=admin

Configuration Prometheus :

# prometheus.yml
global:
  scrape_interval: 15s

scrape_configs:
  - job_name: 'my-app'
    static_configs:
      - targets: ['localhost:8080']
    metrics_path: '/metrics'

3. New Relic (version gratuite)

APM professionnel avec plan gratuit

// Installation pour Node.js
npm install newrelic

// newrelic.js
exports.config = {
  app_name: ['Mon Application'],
  license_key: 'votre_licence_key',
  logging: {
    level: 'info'
  }
}

4. Sentry

Monitoring d’erreurs et performance

# Installation
npm install @sentry/node @sentry/tracing

// Configuration
const Sentry = require("@sentry/node");

Sentry.init({
  dsn: "VOTRE_DSN_SENTRY",
  tracesSampleRate: 1.0,
});

Mise en place d’un dashboard personnalisé

Configuration Grafana

1. Connexion des sources de données
2. Création des tableaux de bord
3. Configuration des alertes

{
  "dashboard": {
    "title": "Health Dashboard",
    "panels": [
      {
        "title": "Response Time",
        "type": "graph",
        "targets": [
          {
            "expr": "http_request_duration_seconds",
            "legendFormat": "{{method}} {{route}}"
          }
        ]
      }
    ]
  }
}

Métriques personnalisées

// Express.js avec Prometheus
const promClient = require('prom-client');
const register = promClient.register;

// Compteur de requêtes
const httpRequestsTotal = new promClient.Counter({
  name: 'http_requests_total',
  help: 'Total HTTP requests',
  labelNames: ['method', 'route', 'status']
});

// Histogramme des temps de réponse
const httpDuration = new promClient.Histogram({
  name: 'http_request_duration_seconds',
  help: 'HTTP request duration',
  labelNames: ['method', 'route']
});

app.use((req, res, next) => {
  const start = Date.now();
  
  res.on('finish', () => {
    const duration = (Date.now() - start) / 1000;
    
    httpRequestsTotal.labels(req.method, req.route?.path || req.path, res.statusCode).inc();
    httpDuration.labels(req.method, req.route?.path || req.path).observe(duration);
  });
  
  next();
});

// Endpoint pour Prometheus
app.get('/metrics', (req, res) => {
  res.set('Content-Type', register.contentType);
  res.send(register.metrics());
});

Alertes et notifications

Configuration des seuils

# Alertes Prometheus
groups:
  - name: app_alerts
    rules:
      - alert: HighResponseTime
        expr: http_request_duration_seconds > 2
        for: 5m
        labels:
          severity: warning
        annotations:
          summary: "Temps de réponse élevé détecté"
          
      - alert: HighErrorRate
        expr: rate(http_requests_total{status=~"5.."}[5m]) > 0.1
        for: 2m
        labels:
          severity: critical

Intégrations de notification

// Webhook Slack pour alertes
const webhook = 'https://hooks.slack.com/services/...';

async function sendAlert(message) {
  await fetch(webhook, {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({
      text: `🚨 Alert: ${message}`,
      channel: '#monitoring'
    })
  });
}

Monitoring côté client

Web Vitals

// Mesure des Core Web Vitals
import {getCLS, getFID, getFCP, getLCP, getTTFB} from 'web-vitals';

function sendToAnalytics(metric) {
  // Envoi vers votre système de monitoring
  fetch('/api/metrics', {
    method: 'POST',
    body: JSON.stringify(metric)
  });
}

getCLS(sendToAnalytics);
getFID(sendToAnalytics);
getFCP(sendToAnalytics);
getLCP(sendToAnalytics);
getTTFB(sendToAnalytics);

Real User Monitoring (RUM)

// Monitoring utilisateur réel
class RUMMonitor {
  constructor() {
    this.startTime = performance.now();
    this.setupEventListeners();
  }

  setupEventListeners() {
    // Erreurs JavaScript
    window.addEventListener('error', (event) => {
      this.reportError({
        message: event.message,
        filename: event.filename,
        lineno: event.lineno,
        colno: event.colno
      });
    });

    // Performance navigation
    window.addEventListener('load', () => {
      setTimeout(() => {
        const perfData = performance.getEntriesByType('navigation')[0];
        this.reportPerformance(perfData);
      }, 0);
    });
  }

  reportError(error) {
    fetch('/api/errors', {
      method: 'POST',
      body: JSON.stringify({
        ...error,
        timestamp: Date.now(),
        userAgent: navigator.userAgent,
        url: window.location.href
      })
    });
  }

  reportPerformance(perfData) {
    fetch('/api/performance', {
      method: 'POST',
      body: JSON.stringify({
        loadTime: perfData.loadEventEnd - perfData.navigationStart,
        domReady: perfData.domContentLoadedEventEnd - perfData.navigationStart,
        firstPaint: perfData.responseEnd - perfData.navigationStart,
        timestamp: Date.now()
      })
    });
  }
}

new RUMMonitor();

Bonnes pratiques

1. Définir des SLO (Service Level Objectives)

# Exemples de SLO
availability: 99.9%  # Maximum 8.77 heures d'indisponibilité par an
response_time: 95% des requêtes < 200ms
error_rate: < 0.1% d'erreurs 5xx

2. Monitoring progressif

• Commencer par les métriques de base (uptime, response time)
• Ajouter progressivement des métriques métiers
• Implementer les alertes par priorité

3. Documentation et runbooks

# Runbook - Temps de réponse élevé

## Symptômes
- Temps de réponse > 2 secondes
- Alertes dans Grafana

## Diagnostic
1. Vérifier la charge CPU/mémoire
2. Analyser les logs d'erreurs
3. Contrôler les requêtes en base

## Actions
1. Redémarrer l'application si nécessaire
2. Optimiser les requêtes lentes
3. Augmenter les ressources temporairement

Outils supplémentaires gratuits

Surveillance d’infrastructure

• Netdata : Monitoring temps réel
• Zabbix : Solution enterprise gratuite
• Nagios Core : Monitoring classique

Services cloud gratuits

• Google Cloud Monitoring (quotas gratuits)
• AWS CloudWatch (métriques de base gratuites)
• Azure Monitor (plan gratuit)

Conclusion

La surveillance de la santé applicative n’est plus un luxe mais une nécessité. Avec les outils gratuits disponibles aujourd’hui, vous pouvez mettre en place un système de monitoring robuste sans investissement initial.

Points clés à retenir :

• Commencez simple avec Uptime Kuma
• Évoluez vers Prometheus/Grafana pour des besoins avancés
• Implémentez les alertes progressivement
• Documentez vos procédures de diagnostic

Un bon monitoring vous permettra de dormir tranquille et d’assurer la meilleure expérience possible à vos utilisateurs !