Partilhar via

Criando uma interface do usuário composta com base em microsserviços

  • Artigo

Gorjeta

Este conteúdo é um trecho do eBook, .NET Microservices Architecture for Containerized .NET Applications, disponível no .NET Docs ou como um PDF para download gratuito que pode ser lido offline.

Descarregar PDF

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

A arquitetura de microsserviços geralmente começa com a lógica e os dados de manipulação do lado do servidor, mas, em muitos casos, a interface do usuário ainda é tratada como um monólito. No entanto, uma abordagem mais avançada, chamada micro frontends, é projetar a interface do usuário do aplicativo com base em microsserviços também. Isso significa ter uma interface do usuário composta produzida pelos microsserviços, em vez de ter microsserviços no servidor e apenas um aplicativo cliente monolítico consumindo os microsserviços. Com essa abordagem, os microsserviços que você cria podem ser completos com lógica e representação visual.

A Figura 4-20 mostra a abordagem mais simples de apenas consumir microsserviços de um aplicativo cliente monolítico. Claro, você pode ter um ASP.NET serviço MVC entre a produção do HTML e JavaScript. A figura é uma simplificação que destaca que você tem uma única interface do usuário do cliente (monolítica) consumindo os microsserviços, que se concentram apenas na lógica e nos dados e não na forma da interface do usuário (HTML e JavaScript).

Diagram of a monolithic UI app connecting to microservices.

Figura 4-20. Um aplicativo de interface do usuário monolítico que consome microsserviços back-end

Em contraste, uma interface do usuário composta é gerada com precisão e composta pelos próprios microsserviços. Alguns dos microsserviços orientam a forma visual de áreas específicas da interface do usuário. A principal diferença é que você tem componentes da interface do usuário do cliente (classes TypeScript, por exemplo) com base em modelos, e o Data-Shaping-UI ViewModel para esses modelos vem de cada microsserviço.

No momento da inicialização do aplicativo cliente, cada um dos componentes da interface do usuário do cliente (classes TypeScript, por exemplo) registra-se com um microsserviço de infraestrutura capaz de fornecer ViewModels para um determinado cenário. Se o microsserviço alterar a forma, a interface do usuário também será alterada.

A Figura 4-21 mostra uma versão dessa abordagem composta da interface do usuário. Essa abordagem é simplificada porque você pode ter outros microsserviços que estão agregando partes granulares baseadas em técnicas diferentes. Depende se você está criando uma abordagem Web tradicional (ASP.NET MVC) ou um SPA (Single Page Application).

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

Figura 4-21. Exemplo de um aplicativo de interface do usuário composto moldado por microsserviços back-end

Cada um desses microsserviços de composição da interface do usuário seria semelhante a um pequeno API Gateway. Mas, neste caso, cada um é responsável por uma pequena área de interface do usuário.

Uma abordagem de interface do usuário composta impulsionada por microsserviços pode ser mais desafiadora ou menos desafiadora, dependendo das tecnologias de interface do usuário que você está usando. Por exemplo, você não usará as mesmas técnicas para criar um aplicativo Web tradicional que usa para criar um SPA ou para um aplicativo móvel nativo (como ao desenvolver aplicativos Xamarin, o que pode ser mais desafiador para essa abordagem).

O aplicativo de exemplo eShopOnContainers usa a abordagem monolítica da interface do usuário por vários motivos. Primeiro, é uma introdução aos microsserviços e contêineres. Uma interface do usuário composta é mais avançada, mas também requer mais complexidade ao projetar e desenvolver a interface do usuário. Em segundo lugar, o eShopOnContainers também fornece um aplicativo móvel nativo baseado no Xamarin, o que o tornaria mais complexo no lado C# do cliente.

No entanto, recomendamos que você use as referências a seguir para saber mais sobre a interface do usuário composta com base em microsserviços.

Recursos adicionais

AnteriorSeguinte