https://github.com/rickalves/reactnative-auth-app
React Native Auth App
https://github.com/rickalves/reactnative-auth-app
jwt-authentication mobile-app react react-native
Last synced: 3 months ago
JSON representation
React Native Auth App
- Host: GitHub
- URL: https://github.com/rickalves/reactnative-auth-app
- Owner: rickalves
- Created: 2025-03-01T15:07:59.000Z (3 months ago)
- Default Branch: main
- Last Pushed: 2025-03-02T15:19:52.000Z (3 months ago)
- Last Synced: 2025-03-02T15:26:48.497Z (3 months ago)
- Topics: jwt-authentication, mobile-app, react, react-native
- Language: TypeScript
- Homepage:
- Size: 297 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# š React Native Auth App
Este projeto Ć© um exemplo de aplicativo de autenticaĆ§Ć£o desenvolvido com **React Native** utilizando **Expo**. O aplicativo se conecta a uma API de autenticaĆ§Ć£o (**Node.js, JWT e MongoDB**) para gerenciar **cadastro** e **login** de usuĆ”rios.
## āØ Recursos
ā **AutenticaĆ§Ć£o:** Telas para **cadastro** e **login** de usuĆ”rios.
š **NavegaĆ§Ć£o Baseada em Arquivos:** Uso do **Expo Router** com uma estrutura organizada na pasta `app` (incluindo `auth`).
š **Armazenamento Seguro:** UtilizaĆ§Ć£o do `expo-secure-store` para guardar tokens JWT.
š **IntegraĆ§Ć£o com API:** RequisiƧƵes HTTP para uma **API de autenticaĆ§Ć£o** que utiliza **Node.js, JWT e MongoDB**.
## š Estrutura do Projeto
```plaintext
MyAuthApp/
āāā app/ // Rotas definidas pelo Expo Router
ā āāā _layout.tsx // Layout global (renderiza o Slot do Expo Router)
ā āāā index.tsx // Rota raiz que redireciona para a tela de login
ā āāā auth/ // Pasta para telas de autenticaĆ§Ć£o
ā ā āāā confirmation.tsx // Tela de confirmaĆ§Ć£o de cadastro
ā ā āāā emailSent.tsx // Tela de confirmaĆ§Ć£o de envio de email
| | āāā login.tsx // Tela de login
| | āāā passwordRecovery.tsx // Tela de recuperaĆ§Ć£o de senha
| | āāā register.tsx // Tela de cadastro de usuĆ”rio
| | āāā resetPassword.tsx // Tela de redefiniĆ§Ć£o de senha
| | āāā verifyCode.tsx // Tela de verificaĆ§Ć£o de cĆ³digo
ā āāā home.tsx // Tela protegida (Home)
āāā assets/ // Arquivos estĆ”ticos (imagens, fontes, etc.)
āāā package.json // DependĆŖncias e scripts do projeto
āāā tsconfig.json // ConfiguraƧƵes do TypeScript
āāā app.json // ConfiguraƧƵes do Expo
```
## š§ PrĆ©-requisitos
ā
**Node.js** e **npm** ou **yarn** instalados.
ā
**Expo CLI** instalado globalmente:
```bash
npm install -g expo-cli
```
ā
Uma **API de autenticaĆ§Ć£o** (Node.js, JWT, MongoDB) rodando ou URLs ajustadas conforme seu ambiente.
## š„ InstalaĆ§Ć£o
1ļøā£ **Clone o repositĆ³rio:**
```bash
git clone https://github.com/seu-usuario/MyAuthApp.git
cd MyAuthApp
```
2ļøā£ **Instale as dependĆŖncias:**
```bash
npm install
# ou
yarn install
```
3ļøā£ **Configure as variĆ”veis de ambiente** (se necessĆ”rio) para ajustar as URLs da API e outras configuraƧƵes.
## ā¶ļø Executando o Projeto
Para iniciar o projeto, execute:
```bash
expo start
```
Em seguida, abra o aplicativo no emulador ou em um dispositivo fĆsico utilizando o aplicativo **Expo Go**. š±
## š NavegaĆ§Ć£o
A navegaĆ§Ć£o Ć© baseada na estrutura de arquivos com o **Expo Router**:
- **`/`** ā Rota raiz (**index.tsx**) que redireciona automaticamente para **`/auth/login`**.
- **`/auth/*`** ā š Telas de autenticaĆ§Ć£o.
- **`/home`** ā š Tela protegida, acessĆvel apĆ³s a autenticaĆ§Ć£o.
> ā **ObservaĆ§Ć£o:** O redirecionamento na rota raiz Ć© feito utilizando `router.replace('auth/login')` com um `setTimeout` para garantir que o layout esteja montado.
## šØ PersonalizaĆ§Ć£o e ContribuiƧƵes
š” **PersonalizaĆ§Ć£o:**
Ajuste os **estilos**, **validaƧƵes** e **integraƧƵes** conforme a necessidade do seu projeto.
š¤ **ContribuiƧƵes:**
ContribuiƧƵes sĆ£o **bem-vindas**! Sinta-se Ć vontade para abrir **issues** ou enviar **pull requests** com melhorias e correƧƵes.
## š LicenƧa
Este projeto estĆ” licenciado sob a **[MIT License](LICENSE)**. š
---