... | @@ -103,3 +103,9 @@ Conforme descrito na [página sobre o Backend do projeto](https://tools.ages.puc |
... | @@ -103,3 +103,9 @@ Conforme descrito na [página sobre o Backend do projeto](https://tools.ages.puc |
|
<img src="./resources/images/arquitetura-camadas-backend.png" width="400">
|
|
<img src="./resources/images/arquitetura-camadas-backend.png" width="400">
|
|
|
|
|
|
### Frontend
|
|
### Frontend
|
|
|
|
|
|
|
|
Conforme descrito na [página sobre o Frontend do projeto](https://tools.ages.pucrs.br/sem-barreiras/wiki/-/wikis/frontend), optou-se por trabalhar com o framework React Native que fornece suporte tanto para iOS quanto para Android tendo os seguintes elementos descritos na imagem abaixo que controlam o fluxo de informações que aparecem nas interfaces do aplicativo:
|
|
|
|
|
|
|
|
<img src="./resources/images/frontend-structure.png" width="400">
|
|
|
|
|
|
|
|
Com isso, como podemos ver temos as telas que são apresentadas ao usuário e os elementos dentro dessas telas seriam os componentes (botões, inputs, cards, etc), representados pelos *component1*, *component2*, *component3* e *component4* na imagem. A partir das telas, representadas por *screen1* e *screen2*, o usuário interage com as funcionalidades do aplicativo, cuja navegação é definida pelo sistema de roteamento, representado pelo *routing*. Para conexão com o backend apresentada anteriormente no diagrama, utilizou-se o Axios que é um cliente HTTP baseado em promessas para Node javascript assim realizando o compartilhamento de informações com o banco de dados através do backend na AWS. |
|
|
|
\ No newline at end of file |