Image for post
Image for post

Nesta artigo, vamos ver 5 usos do Firebase que foram muito úteis para mim em alguns projetos. Vamos lá!

Introdução

O primeiro passo é instalar os packages que nós precisamos:

yarn add react-redux-firebaseyarn add redux-firestoreyarn add firebase

Podemos usar o `npm install`para isso também. ;)

Configuração

Agora, vamos criar nosso arquivo de configuração. No meu caso eu nomeei como firebase-config.js.

import { createStore, combineReducers, compose } from ‘redux’
import { reduxFirestore, firestoreReducer, createFirestoreInstance } from ‘redux-firestore’
import { firebaseReducer } from ‘react-redux-firebase’
import firebase from ‘firebase/app’
import ‘firebase/auth’
import ‘firebase/database’
import ‘firebase/firestore’
const firebaseConfig = {
apiKey: process.env.REACT_APP_FIREBASE_apiKey,
authDomain: process.env.REACT_APP_FIREBASE_authDomain,
databaseURL: process.env.REACT_APP_FIREBASE_databaseURL,
projectId: process.env.REACT_APP_FIREBASE_projectId,
storageBucket: process.env.REACT_APP_FIREBASE_storageBucket,
messagingSenderId: process.env.REACT_APP_FIREBASE_messagingSenderId,
appId: process.env.REACT_APP_FIREBASE_appId,
measurementId: process.env.REACT_APP_FIREBASE_measurementId, …

Image for post
Image for post

In this article, I would like to share some simple tips about hiding some data in GitHub for security.

Let's provide an example. Let's say we have a React.js app using Travis to handle with CI and CD and using Firebase.
First of all, you need to have a ".env" file. to put the firebase information, something like:

There we'll provide the credentials for firebase and any other important information. But it's not enough. …


Image for post
Image for post

In this article, we’ll check through 5 uses of Firebase that were very useful for me in some projects. Let’s do it.

Introduction

The first step is to install the packages which we need:

yarn add react-redux-firebaseyarn add redux-firestoreyarn add firebase

We can do that using ‘npm install’. ;)

Configuration

After that, we’ll create our configuration file. In my case, I just named it as ‘firebase-config.js’.

import { createStore, combineReducers, compose } from ‘redux’
import { reduxFirestore, firestoreReducer, createFirestoreInstance } from ‘redux-firestore’
import { firebaseReducer } from ‘react-redux-firebase’
import firebase from ‘firebase/app’
import ‘firebase/auth’
import ‘firebase/database’
import ‘firebase/firestore’
const firebaseConfig = {
apiKey: process.env.REACT_APP_FIREBASE_apiKey,
authDomain: process.env.REACT_APP_FIREBASE_authDomain,
databaseURL: process.env.REACT_APP_FIREBASE_databaseURL,
projectId: process.env.REACT_APP_FIREBASE_projectId,
storageBucket: process.env.REACT_APP_FIREBASE_storageBucket,
messagingSenderId: process.env.REACT_APP_FIREBASE_messagingSenderId,
appId: process.env.REACT_APP_FIREBASE_appId,
measurementId: process.env.REACT_APP_FIREBASE_measurementId,
}; // from Firebase…

About

Eder Taveira

Software Engineer, Full Stack Developer, Musician and Writer. edertaveira.com

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store