Download react native template - react native template download do código fonte

react native template

Outro código-fonte

System-design

Baixar

Reaja modelo nativo

Este projeto é um modelo nativo do React projetado para acelerar o desenvolvimento, fornecendo recursos essenciais, como gerenciamento de estados, internacionalização, busca de dados, navegação e componentes reutilizáveis.

Capturas de tela

Criado usando os componentes padrão fornecidos no projeto.

Tela de boas -vindas

Tela de login

Tela de registro

tela de registro

Tela de perfil

tela de perfil

Características

? Internacionalização (I18n)
- Suporte multi-linguagem usando react-i18next para localização perfeita.
? Sustta de estado com Redux
- Gerenciamento de Estado centralizado para acesso e atualizações eficientes no estado global.
? Busca de dados com consulta react
- Atração de dados otimizados, cache e sincronização.
? Navegação
- Navegação suave e intuitiva usando react-navigation com componentes básicos como VStack e HStack .
Architecture, arquitetura baseada em componentes
- Design modular com componentes da UI reutilizável e estilo consistente.
? Utilitários comuns
- Helper Funções e serviços públicos para desenvolvimento simplificado.
? Gerenciamento de Axios
- Solicitações de API configuráveis usando axios com manipulação de erros interno e gerenciamento de respostas.
WebSocket Management
- Suporte à comunicação em tempo real usando WebSockets.
? Gerenciamento de biscoitos
- Gerenciamento simplificado de cookies para autenticação e sessões de usuário.
Autenticação
- Autenticação e registro do usuário com gerenciamento de token seguro.

Componentes

O projeto inclui um conjunto de componentes reutilizáveis para a construção de interfaces de usuário:

Componentes do botão
- button.tsx : Componente de botão padrão com estilo personalizável.
Componentes da tipografia
- h1.tsx , h2.tsx : Componentes de título para tipografia consistente.
- text.tsx : componente de texto personalizável para exibir conteúdo.
Componentes de entrada
- input.tsx : componente básico do campo de entrada.
- input-with-icon.tsx : campo de entrada com um ícone para interação aprimorada do usuário.
Componentes de layout
- vstack.tsx : layout da pilha vertical para organizar elementos verticalmente.
- hstack.tsx : layout da pilha horizontal para organizar elementos horizontalmente.
- spacer.tsx : Componente espaçador para adicionar espaço flexível entre elementos.
Componentes de navegação
- navbar.tsx : barra de navegação personalizável para cabeçalho de aplicativo.
Componentes da imagem
- image.tsx : Componente de imagem para exibir imagens com suporte de cache.
Componentes de utilidade
- separator.tsx : componente divisor para separar o conteúdo.
- separator-with-text.tsx : divisor com texto para interface do usuário aprimorada.
- switch.tsx : alternar o componente do comutador para entradas booleanas.
Arquivo de índice
- index.ts : Arquivo de exportação central para componentes.

Começando

Pré -requisitos

Certifique -se de ter o seguinte instalado:

Node.js (v14 ou superior)
Fio
Android Studio / Xcode para desenvolvimento Android / iOS

Instalação

Clone o repositório:

git clone [email protected]:ToniDarodda/react-native-template.git
cd ReactNativeTemplate

Instale dependências:
```
yarn install
```
Configurar variáveis de ambiente:
Atualize o arquivo .env no diretório raiz com suas definições de configuração:
```
API_URL= ' https://your-api-url.com '
SOCKET_URL= ' https://your-socket-url.com '
```

Executando o aplicativo

Inicie o Metro Poundler:
```
yarn start
```
Execute o aplicativo no Android:
```
yarn android
```
Execute o aplicativo no iOS:
```
yarn ios
```
Acesse o aplicativo:
O aplicativo estará disponível no seu emulador ou dispositivo.