Este aplicativo tem como principais funcionalidades a busca de dados de estudantes a partir de uma API externa, o armazenamento dessas informações no storage, a exibição em uma lista com scroll infinito, a apresentação dos detalhes de cada aluno em um modal dinâmico, e a possibilidade de alterar o gênero do estudante em um modal separado.
Desenvolvi esse projeto para uma das etapas do teste para a C2S.
Aplicativo: O app irá buscar e exibir dados de pessoas ao redor do mundo, mas classificaremos como alunos.
Principais tecnologias que utilizei para desenvolver esta aplicação
- Typescript
- Async-Storage
- React-Navigation
- Expo-Font
- NativeWind
- TailwindCSS
- Zod
- Axios
- React-Native-Toast-Message
- React-Native-SVG
- Tanstack Query
- Classnames
- Date FNS
- React-Native-Reanimated
- React Content Loader
- React-Native-Safe-Area-Context
- FakerJS
- Testing Library React Hooks
- Jest Native
- Jest Expo
- Jest
- Jest Fech Mock
- Testing Library Jest Native
No arquivo ci_cd.yml observe o alias para a criar a secret no github que irá conter o token expo para assim podermos criar um fluxo de automação CI CD que irá executar o build da aplicação, rodar os testes unitários e por fim gerar o apk do aplicativo android no caso.
Para rodar os testes basta iniciar o comando:
bun run test
Para instalar e configurar uma cópia local, siga estas etapas simples:
Para garantir o funcionamento adequado da nossa aplicação, verifique abaixo:
- Clone o repositório:
git clone https://github.com/williamjayjay/innovatec-mobile-rework
-
Navegue na raiz do projeto innovatec-mobile-rework:
-
Instale os módulos:
bun i
-
Copie o .env de exemplo:
-
Rode o aplicativo:
bun android
-
Iniciar o aplicativo, entrar na tela de login
-
Na tela de login conseguir navegar para a tela home via tela de login
-
Caso não haja alunos no storage, deve buscar dados da API.
-
Caso haja alunos no storage, deve exibir esses últimos 10 dados e não buscar nada na API ainda.
-
Conseguir fazer "push refresh" ao puxar para baixo a lista e assim conseguir atualizar os alunos que estão sendo buscados da API.
-
Conseguir buscar mais alunos atráves do "scroll infinity" na flatlist.
-
Conseguir visualizar mais informações do aluno ao clicar no componente do mesmo.
-
Conseguir alterar o filtro de alunos por gênero.
-
Conseguir buscar alunos pelo filtro de pesquisa.
UI e UX feita pelo time C2S.
Tela de login | Tela Home |
---|---|
Modal de filtros | Barra de Pesquisa |
---|---|
Shimmer Effect | Modal de perfil |
---|---|
Scroll Infinity |
---|