How to add Firebase Email Verification to your Flutter App 
Tags: flutter, programming, mobile, dart
Published: 2020-12-22 23:58:19

This article is a continuation of my previous article **(Step by Step guide on how to authenticate your flutter app with Firebase (PART 1))**. If you want to code along, I would recommend you read it [here](https://dev.to/dav4thevid/set-by-set-guild-on-how-authenticate-your-flutter-app-with-firebase-auth-3lb4) or clone the repo [here](https://github.com/dav4thevid/flutter_firebase_authentication).

In our previous app, a user can sign up with an email that doesn't exist (You don't want that in your live app). Lets add email verification to our app, so as to prevent users from entering invalid emails.

##EMAIL VERIFICATION

Open `SignUp.dart` file, Our signup method is inside the `RaisedButton`, lets extract that into a separate method, instead of using a callback we would call the method instead. create a new method and name it `signUp`, copy the extracted code into it. You would notice we have an error, the `context` inside our routing right?. This is because our class is a stateless widget and since we have extracted our logic from our UI, its can't get the current context, we can solve this easily by making our class a statefull widget. click on the signUp class then hold `ctrl + .`, then click on convert to stateful widget. (There you go). Now call your method inside the onPressed property of RaisedButton. Your SignUp method should look like this.
```
 Future signUp() async {
    _formKey.currentState.save();
    try {
      final new_user = await _auth.createUserWithEmailAndPassword(
          email: _email, password: _password);
      if (new_user != null) {
        Navigator.pushNamed(context, HomepageScreen.id);
      }
    } catch (e) {
      print(e);
    }
  }
```
Your RaisedButton should now look like this.
```
RaisedButton(
       onPressed: signUp,
       child: Text(
      'Submit',
       style: TextStyle(fontSize: 18),
   ),
),
```
You see our code now looks cleaner. Inside our signUp function, underneath `CreateUserWithEmailAndPassword` function add this code `await newUser.user.sendEmailVerification()`. This function would trigger firebase to send a confirmation email to the user upon signup, all this are done under the hood, easy right? lolx. lets move on.

We need to prevent users from signing in, if they haven't verified their email. We also have to navigate them to Confirm Email Screen instead of the Homepage, So they don't have access to our app until they are verified. Now open the SignIn Class, extract the signin method like we did above, or if you like leave it like that. Instead of checking if user exist, we would be checking if the user is verified. delete `if (user != null)'` replace with `if (user.user.emailVerified)`. Now lets create our Confirm Email Screen. Create a new file and name it `ConfirmEmail` then add this code.
```
import 'package:flutter/material.dart';
static String id = 'confirm-email';

class ConfirmEmail extends StatelessWidget {
  const ConfirmEmail({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Center(
          child: Text(
        'An email has just been sent to you, Click the link provided to complete registration',
        style: TextStyle(color: Colors.white, fontSize: 16),
      )),
    );
  }
}
```
Its just a basic screen no styling or whatsoever, lolx. Moving On, We have to add our ConfirmEmail route, open `main.dart` underneath our routes add this `ConfirmEmail.id: (context) => ConfirmEmail(),`

Now go back to your signin method and change `HomepageScreen.id` to `ConfirmEmail.id`. Your SignIn method should look like this.
```
Future signIn() async {
    _formKey.currentState.save();
    try {
      final user = await _auth.signInWithEmailAndPassword(
          email: _email, password: _password);
      if (user.user.emailVerified) {
        Navigator.pushNamed(context, ConfirmEmail.id);
      }
    } catch (e) {
      print(e);
    }
  }
```
Restart your app and test, A confirmation email should be sent to you after registration, Try signing In before confirmation to check if the verification is working, All this should work fine if you follow along correctly.

Feel free to check my future articles where I would walk you through on *How to add Forget Password and Reset Password* to your Flutter Apps. Thanks for reading, I hope its helps.