Beginning FlutterFire

Aug 30 2022 · Dart 2.16, Flutter 3.0, Visual Studio Code 1.69

Part 2: Add Authentication to Your App

04. Implement Firebase Authentication

Episode complete

Play next episode

About this episode
Leave a rating/review
See forum comments
Cinema mode Mark complete Download course materials
Previous episode: 03. Create a FlutterFire Project & Initialize Firebase Next episode: 05. Add a Sign-In Screen
Transcript: 04. Implement Firebase Authentication

The first feature you’ll add to your app is Authentication. Firebase Authentication provides several services you can use to implement authentication in your apps, including authentication through a username and password, or third-party providers like Google, Facebook, Microsoft and others.

What this means is that you’ll have Firebase deal with all the details of registering a new user, authenticating them, and sending a lost password.

In our app, we’ll use authentication with a username and password, and we’ll allow our users to register and sign in.

The first step is enabling authentication in the Firebase project. So, get back to the Firebase Console, and in your project’s overview page, click Authentication on the left menu, then in the Authentication page click on the “get Started” button.

Here you can specify the sign in provider or providers you want to enable. Click on Email and Password, and then enable the Email and Password login and press the “Save” button.

Now that authentication is enabled in the Firebase project, we also need to configure our app to use it. So, get back to the Flutter project, and from the Terminal type:

flutter pub add firebase_auth 

Quite predictably, this will add the firebase_auth plugin to your project. So, this is the pattern: every time you want to use Firebase in your apps, you must add the firebase_core plugin, and this is a prerequisite for all the Firebase services you want to use.

Then for each service you’ll use, you need to add the relevant flutterfire plugin, in this case firebase_auth, that deals with authentication. At the page you see on the screen you can have a look at all the flutterfire plugins currently available, with their current version. There’s another package we should add before moving on: it’s the flutterfire _ui plugin.

Flutterfire_ui contains set of widgets that help you create your user interface that integrates with Firebase. In our app, this means that we will add a login, sign up and forgot passwords screen with almost no code! So, let’s install the flutterfire_ui package by running:

flutter pub add flutterfire_ui 

OK, let’s check if everything’s fine by running the app. Great! Let’s add the authentication screens next!