MoisesAlvesCostaDev / react-native-template

Template React Native com TypeScript

Validado para android e ios

Tabela de Conteúdo

• Tabela de Conteúdo
• Sobre o Projeto
• Designer
  • Feito Com
• Como Usar
  • Pré-requisitos
  • Estrutura de Arquivos
  • Instalação
  • Edição
• Licença
• Contato

Sobre o Projeto

Este projeto tem o objetivo de criar um templete em React Native com TypeScript. A principal motivação é diminuir o tempo inicial de desenvolvimento de novos projetos.

Designer

O Designer foi feito no figma e pode ser acessado em: Telas

Feito Com

Abaixo segue o que foi utilizado na criação deste template:

• React Native - Framework React Native;
• React Navigation - React Navigation para navegação entre telas
• Axios - Axios cliente para requisições http;
• Babel - Babel compilador JavaScript gratuito;
• ESLint - ESLint para verificações de código;
• Prettier - O Prettier para formatação formatação e padronização de código;
• unform - Trabalho com formulários;
• Yup - Validação de formulários;
• styled-components - estilização em arquivos dedicados;

Como-usar

Segue abaixo recomendações de como usar esse projeto

Pré-requisitos

Recomendo que configure seu ambiente de desenvolvimento como demostrado neste artigo da Rocketseat: https://react-native.rocketseat.dev/

Estrutura de Arquivos

A estrutura de arquivos está da seguinte maneira:

react-native-template
├── src/
│   ├── assets/
│   │   ├── colors
│   │   ├── images
│   │   └── styles
│   ├── components/
│   │   ├── Button
│   │   ├── forms
│   │   └── Modal
│   ├── config/
│   ├── hooks/
│   ├── misc/
│   ├── pages/
│   │   ├── ForgotPassword/
│   │   ├── Home
│   │   └── Login
│   ├── routes/
│   ├── services/
│   ├── index.js
├── .editorconfig
├── .eslintignore
├── .eslintrc.json
├── .gitignore
├── app.json
├── babel.config.js
├── metro.config.js
├── README.md
└── tsconfig.json

• src - Diretório contendo todos os arquivos da aplicação.

• components - Diretório contendo todos os arquivos de components communs da aplicação.

• config - Diretório para guardar os arquivos de configuração.

• assets - Diretório para guardar os arquivos de imagem, cores e estilos comuns para toda aplicação

• hooks - Diretório para guardar os arquivos de imagem, cores e estilos comuns para toda aplicação

• pages - Diretório onde ficam as telas da aplicação

• routes - Diretório onde serão criados os arquivos de configuração de rotas

• services - Diretório onde serão criados os arquivos relacionados a serviços.

Instalação

1. Para instalar e utilizar esse template basta fazer uma copia do projeto na sua máquina e rodar na raiz do projeto

npm install

ou

yarn install

dependendo do seu gerenciador de pacotes

Edição

npx react-native start

npx react-native run-android

Licença

Distribuído sob a licença MIT. Veja LICENSE para mais informações.

Contato

Moisés - Github - [e-mail]