Original subtitles

In this lecture, we're going to refactor our configuration of FIREBASE by exporting services.

We're going to be using additional services by Firebase.

We're already using one service, which is the authentication service.

The authentication service by Firebase does not store additional information about the user.

It stores the email and password.

That's about it.

We aren't able to store their age, country or name.

We won't be able to store it in the authentication service.

If we like to store additional information about the user will need to store it in the database.

Firebase has another service called Firestar.

It's the name of their official database.

The FIREBASE SDK comes with a module for interacting with the fire store API.

The functions for interacting with the database can be enabled by importing the package.

We're going to open the firebase file in our editor.

Every service by Firebase is broken up into packages.

We've imported the authentication package to enable the methods for authentication.

If we like to enable the methods for interacting with the database, we'll need to import the fire store

package.

We'll import it without assigning it a variable.

It's crucial we import the firestorm package and not the database package, if you were to read the

documentation, you might come across the database package.

The database package is for the real time database service.

It's a package for the old version of the database.

For this course, we're using Firestar, which is the newer database.

Importing the fire store package, will assure us that we have the correct methods and properties for

interacting with the correct database.

We don't have to import the database package because we're not using the real time database.

It's not required to assign the package to a variable.

Firebase will extend the firebase object.

The next step is to refactor the code.

I'm going to switch over to the register form component.

In the register function, we're invoking the firebase stop function to access the authentication service

by Firebase will have to repeatedly call the firebase off function.

If we want to use the authentication service, that's not very efficient.

It would be better if we created a reference to the service.

We'll want to do the same for Firestar.

We're going to use the database frequently throughout this course.

Creating a reference will make our code more readable.

Switch back to the Firebase File.

We're going to create references to the authentication and firestorm services.

Then we'll export the references.

This will allow for any component to access a service without having to create a reference itself will

begin by removing the export default keywords.

Instead of exporting a default object, we're going to use named exports, we'll still want to initialize

Firebase with the initialize app function.

This will not change.

After initializing the app, we're going to create a variable called authentication.

Its value will be set to the object returned by the firebase function.

Create another variable for the database reference, its value will be set to the object returned by

the Firebase Firestar function.

The firestorm function will return an object with methods and properties for interacting with the database

rather than repeatedly calling it, will store it in a variable.

This will make our code more readable.

We're finished creating the references we'll want to explore with them.

Both variables will be exported as named exports.

We're using named exports because it's easier to structure in an import statement.

This will break the app because the register form component is expecting the firebase object when it's

not being exported anymore.

We'll need to update the component, switch over to the register form component, scroll to the import

statements, update the import statement for the firebase file the of the object for the authentication

reference.

We export it.

We'll update the register function next, instead of calling the firebase afunction directly, we can

replace this line with the off reference we imported.

Great, we've successfully refactored our code base, we are creating references of our services, this

makes our code more readable, will continue with storing the user's information in the next lecture.