Arquitetura do Sistema

Descrição

Esta seção irá abordar a arquitetura selecionada para o Backend e Frontend, além dos dados relativos ao deploy.

Sumário

• Arquitetura do Sistema
  • Descrição
  • Sumário
  • Arquitetura Geral da Aplicação
  • Deploy
    • Recipes API
  • Backend
    • Definições de Tecnologias
    • Módulos do Sistema
  • Frontend
    • Definições de Tecnologias
    • Módulos do Sistema
    • Diagrama de Deploy
    • Diagramas de Componentes
    • Diagrama do Sistema

Arquitetura Geral da Aplicação

MVC, abreviatura de Model, View e Controller, é um padrão arquitetônico usado para relacionar de forma eficiente a interface do usuário aos modelos de dados subjacentes e organizar para relacionar o código do aplicativo.

1. Model - É considerado o nível mais baixo quando comparado com a Visualização e o Controlador. Ele representa principalmente os dados para o usuário e define o armazenamento de todos os objetos de dados do aplicativo.

2. View - este nível está principalmente associado à Interface do usuário (IU) e é usado para fornecer a representação visual do modelo MVC. Em termos mais simples, este nível lida com a exibição da saída real para o usuário. Ele também lida com a comunicação entre o usuário (entradas, solicitações, etc.) e o controlador.

3. Controller - este nível cuida do manipulador de solicitações . Muitas vezes, é considerado o cérebro do sistema MVC - um elo, por assim dizer, entre o usuário e o sistema. O controlador completa o ciclo de obter a saída do usuário, convertendo-a nas mensagens desejadas e passando-as para as visualizações (UI).

Deploy

Recipes API

TBD

Backend

Definições de Tecnologias

• Node.js
• MySQL
• Sequelize
• Express

Módulos do Sistema

Config

Controllers

• Nessa camada que os dados serão recebidos e depois tratados para o model.

Models

• São a representação das tabelas do banco de dados em forma de classe, pois assim podemos manipulá-las mais facilmente através do código.

Routes

• Refere-se à definição de terminais do aplicativo (URIs) e como eles respondem às solicitações do cliente.

Frontend

Definições de Tecnologias

• React JS + Material UI

Módulos do Sistema

Components

• Camada que contém os componentes da aplicação. Os componentes são de forma genérica para serem reutilizados na aplicação.

Providers

• Camada que contém os Context da aplicação. Contexto (context) vem com um componente Provider que permite componentes consumidores a assinarem mudanças no contexto.

Routes

• Camada que contém as rotas da aplicação. As rotas serão definidas por um PATH que permite ligar um ponto a outro.

Service

• Camada que contém os serviços da aplicação. Nela teremos as definições das chamadas do backend.

Styles

• Camada que contém os estilos da aplicação.

Diagramas de Deploy

<img src="https://tools.ages.pucrs.br/educa-mais/educa-mais-wiki/blob/master/Diagramas/DiagramaDeDeployV2.png width="700">

Diagramas de Componentes

Diagrama do Sistema

TBD