Home	Sprints	Requisitos	Arquitetura	Configuração	Mockups	BD	Instalação	GP	Horários	Processo

Arquitetura do Sistema

Esta é a página onde irá ficar todas as informações da Arquitetura do seu projeto, Como:

• Segurança
• Rotas de Backend (Arquitetura funcional)
• Objects – Backend API
• Methods – Backend API
• Arquitetura Não Funcional)
• Diagrama de Pacotes / Componentes (Arquitetura de software)
• Diagrama de Deploy
• Documentação sobre aplicação de Design do Projeto
• Análise dos principios SOLID
• Code Review

Diagrama de Deploy

No diagrama apresentado, temos a definição de como será a arquitetura física da aplicação em um alto-nível. Válido notar que estaremos construindo uma aplicação que utiliza contâiners, via Docker.

Imagens do sistema

• Aplicação Front-End : Imagem da aplicação React.
• Aplicação Back-End : Imagem da aplicação Node.
• MySQL : Imagem do SGBD MySQL. Importante notar que esse utiliza um volume de banco de dados associado.
• Firebase : API externa para obtenção de informações da conta Google.

Nós do sistema

• Device do usuário : Dispositivo mobile utilizado pelo usuário como cliente.
• Servidor AWS/DO : Ambiente de homologação da aplicação.
• Cloud da Google : Ambiente da API Firebase.

Back-end

Definição da Linguagem e Frameworks

No início do semestre, ou seja, na primeira semana da Sprint 0, todos integrantes do time responderam um Formulário de Mapeamento de Tecnologias. A partir dos resultados desse formulário, pudemos avaliar qual linguagem (que era adequada para o uso no projeto) era a mais dominada pelo time como um todo e quais delas que os integrantes gostariam de trabalhar. Para a tecnologia do Back-end, o resultado foi o seguinte:

Também foi feito o mesmo questionamento em cima de Frameworks de Back-end. O resultado foi o seguinte:

A partir dos resultados obtidos, fizemos as seguintes escolhas:

• Linguagem: TypeScript;
• Frameworks: Node.js + Express.

Para informações sobre o Banco de Dados, basta clicar aqui.

Módulos do Sistema

• Routes: Responsável pelo roteamento das requisições para seus respectivos Controllers. Essa parte do sistema é auto-gerado pelo pacote TSOA
• Controllers: Responsável pela validação das requisições do usuário.
• Services: Responsável pelo tratamento dos dados e também das regras de negócio.
• Repository: Manipulação e comunicação com o Banco de Dados.
• Models: Modelo das instâncias do banco.

Pacotes relevantes

• NodeJS: Ambiente de execução de JavaScript no lado de servidor.
• TypeScript: Linguagem de programação baseada em JavaScript, com adição de inúmeras funcionalidades que permitem maior segurança à aplicação, como a possibilidade de tipagem de dados.
• Express.JS: Framework que permite a criação de servidores web.
• firebase-admin: Permite a conexão entre a aplicação e a API do firebase. Muito importante para a obtenção de dados da conta do Google.
• TSOA: Automatiza a criação de rotas e suas documentações via Swagger. Também conta com funcionalidades que permitem que essas rotas tenham configurações específicas, como a criptografia e selecionar o tipo de retorno de cada rota.
• typeORM: Conexão com o banco de dados, além de outras funcionalidades, como a especificação de models do projeto.

Diagrama de Componentes

Front-end

Definição da Tecnologia

Para decisão sobre as tecnologias a serem utilizadas no Front-end, levamos em consideração os resultados do mesmo formulário apresentado no item do Back-end. Para a tecnologia do Front-end, obtivemos o seguinte resultado:

A partir dos resultados obtidos, fizemos as seguintes escolhas:

• Linguagem: TypeScript Web;
• Frameworks: React JS.

Módulos do Sistema

• Components: Definição dos componentes reutilizáveis pela aplicação.
• Pages: Definição das páginas usadas pela aplicação.
• Routes: Definição das rotas e suas respectivas páginas usadas pela aplicação.
• Services: Definição das funções usadas para comunicar com a API e com o Firebase.
• Assets: Definição das imagens e estilos usadas pela aplicação.

Pacotes Relevantes

• React: Biblioteca dedicado à construção de aplicações SPA (Single Page Application).
• Material-UI: Biblioteca dedicado à componentes e estilos.
• Axios: Utilizado para realizar troca de mensagens com a API.
• Firebase: Permite a conexão entre a aplicação e a API do firebase. Muito importante para a obtenção de dados da conta do Google.

Diagrama de Componentes