Creazione dell'interfaccia utente composita basata su microservizi

  • Articolo

Suggerimento

Questo contenuto è un estratto dell'eBook "Microservizi .NET: Architettura per le applicazioni .NET incluse in contenitori", disponibile in .NET Docs o come PDF scaricabile gratuitamente e da poter leggere offline.

Scarica PDF

.NET Microservices Architecture for Containerized .NET Applications eBook cover thumbnail.

L'architettura dei microservizi inizia spesso con la gestione dei dati e della logica sul lato server, ma in molti casi l'interfaccia utente viene ancora gestita come se fosse monolitica. Un approccio più avanzato tuttavia, denominato micro front-end, prevede la progettazione dell'interfaccia utente dell'applicazione basata anche sui microservizi. Ciò significa avere un'interfaccia utente composita generata dai microservizi, invece di avere i microservizi sul server e solo un'app client monolitica che utilizza i microservizi. Con questo approccio, i microservizi creati possono essere completati con la rappresentazione sia logica che visiva.

La figura 4-20 illustra l'approccio più semplice in cui i microservizi vengono utilizzati da un'applicazione client monolitica. Nel mezzo è ovviamente possibile avere un servizio MVC ASP.NET che genera il codice HTML e JavaScript. La figura è una rappresentazione semplificata che evidenzia la presenza di una sola interfaccia utente client (monolitica) che utilizza i microservizi, concentrati solo sulla logica e sui dati e non sulla forma dell'interfaccia utente (HTML e JavaScript).

Diagram of a monolithic UI app connecting to microservices.

Figura 4-20. Applicazione dell'interfaccia utente monolitica che utilizza i microservizi back-end

Un'interfaccia utente composita viene invece generata con precisione ed è composta dai microservizi stessi. Alcuni dei microservizi gestiscono la forma visiva di aree specifiche dell'interfaccia utente. La differenza principale è che sono presenti componenti dell'interfaccia utente client (ad esempio, le classi TypeScript) basati su modelli e che l'elemento dell'interfaccia utente di data shaping ViewModel di tali modelli deriva da ogni microservizio.

Durante l'avvio dell'applicazione client, ognuno dei componenti dell'interfaccia utente client (ad esempio, le classi TypeScript) si registra con un microservizio dell'infrastruttura in grado di fornire ViewModel per un determinato scenario. Se la forma del microservizio cambia, anche l'interfaccia utente cambia.

La figura 4-21 illustra una versione di questo approccio basato sull'interfaccia utente composita. Questo approccio è semplificato, perché si potrebbe disporre di altri microservizi che aggregano parti granulari basate su tecniche diverse. Questo dipende dal fatto che si stia creando un approccio Web tradizionale (MVC ASP.NET) o un'applicazione a pagina singola (SPA, Single Page Application).

Diagram of a composite UI made up of many view models.

Figura 4-21. Esempio di applicazione con interfaccia utente composita modellata da microservizi back-end

Ogni microservizio di composizione dell'interfaccia utente dovrebbe essere simile a un gateway API di piccole dimensioni,. In questo caso però ogni microservizio è responsabile di una piccola area dell'interfaccia utente.

Un approccio basato sull'interfaccia utente composita gestito dai microservizi può essere più o meno complesso a seconda delle tecnologie usate per l'interfaccia utente. Per compilare un' applicazione Web tradizionale, ad esempio, non si usano le stesse tecniche usate per compilare un'applicazione a pagina singola o per le app per dispositivi mobili native (come nello sviluppo di app Xamarin, che può essere più complesso con questo approccio).

L'applicazione di esempio eShopOnContainers usa l'approccio basato sull'interfaccia utente monolitica per più motivi. Prima di tutto è un'introduzione a microservizi e contenitori. Un'interfaccia utente composita è più avanzata, ma presenta anche un livello di complessità più elevato quando si progetta e sviluppa l'interfaccia utente. In secondo luogo, eShopOnContainers fornisce anche un'app per dispositivi mobili nativa basata su Xamarin, che ne aumenterà la complessità sul lato C# del client.

Per altre informazioni sull'interfaccia utente composita basata sui microservizi, è consigliabile vedere i riferimenti seguenti.

Risorse aggiuntive

PrecedenteSuccessivo