https://github.com/sthanleyso/react-native-template-basic-workflow

Template para projetos em React Native
https://github.com/sthanleyso/react-native-template-basic-workflow

axios babel-root-import eslint react-native react-navigation styled-components template

Last synced: 18 days ago
JSON representation

Template para projetos em React Native

• Host: GitHub
• URL: https://github.com/sthanleyso/react-native-template-basic-workflow
• Owner: sthanleyso
• License: mit
• Created: 2019-11-09T18:47:13.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2019-12-28T17:02:33.000Z (about 5 years ago)
• Last Synced: 2024-12-29T16:50:05.156Z (about 2 months ago)
• Topics: axios, babel-root-import, eslint, react-native, react-navigation, styled-components, template
• Language: JavaScript
• Homepage:
• Size: 23.4 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        


![npm](https://img.shields.io/npm/v/react-native-template-basic-workflow)

![npm](https://img.shields.io/npm/dt/react-native-template-basic-workflow)

![GitHub last commit](https://img.shields.io/github/last-commit/sthanleyso/react-native-template-basic-workflow)

![GitHub](https://img.shields.io/github/license/sthanleyso/react-native-template-basic-workflow)

### React Native Template Basic Workflow

## 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.

## Começando

Para conseguir utilizar o template, seja através do React Native CLI ou com uma cópia local dos arquivos, siga os passos abaixo.

### Instalação

1. Para instalar e utilizar esse template o processo é bem simples, basta criar um projeto novo utilizando o comando:

```sh

react-native init NomeDoProjeto --template basic-workflow

```

2. Depois do projeto criado você pode deletar o arquivo `App.js` da raiz, pois o arquivo `index.js` agora aponta para a 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 finalizar a instalação do `react-native-screens` no Android, adicione as duas linhas seguintes na seção `dependencies` em `android/app/build.gradle`:

```gradle

implementation 'androidx.appcompat:appcompat:1.1.0-rc01'

implementation 'androidx.swiperefreshlayout:swiperefreshlayout:1.1.0-alpha02'

```

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

```java

// ...

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()`, ficando:

```java

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);

      }

    };

  }

}

```

Adicione a seguinte linha no topo do seu arquivo principal, como `ìndex.js` ou `App.js`:

```javascript

import 'react-native-gesture-handler'

```

---

## Licença

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