Skip to content

Architecture générale

Présentation

BTP Chantier Pro est une application web SaaS construite sur une architecture moderne et découplée. Le frontend et le backend sont séparés et communiquent via des API REST et le protocole temps réel de Supabase.

Schéma de l'architecture

Navigateur web | | HTTPS | Nginx (reverse proxy) | |--- / --> Frontend React (port 80/443) |--- /api/ --> Backend Node.js (port 3001) |--- /supabase/ --> Supabase self-hosted (port 8000) |--- /storage/ --> Supabase Storage (MinIO)

Composants principaux

Frontend

  • Framework : React 18 avec Vite
  • Langage : JavaScript
  • Styles : CSS personnalisé avec variables
  • Rendu : Single Page Application (SPA)
  • Déploiement : fichiers statiques servis par Nginx

Backend

  • Runtime : Node.js 20
  • Framework : Express.js
  • Gestionnaire de processus : PM2
  • Rôle : génération de PDF, exports Excel, traitements lourds

Base de données

  • Moteur : PostgreSQL 15
  • Hébergement : Supabase self-hosted
  • Sécurité : Row Level Security (RLS) activé sur toutes les tables
  • Accès : via le SDK Supabase depuis le frontend

Authentification

  • Fournisseur : Supabase Auth
  • Méthode : email et mot de passe
  • Sessions : JWT (JSON Web Token)
  • Durée de session : 7 jours

Stockage de fichiers

  • Solution : Supabase Storage (MinIO)
  • Buckets : documents-chantier, photos-chantier
  • Accès : URLs signées avec expiration de 5 minutes

Infrastructure

  • Hyperviseur : Proxmox VE
  • Serveur physique : Intel NUC 16 Go RAM, 1 To SSD
  • Système d'exploitation : Debian 12
  • Conteneurisation : Docker Compose pour Supabase
  • Domaine : waali.at (OVH)
  • SSL : Let's Encrypt via Certbot

Flux de données

Authentification

  1. L'utilisateur saisit ses identifiants dans le frontend
  2. Le frontend envoie la requête à Supabase Auth
  3. Supabase Auth vérifie les identifiants et retourne un JWT
  4. Le JWT est stocké localement dans le navigateur
  5. Toutes les requêtes suivantes incluent le JWT dans l'en-tête Authorization

Lecture des données

  1. Le frontend appelle le SDK Supabase avec le JWT
  2. Supabase vérifie le JWT et applique les politiques RLS
  3. PostgreSQL retourne les données autorisées
  4. Le frontend affiche les données

Écriture des données

  1. Le frontend envoie la donnée via le SDK Supabase
  2. Supabase vérifie les permissions RLS
  3. PostgreSQL enregistre la donnée
  4. Supabase retourne la confirmation
  5. Le frontend met à jour l'interface

Génération de PDF

  1. Le frontend envoie les données au backend Node.js via l'API
  2. Node.js génère le PDF avec jsPDF ou Puppeteer
  3. Node.js retourne le fichier au frontend
  4. Le frontend déclenche le téléchargement

Environnements

EnvironnementURLDescription
Productionhttps://app.waali.atEnvironnement de production
Documentationhttps://docs.waali.atDocumentation officielle
APIhttps://api.waali.atBackend Node.js
Supabasehttps://supabase.waali.atConsole Supabase

BTP Chantier Pro