Arquitetura do Sistema

Diagrama de Deploy

Diagrama de Componentes

Modelo da Arquitetura usada no Front-end

Para a arquitetura de desenvolvimento do Front-end da aplicação, foram criadas as seguintes pastas:

modules: Essa pasta contém todas as dependências do projeto, instaladas via npm ou yarn. Essas bibliotecas são necessárias para o funcionamento do projeto.

public: Essa pasta armazena arquivos estáticos, como imagens e fontes.

src: Pasta com o código-fonte principal do projeto. Dentro dela, a pasta app organiza outras pastas de acordo com diferentes responsabilidades:

1. @types: Usada para definir tipos TypeScript personalizados ou declarações de tipos para bibliotecas que não têm definições de tipos embutidas.

2. api: Ficam as chamadas e configurações de APIs, incluindo funções para comunicar-se com backends ou serviços externos.

3. data: Usada para armazenar dados brutos ou constantes que podem ser usados em toda a aplicação. Isso pode incluir arquivos JSON ou outras formas de dados estruturados.

4. theme: Armazena arquivos relacionados ao tema da aplicação, como configurações de cores, tipografia e outros estilos globais.

5. presentation: Esta pasta organiza os componentes de apresentação, ou seja, as partes da interface de usuário (UI). Dentro dela:

   5.1. components: Ficam os componentes reutilizáveis da UI, como botões, formulários, modais, etc.

   5.2. hooks: Código para adaptar a mesma página para diferentes tamanhos de tela, tornando a interface mais flexível e responsiva.

   5.3. pages: Representam as diferentes páginas da aplicação. Cada arquivo dentro dela se torna uma rota da aplicação.

Modelo da Arquitetura usada no Back-end