Tabela de Conteúdo

• Tabela de Conteúdo
• Sobre o Projeto
  • Feito Com
• Começando
  • Instalando
  • Estrutura de Arquivos
  • Edição
• Contribuição
• Licença
• Contato
• Créditos

Sobre o Projeto

Este projeto visa a criação de um template que possa ser utilizado no momento de criação de projetos utilizando React Native, visto que o processo de instalação e configuração das libs no início de um projeto podem gerar certa complexidade e muitas vezes até erros que atrasam o processo, atrapalhando assim o fluxo de desenvolvimento.

Feito Com

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

• React Native
• Redux
  • Redux Saga
  • Redux Sauce
  • React Redux
• React Navigation
  • React Navigation Native
  • React Navigation Stack
  • React Navigation Bottom Tabs
  • React Native Masked View
  • React Native Reanimated
  • React Native Screens
  • React Native Safe Area Context
  • React Native Gesture Handler
• Vector Icons
• Styled Components
• Lottie React Native
• Lottie Ios
• Seamless Immutable
• Axios
• Prop Types
• Reactotron
  • reactotron-react-native
  • reactotron-redux
  • reactotron-redux-saga
• Babel
  • babel-eslint
  • babel-plugin-root-import
  • babel-plugin-transform-remove-console
  • eslint-config-airbnb
  • eslint-plugin-import
  • eslint-plugin-jsx-a11y
  • eslint-plugin-react
  • eslint-plugin-react-nativeeslint-import-resolver-babel-plugin-root-import
• Prettier
  • eslint-plugin-prettier
  • eslint-config-prettier
• EditorConfig

Começando

Para utilizar o template recomendo fazer uso da React Native CLI.

Instalando

1. Basta criar um novo projeto utilizando o seguinte comando:

npx react-native init MyApp --template avalon-advanced

2. Após o término, remova o arquivo App.js da raiz, pois o index.js agora faz o trabalho na pasta src.

Agora temos o projeto criado, com todas as dependências e configurações que o template oferece.

Estrutura de Arquivos

A estrutura de arquivos está da seguinte maneira:

avalon-advanced
├── src/
│   ├── assets/
│   │   ├── fonts/
│   │   │   └── Oswald-Bold.ttf
│   │   │   └── Oswald-Light.ttf
│   │   │   └── Oswald-Regular.ttf
│   │   └── images/
│   │       └── lottiefiles/
│   │           └── dev.json
│   ├── components/
│   │   ├── atoms/
│   │   │   └── typograph/
│   │   │       └── index.js
│   │   ├── Button.js
│   │   └── CodeBox.js
│   ├── config/
│   │   └── ReactotronConfig.js
│   ├── navigations/
│   │   ├── app-navigator.js
│   │   └── index.js
│   ├── pages/
│   │   ├── Main/
│   │   │   ├── index.js
│   │   │   └── styles.js
│   │   └── Doc/
│   │       ├── utils/
│   │       │   └── libs.json
│   │       ├── index.js
│   │       └── styles.js
│   ├── services/
│   │   └── api.js
│   ├── store/
│   │   ├── ducks/
│   │   │   └── index.js
│   │   ├── sagas/
│   │   │   └── index.js
│   │   └── index.js
│   ├── styles/
│   │   ├── colors.js
│   │   ├── index.js
│   │   ├── mixins.js
│   │   ├── spacing.js
│   │   └── typography.js
│   └── index.js
├── .editorconfig
├── .eslintrc.json
├── .gitignore
├── babel.config.js
├── dependencies.json
├── devDependencies.json
├── index.js
├── jsconfig.js
├── LICENSE
├── package.json
├── react-native.config.js
└── README.md

Edição

Nesta seção haverão instruções caso você queira editar o template, explicando para que os diretórios são utilizados e também os arquivos de configuração.

Contribuição

Contribuições são o que fazem a comunidade open source um lugar incrível para aprender, inspirar e criar. Qualquer contribuição que você fizer será muito apreciada.

1. Faça um Fork do projeto
2. Crie uma Branch para sua Feature (git checkout -b feature/FeatureIncrivel)
3. Adicione suas mudanças (git add .)
4. Comite suas mudanças (git commit -m 'Adicionando uma Feature incrível!)
5. Faça o Push da Branch (git push origin feature/FeatureIncrivel)
6. Abra um Pull Request

Para testar o template de um caminho local, coloque o caminho absoluto junto com o prefixo file://

react-native init AwesomeContribution --template file://Dev/contributions/react-native-template-avalon-advanced

Licença

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

Contato

Carlos Miguel - [email protected]

Créditos

Este template foi inspirado no template feito pela Rocketseat💜