❤
npm
Sign UpSign In

react-native-template-pointec-basic

1.1.41 • Public • Published

Version NPM Download GitHub Issues GitHub Last Commit Licenses

POINTEC IT SOLUTIONS logo

Template POINTEC Basic

Está gostando do projeto? Deixe sua estrela :)

Tabela de conteúdo

Sobre o projeto

Projeto para a criação de um template do React Native. Agilizando na hora de iniciar um novo projeto, facilitando o fluxo de desenvolvimento.

Packages inclusos

O templete inclui os seguites pacotes:

Iniciando

Para utilizar o template, seja através do React Native CLI ou copiando localmente os arquivos, siga as etapas abaixo.

Pré-requisitos

Antes de seguirmos para as configurações e uso do template, é recomendado que você tenha o ambiente configurado para criar e testar aplicativos em React Native. Se você tem, ótimo segue em frente, senão corre pra configurar :)

Estrutura de arquivos

A estrutura dos arquivos está conforme abaixo:

pointec-basic
├── .husky/
│   ├── _/
│   ├── commit-msg
│   ├── pre-commit
│   ├── prepare-commit-msg
├── src/
│   ├── assets/
│   │   ├── pointec_logo.png
│   │   └── pointec_logo@2x.png
│   │   └── pointec_logo@3x.png
│   ├── components/
│   │   └── Details/
│   │       └── index.js
│   │       └── styles.js
│   ├── config/
│   │   └── index.js
│   ├── pages/
│   │   └── Main/
│   │       └── index.js
│   │       └── styles.js
│   ├── routes/
│   │   └── main.routes.js
│   ├── services/
│   │   └── api.js
│   ├── index.js
│   └── routes.js
├── .editorconfig
├── .eslintrc.json
├── .gitignore
├── .prettierrc.js
├── .travis.yml
├── babel.config.js
├── commitlint.config
├── dependencies.json
├── devDependencies.json
├── index.js
├── jsconfig.js
├── LICENSE
├── package.json
└── README.md

Instalação

  1. Para instalar e utilizar esse template o processo é simples, basta criar um projeto novo utilizando o comando:
react-native init MeuTemplate --template pointec-basic
  1. Após o projeto ser criado por completo, você pode deletar o arquivo App.js da raiz, alteramos para o arquivo index.js na pasta src.

Com isso o projeto será criado com todas as dependências do template devidamente instaladas e linkadas, tal como os arquivos de configuração que são copiados para o projeto.

Passo Adicional no Android

Para que os gestos sejam habilitados no Android é necessário um passo a mais, abra o arquivo android/app/src/main/java/<pacote_do_projeto>/MainActivity.java, e comece importando os pacotes:

// ...
import com.facebook.react.ReactActivity;
// Importações adicionadas
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;

Feito a importação vamos criar um método novo, logo abaixo do getMainComponentName():

public class MainActivity extends ReactActivity {
  @Override
  protected String getMainComponentName() { ... }
  // Método adicionado
  @Override
  protected ReactActivityDelegate createReactActivityDelegate() {
    return new ReactActivityDelegate(this, getMainComponentName()) {
      @Override
      protected ReactRootView createRootView() {
        return new RNGestureHandlerEnabledRootView(MainActivity.this);
      }
    };
  }
}

Passo adicional para o Husky e Lint-staged

Se você for utilizar o Husky e o Lint-staged, você precisa instalar globalmente/localmente os pacotes:

  • commitizen
  • @commitlint/cli
  • @commitlint/config-conventional
  • cz-conventional-changelog
yarn global add commitizen

yarn global add @commitlint/cli @commitlint/config-conventional

yarn global add cz-conventional-changelog

É possível instalar local ao invés de global.

Você também pode utilizar o NPM para instalar.

Configuração do Husky e Lint-staged

Adicione em seu package.json o seguinte:

  "scripts": {
    "eslintfix": "eslint --fix",
    "prettiercheck": "prettier --write",
    "commit": "git-cz"
  },
  "lint-staged": {
    "*@(js)": [
      "yarn eslintfix",
      "yarn prettiercheck"
    ]
  },
  "config": {
    "commitizen": {
      "path": "./node_modules/cz-conventional-changelog"
    }
  }

Há configurações na pasta .husky.

Você pode ajustar o package.json e os arquivos da pasta do .husky conforme as suas necessidades.

Ajustando o commitlint.config

Quando for utilizado a instalação dos pacotes acima globalmente, configurar o arquivo da seguinte forma:

# Alterar o 'C:/Users/Rafael/AppData/Local/Yarn/Data/global/node_modules/'
# Para o caminho do seu usuário e da pasta de instalação

module.exports = {
  extends: ['C:/Users/Rafael/AppData/Local/Yarn/Data/global/node_modules/@commitlint/config-conventional'],
}

Obs.: Solução temporária e não é a melhor forma de corrigir.

Se for feito localmente, utilizar a seguinte configuração:

module.exports = {
  extends: ['@commitlint/config-conventional'],
}

Solução para o erro da issue #613.

Configuração dos Módulos de imports (eslint-plugin-import-helpers)

Para a ordenação automática dos imports, criamos no eslintrc.json um padrão de configuração.

Você pode ajustar conforme as suas necessidades.

Ajuda

Você pode ajudar o projeto, veja abaixo como contribuir.

Contribuição

Se quiser você pode contribuir com o projeto. Contribuições são o que fazem a comunidade open source um lugar incrível. Qualquer contribuição que você fizer será muito bem vinda.

  1. Faça um Fork do projeto
  2. Crie uma Branch para sua Feature (git checkout -b feature/MyFeature)
  3. Adicione suas mudanças (git add .)
  4. Comite suas mudanças (git commit -m 'Adicionando uma nova feature)
  5. Faça o Push da Branch (git push origin feature/MyFeature)
  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 MeuTemplate --template file:///Users/DEV/MeusProjetos/react-native-template-pointec-basic

Licença

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

Contato

POINTEC - Github - developer@pointec.dev

Readme

Keywords

Package Sidebar

Install

npm i react-native-template-pointec-basic

Repository

github.com/paesrafael/react-native-template-pointec-basic

Homepage

github.com/paesrafael/react-native-template-pointec-basic#readme

Weekly Downloads

2

Version

1.1.41

License

MIT

Unpacked Size

40.4 kB

Total Files

28

Last publish

Collaborators

  • pointec
Try on RunKit
Report malware