Tutti i progetti

Reader XML CEI

Daniele Iobbi29 giugno 2026
Reader XML CEI

Ho sviluppato un’applicazione web per il CEI (Comitato Elettrotecnico Italiano) dedicata alla consultazione di norme tecniche in formato XML conformi allo standard STS (Standards Tag Suite) definito da NISO. Il visualizzatore converte i documenti normativi in una rappresentazione strutturata e li rende consultabili in modo ricco e interattivo, con un sistema di autenticazione e di distribuzione tracciata dei contenuti.

Caratteristiche principali

  • Rendering da AST: I documenti STS XML vengono convertiti lato server in un AST JSON strutturato e renderizzati con componenti dedicati, senza HTML intermedio, per un controllo preciso di ogni elemento normativo.
  • Navigazione avanzata: Indice gerarchico ad albero, collegamenti ipertestuali interni, ricerca full-text sull’intero contenuto e comandi di spostamento nel documento.
  • Confronto tra versioni: Visualizzazione affiancata di due edizioni dello stesso standard con diff strutturale per blocchi e barre di revisione che evidenziano le modifiche inline.
  • Calcolatore di formule: Le formule MathML calcolabili sono interattive: al click si apre una calcolatrice che riconosce variabili di input e output e valuta i risultati.
  • Annotazioni personali: L’utente può aggiungere note persistenti associate a punti specifici del documento, private e scopate per utente.
  • Autenticazione e tracciamento: Accesso sicuro tramite token JWT monouso scambiato con una sessione cookie, recupero file con cache di sessione e heartbeat per il monitoraggio della consultazione.
  • Schermate di stato: Ogni condizione (token scaduto, norma non autorizzata, connessione persa) ha una schermata dedicata con linguaggio visivo brand CEI.

Tecnologie

  • React: per un’interfaccia utente dinamica e reattiva (React 19 con React Compiler).
  • TypeScript: per la tipizzazione dei nodi AST e maggiore robustezza del codice.
  • Redux Toolkit: per la gestione dello stato e delle chiamate API con RTK Query.
  • Tailwind CSS e shadcn/ui: per uno stile moderno e componenti UI accessibili e coerenti.
  • Express e Node.js: per le API, la pipeline di conversione XML → AST e la logica di autenticazione server-side.
  • MongoDB: per la persistenza di annotazioni, sessioni e gestione dei token.
  • Docker: per l’orchestrazione dei servizi e il deploy tramite immagini pubblicate su container registry.

Conclusioni

L’applicazione offre un’esperienza di consultazione moderna e completa per le norme tecniche CEI, coniugando un rendering fedele dello standard STS con funzionalità avanzate di confronto, calcolo e annotazione, il tutto in un contesto sicuro e tracciato.