ITA | ENG
BLOG AND EMILI / Gestione dati flessibile, non è il solito CRUD.

Gestione dati flessibile, non è il solito CRUD.

data editor ui, gui di gestione anagrafica

Alzi la mano chi nella sua vita da dev ha realizzato almeno un’interfaccia di gestione anagrafica (CRUD). Mi aspetto moltissime adesioni. 
Ora alzi la mano chi ne ha realizzate decine o persino centinaia.

Il caro e vecchio CRUD non perde mai di fascino, c’è sempre quell’entità che non puoi estrarre da un altro sistema, di cui non esiste una API e che deve essere gestita all’interno dell’applicazione. 

Una conversazione a cui spesso assistiamo:
Tavola disegno 2-1Una storia capitata a tanti. 


Un subset minimo di funzionalità

Una gestione anagrafica ha alcune funzionalità irrinunciabili:

  • Visualizzazione tabellare
  • Creazione
  • Modifica
  • Eliminazione
  • Gestione basilare degli accessi
  • Validazione formale e applicativa per creazione e modifica

Nelle applicazioni di una certa complessità questo subset minimo viene esteso:

  • Eliminazione fisica e logica
  • Logging delle modifiche e degli autori delle stesse
  • Azioni collegate (ad esempio attiva/disattiva, notifica, etc)
  • Gestione di workflow in seguito alle operazioni fondamentali
  • Caso per caso possono essere richieste molte altre feature specifiche

Nei casi più semplici l’effort di sviluppo è gestibile (e nosioso). Nei casi più complessi è problematico ed error prone.


Una soluzione percorribile?

In relazione alla tecnologia dell’applicativo esistono librerie open source e commerciali per la gestione di questo task (in Python ad esempio NiceGUI, Streamlit, etc). Qualsiasi libreria o componente di terze parti deve essere integrato con eventuali personalizzazioni, logiche di validazione, stile della UI. Le librerie open source a volte vengono deprecate e potrebbero non avere tutte le funzionalità necessarie.

Una soluzione custom? Nella logica dello strumento flessibile le funzionalità potrebbero essere:

  • Visualizzazione tabellare:
    • Colonne
    • Filtri
    • Formattazione
    • Gestione permessi
  • Creazione e modifica:
    • Campi differenziati a seconda dell’operazione
    • Formattazione
    • Gestione permessi
  • Possibilità di estendere le feature caso per caso
  • Tema grafico 
  • Callback
  • Creazione di call to action
  • Import ed export (Excel?)
  • Low code (preferibilmente)

Con un po’ di lavoro si può ottenere questo risultato:

 


Ti piacerebbe far parte di un team affiatato?

In AND EMILI stiamo cercando un WEB DEVELOPER

INVIACI IL TUO CV


 

Data Editor UI, una GUI di gestione anagrafica sotto steroidi

Grazie alle potenzialità del framework Microsoft .NET [e un po’ di creatività] è possibile realizzare uno strumento con queste caratteristiche:

  • Creazione di un editor con codice fortemente tipizzato
  • Gestione di qualsiasi entità, sia essa via database o API
  • Gestione dell’accesso al database automatizzata e personalizzabile tramite Entity Framework Core
  • Integrazione con i database più diffusi (PostgreSQL, MySQL, Microsoft SQL Server)
  • Completa personalizzazione della vista tabellare: ordinamento, colonne, paginazione, formattazione, ricerca, filtri predefiniti, etc
  • Gestione dei form di creazione e modifica con personalizzazione di layout, campi, valori, permessi e testi
  • Validazione integrata ed estendibile
  • Gestione degli accessi estesa e personalizzabile 
  • Import e Export via Excel
  • Sistema di callback integrato
  • 100% async
  • Logging integrato ed estendibile
  • Estendibile tramite custom editor e call to actions
  • Pronto all’uso con poche righe di codice. Personalizzabile se necessario.

Lo stesso componente è anche utilizzabile come form standalone, sia in creazione che in modifica e integrabile in ogni sezione della web app per uniformare la logica di gestione.

L’implementazione è basata su alcune feature e caratteristiche di .NET:

  • Utilizzo di generics: ogni elemento è fortemente tipizzato in relazione all’entità che si sta gestendo (quindi non serve un ampio uso della reflection)
  • Creazione di controller a runtime: in fase di bootstrapping del sito, gli editor sono compilati e iniettati nella pipeline e nel routing dell’applicazione. L’integrazione è possibile attraverso i feature providers di ASP.NET 
  • Utilizzo di view components 
  • Utilizzo di partial views in Razor Class Library di cui è possibile fare l’override 
  • Possibilità di personalizzazione ed estensione sia funzionale che visuale
  • Limitata necessità di utilizzo di librerie per consentire un rapido aggiornamento tecnologico e avere il minimo delle dipendenze esterne


Ti piacerebbe far parte di un team affiatato?

In AND EMILI stiamo cercando un WEB DEVELOPER

INVIACI IL TUO CV


 

Casi d’uso

Qualsiasi sistema di gestione dati / backoffice può essere realizzato tramite Data Editor UI, vediamo due esempi rappresentativi.

Modulo backoffice per software di gestione del rischio

Il software in questione si occupa di calcolare ed effettuare la riduzione del rischio legato alla progettazione di elementi meccanici. Il database è composto da 95 tabelle di cui 40 di anagrafica legate alle singole proprietà e relazioni utilizzate per descrivere gli aspetti tecnici e quelli relativi ai calcoli affidabilistici. La necessità è quella di gestire tutte le anagrafiche in questione in modo flessibile, user friendly, con un’elevata personalizzazione e con una gestione del permessi definita a livello di entità e di singolo campo (R, RW).

Data Editor UI è intrinsecamente low code, in questa applicazione specifica sono state definite delle interfacce per differenziare i comportamenti necessari e basandosi su di esse sono state definite le relative interfacce per la gestione. In questo modo è stato possibile, con poche centinaia di righe di codice, gestire tutti i concetti dell’applicativo.

Gestione utenti

Gli utenti sono anch’essi entità in gergo informatico e come tali possono essere gestiti da Data Editor UI. Nel nostro caso utilizziamo la ASP.NET Core Identity per la gestione delle login che abbiamo ampiamente personalizzato per integrare i flussi OAuth, OpenId Connect, SAML2, custom login providers e tutti i flussi utente relativi. La libreria prevede un sistema per l’accesso alle tabelle utente (UserManager), Data Editor UI permette di integrare questo modulo in modo nativo, così da sfruttare la libreria sottostante riducendo il codice, i possibili bug e mantenendo tutte le caratteristiche. In un prossimo articolo analizzeremo anche questo componente.

 


Ti piacerebbe far parte di un team affiatato?

In AND EMILI stiamo cercando un WEB DEVELOPER

INVIACI IL TUO CV