Documento de Arquitetura
Histórico de Revisão
| Data | Versão | Modificação | Autor |
|---|---|---|---|
| 04/09/2018 | 0.1 | Tópicos: 1.1, 1.2, 1.3, 1.4, 1.5 | Lucas Dutra e Saleh Nazih |
| 06/09/2018 | 0.2 | Tópicos: 3, 4.1 | Saleh Nazih |
| 07/09/2018 | 0.3 | Tópicos: 2 | Lucas Dutra |
| 07/09/2018 | 0.3.1 | Tópico: 1.4 | Lucas Dutra e Saleh Nazih |
| 08/09/2018 | 1.0 | Tópicos: 4.2, 2.1, 2.2 | Lucas Dutra e Saleh Nazih |
| 23/09/2018 | 1.1 | Tópicos: 1.1, 1.2, 1.3, 2.2 | Ésio Freitas e Lucas Dutra |
| 24/09/2018 | 1.2 | Tópicos: 3, 4.1 e 4.2 | Lucas Dutra |
| 25/09/2018 | 1.3 | Tópicos: 1.2, 2, 4.2, 4.5 e 5 | Ésio Gustavo |
| 25/09/2018 | 2.0 | Tópicos: 2 | Ésio Gustavo, Lucas Dutra, Youssef Muhamad |
| 30/09/2018 | 2.1 | Tópicos: 2.2, 2.3 | Youssef Muhamad |
| 22/11/2018 | 2.2 | Tópicos: 2.1, 4.3 | Lucas Dutra |
| 22/11/2018 | 2.3 | Tópico: 2 - Serverless & Zappa | Felipe Hargreaves |
1. Introdução
1.1 Finalidade
A intenção desse documento é capturar e transmitir as decisões significativas que foram tomadas em relação ao sistema do ponto de vista do arquiteto. Por isso, ele contém uma apresentação geral da arquitetura utilizada no projeto Kalkuli e explicita como acontecerá a comunicação dos diversos serviços contidos no software como um todo.
1.2 Escopo
O Kalkuli será uma aplicação responsável por escanear DANFCE, com o intuito de extrair, tratar e exibir dados de uma maneira simples e intuitiva para o usuário.
1.3 Definições, Acrônimos e Abreviações
- DANFCE - Documento auxiliar de notas fiscais do consumidor eletrônica
- WSGI - Web Server Gateway Interface
1.4 Referências
Universidade Federal do Paraná, FUNPAR. RUP - Especificação de Casos de Uso: Template base para construção do documento de arquitetura. Disponível em: https://goo.gl/gDTkMx. Acesso em: 2 de setembro de 2018.
Microsserviços em poucas palavras. ThoughtWorks. Disponível em: https://goo.gl/AQNy6p. Acesso em: 7 de setembro de 2018.
Rocha, B. C. What the Flask? Pt-1 Introdução ao desenvolvimento web com Python. PythonClub. Disponível em: https://goo.gl/SfqDYX. Acesso em: 7 de setembro de 2018.
Tutorial: Intro to React. What is React?. ReactJs. Disponível em: https://goo.gl/9CCQXK. Acesso em: 7 de setembro de 2018.
Read Me. Redux. Disponível em: https://goo.gl/SgQiKb. Acesso em: 7 de setembro de 2018
SASS_REFERENCE (frames). Sass. Disponível em: https://goo.gl/E8cs2o. Acesso em: 26 de setembro de 2018
Zappa - Serverless Python. Disponível em: https://goo.gl/WoifXn. Acesso em: 23 de novembro de 2018
2. Representação da Arquitetura
- React.js
React é uma biblioteca de JavaScript flexível, declarativa e eficiente para construção de interfaces para exibição ao usuário. O React permite a criação desde interfaces complexas até pequenos e isolados pedaços de código chamados “Componentes”.
- Redux
Redux é um contêiner de estado preditivo para aplicações JavaScript. Ele ajuda a escrever aplicações que se comportam de forma constante,ou seja, que possui um processo claro e definido, de como sua aplicação pode mudar, em diferentes ecossistemas, e são facilmente testáveis.
- Sass
Sass é uma extensão de CSS para adicionar poder e elegância para linguagem. Ela permite usar variáveis, regras de aninhamento, mixins e importações de outros arquivos. Sass ajuda a manter as extensas folhas de estilo organizadas e as menores executando mais rapidamente, particulamente, com a ajuda da biblioteca Compass.
- Flask
Flask é um micro-framework de python, possui toda a flexibilidade da linguagem python e provê um modelo simples para desenvolvimento web. É baseado em 3 pilares: Werkzeug, uma biblioteca para desenvolvimento de apps WSGI, Jinja2, um template engine escrito em Python e good intentions, que são alta qualidade na legibilidade, liberdade de estruturar o app na maneira que desejar, entre outros aspectos.
- Microsserviços
A arquitetura de microsserviços é uma abordagem que desmembra uma aplicação única em blocos de pequenos serviços independentes. Esses serviços executam o seu próprio processo e se comunicam, muitas vezes, por meio de métodos HTTP.
No software descrito neste documento a arquitetura de microsserviços será bastante utilizada. Os módulos serão:
- Extração de texto, bloco responsável somente pela extração do texto proveniente das notas fiscais escaneadas;
- Interpretação, responsável pelo tratamento dos dados brutos que foram extraídos das notas;
- Exportação, responsável por exportar os relatórios e as notas escaneadas pelo usuário para a extensão desejada;
- Relatórios, responsável por usar os dados provenientes das notas para gerar relatórios de gastos, entre outros;
- Usuário, bloco responsável por toda interação do usuário, como login, registro;
- Notas, será um serviço responsável por gerenciar todas as notas fiscais extraídas.
- Gateway, serviço responsável por intermediar a comunicação entre o Back-end e o Front-end.
- Comunicação entre os serviços
Comunicação entre os serviços será feita por meio de uma API Gateway, a qual será responsável por fazer o intermédio entre os microsserviços por meio de métodos do protocolo HTTP.
- Serverless
A computação Serverless (sem servidor) é um modelo de execução de código em nuvem sem infraestrutura permanente. Em contraste a um servidor tradicional, que se mantém no ar 24/7, um serviço serverless funciona por demanda, criando os recursos necessários e os gerenciando apenas ao receber uma requisição ou responder a outro tipo de evento. Toda a escalabilidade é gerenciada automaticamente e de forma horizontal, reduzindo a ocorrência de timeouts. Em adição, o custo de manutenção é reduzido drasticamente, não sendo necessário manter um servidor ativo continuamente. Alguns microsserviços do Kalkuli utilizam do modelo Serverless, através da plataforma Lambda da Amazon Web Services (AWS).
- Zappa
Zappa é uma ferramenta para o desenvolvimento e deploy serverless de aplicações Web em Python. Funciona como uma camada intermediária entre um projeto Web tradicional e a infraestrutura da AWS Lambda. O Zappa é utilizado em dois microsserviços do sistema, o Gateway e o Interpretation, e permite uma solução eficiente, escalável e de baixo custo para a publicação dos mesmos. Essa solução reduz consideravelmente o risco de ponto único de falha introduzido pelo API Gateway, pois elimina a possibilidade de queda de seu servidor, que implicaria na incapacidade de acesso ao restante do sistema.
2.1 Representação arquitetural
2.2 Diagrama React-Redux Síncrono
State: É um conjunto de verdades para o correto funcionamento da aplicação, o estado é altamente dinâmico e por isso deve ser alterado de forma imutável, para que não ocorram inconsistências no sistema.
Store: É o objeto que armazena toda a árvore de estado, podendo ser modificado somente via action.
Container: É o componente maior, que faz a conexão com a Store do Redux e que gerencia as partes menores da aplicação, permeando o estado e gerenciando os eventos.
Template: É o conjunto das partes menores da aplicação, os componentes têm somente uma responsabilidade e não possuem estado.
Action: É um objeto que carrega informações relacionadas a um ação. Toda ação deve ter a propriedade type que descreve o que está sendo enviado, e um objeto payload que possui as informações de fato. Uma action é despachada via store.dispatch() que por padrão é executado de forma síncrona.
Reducer: É uma função responsável pela modificação do estado da store. Ela recebe a action, verifica o que deseja ser feito e sua informação, e toma as medidas necessárias para que o novo estado fique de acordo.
2.3 Diagrama React-Redux Assíncrono
Action Creator: Em sua forma mais simples, ele é uma função que retorna uma action e que é despachada imediatamente para a Store
Thunk Middleware O Redux Thunk adiciona o assincronismo em um Action Creator, ao invés de despachar uma action imediatamente este middleware faz com que código assíncrono possa ser executado, como por exemplo uma chamada AJAX para uma API.
3. Metas e Restrições de Arquitetura
A aplicação deverá ser suportada pelos navegadores, Mozilla Firefox, Google Chrome, Opera e Microsoft Edge. Toda parte do front-end será construída utilizando React.js, biblioteca de JavaScript para criar interfaces para o usuário, juntamente com Redux, um contêiner de estado preditivo para aplicações JavaScript . A aplicação também utilizará do microframework Flask, que é construído em python e que juntamente com a biblioteca PyTesseract realizarão a extração de dados das notas.
Além disso, a ferramenta Docker será utilizada para facilitar o desenvolvimento em um ambiente isolado e construído especialmente para a equipe.
4. Visão de Implementação
4.1 Visão Geral
A aplicação se baseará na arquitetura de microsserviços. Com cada serviço executando pequenas tarefas, requisitando ou processando dados. O importante dessa arquitetura é a sua implementação mais rápida e de fácil manutenção.
4.2 Pacotes de Design Significativos do Ponto de Vista da Arquitetura
- Front-End
O front-end será inteiramente construído com a biblioteca React, segue a estrutura de pacotes da aplicação:
- Back-End
O back-end será inteiramente construído com o microframework Flask, segue a estrutura de pacotes da aplicação:
4.3 Modelagem de Dados
5. Visão de Implantação
A implantação do produto será realizada por etapas. Todas devem visar que cada incremento de produto agregre maior valor ao cliente com maior qualidade possível, como podemos observar no pipeline abaixo:
