Firebase, twitter sign-in and Flutter

Do one thing everyday that scares you…

Going through Authentication section of Firebase, there is

First two points are already covered, so that left me with Authentication with Twitter to program.

Let’s begin…

Getting started (with firebase) is simple,

Go to https://firebase.google.com/
Click Get started
Register your app

NOTE : Please note that the name of your app should be same in the Firebase, your project’s manifest.xml and in the app-level build.gradle.

Go through this article, if not understood.

A small advice, always fill the SHA certficate fingerprint, even though it says optional.

Go to

Authentication and enable the Twitter sign in. It will ask you for the API key and API Secret..

For these things, you need to go to twitter dev console.

Things to note :

You need to have the phone number connected to the Twitter profile, else following error comes..

2. Fill the app details :

This callback url is the same as given by firebase (during twitter authentication).

In the website section of twitter, you can enter any url e.g your twitter profile-url or any website e.g : https://placeholder.com/

Final step : You will get your API-Key and API-Secret which is to be specified in the firebase console.

Coming to Flutter side…

Import the following packages, flutter_twitter_login and firebase_auth…

Import the following in main.dart,

import 'package:flutter_twitter_login/flutter_twitter_login.dart';

On click of Sign in with Twitter, the following function is called :

On click of Sign out,

Something useful…

On click of the Sign in with Twitter, everything retrieved from Firebase is displayed onto the next screen (Detailed Screen.dart), along with my profile picture. 😛

Important thing to note: You need to have the Twitter app installed in your device, otherwise it results in below error :

You also need to mention the keys (consumer key and consumer secret) in the TwitterLogin instance as :

TwitterLogin twitterInstance = new TwitterLogin(

consumerKey : “Your twitter consumer key”, consumerSecret : “Your twitter consumer secret”

);

Video demonstration :

For complete source code, visit

https://github.com/AseemWangoo/flutter_programs/blob/master/TwitterSignInWebsite.zip

P.S………………