Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/vilhalva/contact-access
👨🏫APLICATIVO DE GERENCIADOR DE CONTATOS EM REACT NATIVE QUE USA EXPO CONTACTS PARA EXIBIR CONTATOS DO DISPOSITIVO.
https://github.com/vilhalva/contact-access
aplicativo codigo framework interface nodejs projeto react-native search typescript
Last synced: 4 days ago
JSON representation
👨🏫APLICATIVO DE GERENCIADOR DE CONTATOS EM REACT NATIVE QUE USA EXPO CONTACTS PARA EXIBIR CONTATOS DO DISPOSITIVO.
- Host: GitHub
- URL: https://github.com/vilhalva/contact-access
- Owner: VILHALVA
- Created: 2024-12-20T22:42:29.000Z (13 days ago)
- Default Branch: main
- Last Pushed: 2024-12-20T22:43:48.000Z (13 days ago)
- Last Synced: 2024-12-20T23:27:53.953Z (13 days ago)
- Topics: aplicativo, codigo, framework, interface, nodejs, projeto, react-native, search, typescript
- Language: TypeScript
- Homepage:
- Size: 0 Bytes
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# CONTACT ACCESS
👨🏫APLICATIVO DE GERENCIADOR DE CONTATOS EM REACT NATIVE QUE USA EXPO CONTACTS PARA EXIBIR CONTATOS DO DISPOSITIVO.
## DESCRIÇÃO:
Esse aplicativo é um **gerenciador de contatos** que utiliza o React Native e a biblioteca **Expo Contacts** para acessar e exibir a lista de contatos do dispositivo do usuário.
## FUNCIONALIDADES:
1. **Listagem de contatos**:
- Carrega os contatos do dispositivo do usuário.
- Exibe os contatos organizados em uma lista seccionada, onde cada seção representa a inicial do nome do contato.
2. **Pesquisa de contatos**:
- Permite ao usuário pesquisar contatos pelo nome utilizando um campo de entrada.
3. **Visualização de detalhes do contato**:
- Quando o usuário seleciona um contato da lista, os detalhes do contato (nome e número de telefone) são exibidos em uma **janela inferior deslizante** (BottomSheet).
- Se o contato tiver uma foto associada, ela também é exibida.
4. **Interatividade**:
- O usuário pode limpar o campo de pesquisa ou fechar a janela de detalhes.
## EXECUTANDO O PROJETO:
1. **Instalar as dependências do projeto**:
- No diretório do projeto, abra o terminal ou prompt de comando e execute:
```bash
npm install
```
Este comando instalará todas as dependências listadas no arquivo `package.json` do projeto.
2. **Iniciar o servidor do Expo**:
- Ainda no diretório do projeto, inicie o servidor do Expo com:
```bash
npm start
```
Esse comando abrirá a interface do Expo no navegador, permitindo que você escolha como deseja executar o aplicativo (em um emulador, dispositivo físico ou navegador).
3. **Executar o aplicativo em um dispositivo ou emulador**:
- **Dispositivo físico**:
- Instale o aplicativo **Expo Go** na Play Store (Android) ou App Store (iOS).
- Escaneie o QR Code exibido no navegador pelo Expo para abrir o aplicativo.
- **Emulador Android**:
- Certifique-se de que o **Android Studio** esteja instalado e o emulador configurado.
- Inicie o emulador e pressione `a` no terminal para abrir o app no Android.
- **Simulador iOS** (apenas em macOS):
- Certifique-se de que o **Xcode** esteja instalado.
- Pressione `i` no terminal para abrir o app no simulador iOS.
4. **Usando App:**
**1. Conceder permissão de acesso aos contatos**
- Ao iniciar o aplicativo pela primeira vez, será solicitado ao usuário permissão para acessar os contatos do dispositivo. O aplicativo só funciona corretamente se o acesso for concedido.
**2. Pesquisar um contato**
- Digite o nome do contato no campo de pesquisa para filtrar a lista.
- Para limpar a pesquisa, clique no ícone "X" ao lado do campo.
**3. Selecionar um contato**
- Toque em um nome da lista para abrir os detalhes do contato.
- A janela exibirá:
- Nome do contato.
- Número de telefone.
- Foto (se disponível).
**4. Fechar os detalhes**
- Clique no botão "Fechar" para voltar à lista de contatos.
## NÃO SABE?
- Entendemos que para manipular arquivos em diversas linguagens relacionadas, é necessário possuir conhecimento nessas áreas. Para auxiliar nesse aprendizado, oferecemos cursos gratuitos disponíveis:
* [CURSO DE REACT NATIVE](https://github.com/VILHALVA/CURSO-DE-REACT-NATIVE)
* [CURSO DE TYPESCRIPT](https://github.com/VILHALVA/CURSO-DE-TYPESCRIPT)
* [CURSO DE NODEJS](https://github.com/VILHALVA/CURSO-DE-NODEJS)
* [CONFIRA MAIS CURSOS](https://github.com/VILHALVA?tab=repositories&q=+topic:CURSO)
## CREDITOS:
- [VEJA O VIDEO DESSE PROJETO](https://youtu.be/LfWCQb_hvMQ?si=BvpJbIp87VCVaDDO)
- [PROJETO FEITO PELO VILHALVA](https://github.com/VILHALVA)