... | @@ -34,32 +34,41 @@ No diagrama apresentado, temos a definição de como será a arquitetura física |
... | @@ -34,32 +34,41 @@ No diagrama apresentado, temos a definição de como será a arquitetura física |
|
* Device do usuário : Dispositivo mobile utilizado pelo usuário como cliente.
|
|
* Device do usuário : Dispositivo mobile utilizado pelo usuário como cliente.
|
|
* Servidor AWS/DO : Ambiente de homologação da aplicação.
|
|
* Servidor AWS/DO : Ambiente de homologação da aplicação.
|
|
* Cloud da Google : Ambiente da API Firebase.
|
|
* Cloud da Google : Ambiente da API Firebase.
|
|
*
|
|
|
|
|
|
|
|
## Back-end
|
|
## Back-end
|
|
|
|
|
|
### Definição da Linguagem e Frameworks
|
|
### Definição da Linguagem e Frameworks
|
|
|
|
|
|
No início do semestre, ou seja, na primeira semana da Srint 0, todos integrantes do time responderam um [Formulário de Mapeamento de Tecnologias](https://forms.gle/bpuDciJmb2eFCD2S9). 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 que os integrantes gostariam de trabalhar. Para a tecnologia do Back-end, o resultado foi o seguinte:
|
|
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](https://forms.gle/bpuDciJmb2eFCD2S9). 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:
|
|
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:
|
|
A partir dos resultados obtidos, fizemos as seguintes escolhas:
|
|
|
|
|
|
* Linguagem: TypeScript;
|
|
* Linguagem: TypeScript;
|
|
* Frameworks: Node.js + Express.
|
|
* Frameworks: Node.js + Express.
|
|
|
|
|
|
Para informações sobre o Banco de Dados, basta clicar [aqui](https://tools.ages.pucrs.br/cine-clube/cineclube-wiki/wikis/banco_dados).
|
|
Para informações sobre o Banco de Dados, basta clicar [aqui](https://tools.ages.pucrs.br/cine-clube/cineclube-wiki/wikis/banco_dados).
|
|
|
|
|
|
### Módulos do Sistema
|
|
### Módulos do Sistema
|
|
|
|
|
|
* **Routes**: ...
|
|
* **Routes**: Responsável pelo roteamento das requisições para seus respectivos *Controllers*. Essa parte do sistema é auto-gerado pelo pacote TSOA
|
|
* **Controllers**: ...
|
|
* **Controllers**: Responsável pela validação das requisições do usuário.
|
|
* **Services**: ...
|
|
* **Services**: Responsável pelo tratamento dos dados e também das regras de negócio.
|
|
* **Repository**: ...
|
|
* **Repository**: Manipulação e comunicação com o Banco de Dados.
|
|
* **Models**: ...
|
|
* **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
|
|
## Diagrama de Componentes
|
|
<img src = "tutorial-imagens/Package_2_Backend.png" title = "Diagrama de deploy" />
|
|
<img src = "tutorial-imagens/Package_2_Backend.png" title = "Diagrama de componentes do Back-End" />
|
|
|
|
|
|
## Front-end
|
|
## Front-end
|
|
|
|
|
... | @@ -74,13 +83,18 @@ A partir dos resultados obtidos, fizemos as seguintes escolhas: |
... | @@ -74,13 +83,18 @@ A partir dos resultados obtidos, fizemos as seguintes escolhas: |
|
|
|
|
|
### Módulos do Sistema
|
|
### Módulos do Sistema
|
|
|
|
|
|
* **Components**: ...
|
|
* **Components**: Definição dos componentes reutilizáveis pela aplicação.
|
|
* **Screen**: ...
|
|
* **Pages**: Definição das páginas usadas pela aplicação.
|
|
* **Routes**: ...
|
|
* **Routes**: Definição das rotas e suas respectivas páginas usadas pela aplicação.
|
|
* **Constants**: ...
|
|
* **Services**: Definição das funções usadas para comunicar com a *API* e com o Firebase.
|
|
* **Assets**: ...
|
|
* **Assets**: Definição das imagens e estilos usadas pela aplicação.
|
|
|
|
|
|
### Arquitetura Básica do Front-end
|
|
### 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
|
|
## Diagrama de Componentes
|
|
<img src = "tutorial-imagens/Package_2_FrontEnd.png" title = "Diagrama de deploy" /> |
|
<img src = "tutorial-imagens/Package_2_FrontEnd.png" title = "Diagrama de deploy" /> |
|
|
|
\ No newline at end of file |