arquitetura.md

@@ -97,16 +97,30 @@ As camadas da aplicação se comunicam da seguinte maneira, um fluxo de dados in
 
 <h3 id="front-end-def-tec">Definições de Tecnologias</h3>
 
-TBD
+* Linguagem: Typescript <img src="uploads/tslogo.png" width="15" >
+
+* Framework: React Native <img src="uploads/react native logo.png" width="20">
+
+* Ferramentas: Expo     <img src="uploads/logo-wordmark-light.png" width="30">
+
+<p> Utilizamos o Framework React Native que aborda a interface como uma função, e representa o estado atual da aplicação, apresentando componentes visuais escritos em Typescript que podem ser reutilizados em diferentes telas. O Expo permite criar aplicações nativas tanto para Android quanto para iOS. </p>
 
 <h3 id="front-end-mods-sis">Módulos do Sistema</h3>
 
-TBD
 
-### Diagramas de Componentes
+- **Assets:** Pasta com as mídias (imagens, logos, etc...) que são utilizadas na aplicação e no build 
+- **Components:** Onde estarão localizados os componentes visuais encontrados em diferentes páginas da aplicação. Os componentes em sua maioria são genéricos e podem ser personalizados dependendo da sua utilização em cada Screen
 
-TBD
+- **Screen:**  Telas da aplicação. Cada tela é composta de diversos componentes que quando juntos apresentam funcionalidades da aplicação.
 
-### Diagrama do Sistema
+- **Routes:** Rotas da aplicação. Determinam quais telas utilizam as diferentes formas de navegação: StackNavigator (navegação em telas empilhadas) e TabNavigator (navegação por abas inferiores)
+
+- **Services:** Interface do usuário na aplicação. Permite guardar as informações em memória para serem usadas pelo backend como dados e API
+
+- **Utils:** Funções que são chamadas em diferentes componentes, como validações de inputs 
+
+
+### Diagramas de Componentes
+
+<img src="uploads/Diagrama de Componentes.png" >
 
-TBD