Skip to content

douglas-cavalcante/oficina_app

Repository files navigation

OFICINA APP - SOLUÇÃO

Estrutura do projeto

Os componentes react-native encontra-se dentro da pasta src. Na raiz da pasta src, encontramos o arquivo index.js que contém o componente envolve toda aplicação.

Estrutura lógica das pastas

  • components -> Armazena os componentes reutilizáveis da aplicação. Ex: Header.js, Modais e dentre outros.
  • services -> Armazena dados de serviços externos , como por exemplo a URL_BASE da api.
  • pages -> Armazena as telas do app. Cada tela contém um arquivo index.js e um styles.js
  • styles -> Armazena estilos globais da aplicação. Ex: cores, métricas ...

Dependências utilizadas

Os recursos abaixo foram usados para a solução do App.

  • axios -> cliente http utilizado para realizar as requisições a api.
  • prop-types -> utilizado para realiza verificação de tipo em tempo de execução para propriedades(props) React.
  • react-native-modal -> Lib com componentes reutilizáveis de Modal.
  • react-native-status-bar-height -> Utilizado para o tratamento dos styles em dispositivos ios.
  • eslint - Foi utilizado para padronizar o projeto com o style guide seguindo as recomendações do airbnb.

Instruções

  • Para simular a solução do oficina app é necessário ter um ambiente bem configurado. Segue a melhor referência de instalação desse ambiente: https://docs.rocketseat.dev/ambiente-react-native/introducao
  • Na pasta raiz do projeto, execute o comando yarn install.(Tenha o ambiente já configurado)
  • Execute o comando react-native run-android(É necessário já ter um emulador rodando)

Exemplo da aplicação

https://youtu.be/-F_AuRtJdno