Firebase - Overview

As per official Firebase documentation −

Firebase can power your app's backend, including data storage, user authentication, static hosting, and more. Focus on creating extraordinary user experiences. We'll take care of the rest. Build cross-platform native mobile and web apps with our Android, iOS, and JavaScript SDKs. You can also connect Firebase to your existing backend using our server-side libraries or our REST API.

Firebase - Environment Setup

In this tutorial we will show you how to add Firebase to existing app. We will need NodeJS. Check the link from the table below if you don't have it already.

Firebase - Data

The farebase data is representing JSON objects. If you open your app from Firebase dashboard, you can add data manually by clicking + sign.
We will create simple data structure. You can check the image below.

Firebase - Arrays

This short chapter will show you Firebase representation of arrays.
We will use the same data from the last chapter.

Firebase - Write Data

In this chapter we will show you how to save your data to Firebase.

Set

The set method will write or replace data on specified path. Let's create reference to players collection and set two players.

var playersRef = firebase.database().ref("players/");

Firebase - Write List Data

In our last chapter we showed you how to write data in FIrebase. Sometimes you need to have unique identifier for your data.
When you want to create unique identifiers for your data, you need to use push instead of set.

Firebase - Write Transactional Data

Transactional data is used when you need to return some data from the database, make some calculation with it and store it back.
Let's say we have one player inside our player list.

Firebase - Read Data

In this chapter we will show you how to read Firebase data.
The following image shows the data we want to read.

Firebase - Event Types

Firebase offers several different event types for reading data.

value

The first event type is value. We showed you how to use value in our last chapter. This event type will be triggered every time the data changes and it will retrieve all data including children.

Firebase - Detaching Callbacks

This simple chapter will show you how to detach callbacks in Firebase.

Detach Callback for Event Type

Let's say we want to detach callback for a function with value event type.

Firebase - Queries

Firebase offers various ways of ordering data. In this chapter we will show simple query examples.
We will use the same data from our last chapter.

Firebase - Filtering Data

Firebase offers several ways of filtering data.

Limit to First and Last

limitToFirst method returns specified number of items beginning from the first one.
limitToLast method returns specified number of items beginning from the last one.

Firebase - Best Practices

In this chapter we will go through Firebase best practices.

Avoid Nesting Data

When you fetch the data from Firebase, you will get all of the child nodes. This is why deep nesting isn't the best practice.

Firebase - Email Authentication

In this chapter we will show you how to use Firebase Email/Password authentication.

Create user

To authenticate user, we can use createUserWithEmailAndPassword(email, password) method.

Firebase - Google Authentication

In this chapter we will show you how to set up Google authentication in Firebase.

Step 1 - Enable Google Authentication

Open Firebase dashboard and click Auth in left side menu. To open list of available methods, you need to click on SIGN_IN_METHODS in tab menu.
Now you can choose Google from the list, enable it and save it.

Firebase - Facebook Authentication

In this chapter we will authenticate users with Firebase Facebook auth.

Step 1 - Enable Facebook Auth

We need to open Firebase dashboard and click Auth in side menu. Next we need to choose SIGN-IN-METHOD in tab bar. We will enable Facebook auth and leave this open since we need to add App ID and App Secret when we finish step 2.

Firebase - Twitter Authentication

In this chapter we will explain how to use Twitter authentication.

Step 1 - Create Twitter App

You can create Twitter app on this link.
Once your app is created click on Keys and Access Tokens where you can find API Key and API Secret. You will need this in step 2.

Firebase - Github Authentication

In this chapter we will show you how to authenticate users using Github API.

Step 1 - Enable Github Auth

Open Firebase dashboard and click Auth from the side menu and then SIGN-IN-METHOD in tab bar.
You need enable Github authentication and copy Callback URL. You will need this in step 2. You can leave this tab open since you will need to add Client ID and Client Secret once you finish step 2.

Firebase - Anonymous Authentication

In this chapter we will authenticate users anonymously.

Step 1 - Enable Anonymous Auth

This is the same process as in our previous chapters. You need to open Firebase dashboard, click on Auth from side menu and SIGN-IN-METHOD inside tab bar.
You need to enable anonymous authentication.

Firebase - Offline Capabilities

In this chapter we will show you how to handle Firebase connection state.

Check Connection

We can check for connection value using the following code.