.ENV e React Native

Quando você está trabalhando em um projeto e está usando SECRET KEY, API KEYS, informações de banco, a melhor forma é não expor esses dados em algum repositório publico e para não ficar controlando manualmente, existem algumas ferramentas que podem te ajudar. Uma dessas ferramentas é o react-native-dotenv, digamos que você quer montar uma requisição para uma API:

import axios from 'axios';

export default axios.create({
  baseURL: 'https://api.yelp.com/v3/businesses',
  headers: {
    Authorization: `Bearer dxpdo452d22ds6djdjxcksllhunnop`,
  },
});

Da forma acima você está expondo sua APIKEY para que alguém possa usar, com o react-native-dotenv você pode usar da seguinte forma. Primeiro crie um arquivo .env e salve a APIKEY dentro dele:

API_KEY=dxpdo452d22ds6djdjxcksllhunnop

Inclua .env* no seu gitignore:

#dotenv environment variable files .env*

Instale o react-native-dotenv com:

yarn add react-native-dotenv -D

Ou com NPM:

npm install react-native-dotenv --save-dev

Modifique o seu código para buscar a API_KEY do react-native-dotenv, que por baixo dos panos vai buscar do seu arquivo .env.

import axios from 'axios';
import { API_KEY } from 'react-native-dotenv';

export default axios.create({
  baseURL: 'https://api.yelp.com/v3/businesses',
  headers: {
    Authorization: `Bearer ${API_KEY}`,
  },
});

Conclusão

É bem fácil usar o react-native-dotenv e ajuda bastante a controlar as variáveis de ambiente em modo de desenvolvimento com segurança. Espero que essa informação tenha sido bacana pra vocês.