Mastering Referral Codes and Dynamic Links in Flutter with Firebase | amplifyabhi

in this vog we are going to deal with the implementation of Firebase based referral system in your flutter application so in our previous tutorial we have seen the implementation of dynamic links using Firebase in our flutter application and I'm getting few comments regarding how to implement referral system in this particular Dynamic links and also again I'm stating that Firebase Dynamic links will be shut down by August 25th 2025 and yes you are having 2 years of time and if you are trying to implement this particular Dynamic links in your flutter application so I suggest you to follow this particular tutorial till the end and also in these tutorials I have shown you how to implement Dynamic links without using Firebase so now let's get started with this particular tutorial and try to see how we are able to implement a referral system and before getting started I suggest you to go through these particular tutorials because I have explained a lot of basics in those particular tutorials and which will be very much helpful for you and in this part of the tutorial I'm going to start coding from the scratch so that you will understand each and every point so don't skip any part of the tutorial and the code for this tutorial I will be providing in the description section below so now let's get started and here the first thing here what you need to add is Firebase Dynamic links over here and Firebase core here so and ignore this particular go router and icons launcher so I have added it for my previous tutorial so I'm just going to remove those two things and now let's get started with this particular tutorial so now the very first thing what we do is like import material do dot here and and also we need to consider the Firebase Imports as well but based on the code when we try to make use of them then we will try to import them at and not at the beginning of the tutorial so now let's get started with the void main here specification and here I'm making this void main of type asynchronous because I'm going to initialize Firebase over here so wiet flutter binding dot ensure initialized so again the first question might rise up like why we are using widgets flutter binding. ensure initialized so flutter will make sure that all your platform dependencies are being binded before getting started with the code implementation so again what is the platform implementation here so in Android we have specified like the Deep link specifications and also sometimes you need to specify few platform level things in both Android and iOS platforms so all these things will be binded before you get started with the coding so now let's try to initialize Firebase as well Firebase and now you need to add the Firebase input so Firebase do initialize app Here and Now specify run app here so this is the most important thing and you need to specify run app over here and the next thing what I would like to do is like I would like to specify a stateful widget instead of a status widget and here I'm specifying my app over here and now let's try to return a material app rather than a placeholder which was there from initialization and remove the constant over here so here in the material app now let us try to specify home here and inside the home we need we'll be specifying scaffold and here as I have said I'm starting from the scratch so I'm going to specify all these things and if you are well aware of all these things you can just skip and directly get on with the tutorial so Firebase referral okay so this is the app bar title I'm going to specify and now comes the body over here so for now I'm going to specify a column here and I'm sure you are aware of what is a column and row if not just let me know in the comment section below so in our previous tutorials also I have explained what is a column and what is a row so it's like a multi-child widget you can say for column and row here so you can have like multiple widgets here so I'm going to have a text widget and inside this text widget I'm going to show like welcome or hello world anything you can just specify over here and the next thing what I'm going to show is like again a text widget where we will be printing all the details which we got from the Firebase so for now I'm just going to specify it empty later on we will try to append this particular thing and also you can just style it over here so text style and you can just specify the font here font family font size I'm going to specify so that's it and also you can just specify colors and all those things over here like text color and now comes the important aspect like how you handle this particular link okay so you have got a link which will open your application but how you are going to handle this particular link like after opening the application what are you going to do with this particular link and the details which you got from that particular link so now for which I'm going to create a method using void that it will not return anything so handle link here this is the name of the function I'm going to specify and you can just specify your own name which is according to your requirement and your understanding here we are going to have pending Dynamic link data as a parameter and here we are going to get the data now so we are going to get this particular data from the link which we receive and now we'll try to handle this particular link over here so that's why I specify like handle link for the function name and the first thing you need to do is like you need to verify whether data is null or not so you need to specify whether data is null or not and if it is not null then you need to make use of this particular data to avoid any crash in your application so let's pass the particular URI which you are getting over here so how you will do this is like from the data you will be getting the link here so data do link and now let us try to add one more condition like if URI is not equal to null just maintain proper spacing Here and Now let us make use of a map over here and try to find out the values which we are getting from that particular URL and this is of a type string comma string here I'm using map so we will be getting UTM parameters and again what are UTM parameters I will be explaining you when we move to the Firebase console so there I will be clearly explaining you what are the UTM parameters UTM parameters so here you can find data. UTM parameters here and now let's try to find out the Imports here so we have got these two Imports added to our code like Firebase _ core and Firebase _ dynamicore links which we have added in our dependencies at the beginning of this tutorial so now let's try to make use of them and try to fetch the parameters and now let us try to cach them to our map over here which is of the type string comma string so if you having any queries Regarding why we are casting them to string comma string just let me know in the comment section below and if I try to explain everything it will be again a long tutorial so I'm just trying to explain the important aspects and all your queries just let me know in the comment section below I will surely try to help you and now you can try to print these particular parameters or you can just try to append these particular parameters directly to your data so now I'm going to print these parameters firstly so I'm going to specify UTM Source over here and for which I'm going to append UTM parameter and here you need to specify this particular key name and again I will be showing you from where we are getting this particular UTM Source key name as well so so yeah we have almost completed with this particular handle deep link method and you will be having two more uh parameters which needs to be printed so that is medium and campaign and just try to append them accordingly so medium and double verify y these particular key values here just to avoid issues in fetching the data and now we have got this particular handle link function here and how we need to handle them so on app start and whenever we receive that particular Dynamic link we want these particular details to be printed so for that to be happened we need to specify them in void main so now come back to the void man over here and try to specify and try to make use of this particular function so now let's try to create a variable initial link so this will be open whenever you open the application so it will make use of the function and the next one will get used whenever you get a dynamic link from Firebase so AIT and make use of Firebase Dynamic links do instance. get initial link Here and Now call the handle link function by providing the initial link get the data now so here we we have specified data right so this particular data we can fetch whenever we open the application and here open the application in the sense I'm saying again so you have not called any link but if you have called a link previously and then came back to open the application then in that particular scenario this particular code will be utilized and will be printed accordingly and now what we will be doing is we will be specifying one more code here this particular code will be made use whenever you call this particular URL from the browser so when the application when you call the URL the application will be opened up right directly then in that particular scenario what code we are writing now will be utilized so again let's get the instance and on link here so whenever you run that particular link you'll be getting the data and you need to listen to that particular data here and again again this will be of a type asynchronous and now you need to handle the data which you got here so yes that's it from the code level here and now let's try to move to the Firebase console and and now let's try to move to the Firebase console here and here we are trying to create a dynamic link so in our previous tutorial we have created a dynamic link and for those who are new to this particular tutorial I think this will be helpful for you so amplify AB I'm just specifying it again so I have used this particular URL already so it is it is saying like short URL is invalid or already in use so I'm going to specify amplify ab2 over here and next here I'm going to specify the URL and for which I'm going to make use of the same URL here so I'm going to specify the same URL and if you are having any custom URL you can just specify it as well and and here the name of the URL is amplify AB here and now let's go to the next section and here these are the properties which are applicable for the Apple devices and for now we can just specify it like open the Deep link URL in the browser and the next section is for Android and open the Deep Link in your Android app so this will ask us the Android application which needs to be open when you call this particular link so all these particular configurations I have dealed in our previous tutorials so just refer to them if you are having any confusion like how I'm getting this particular drop down of applications and here if your app is not installed send the users to Google Play page for your app okay so your app needs to be uploaded on the Play Store to make sure this particular functionality to work and also I have explained that in our previous tutorials so just refer to them and here here here comes the UTM parameters so I'm saying in the code level right every time from where we are getting this particular UTM Source UTM medium UTM campaign so these are the things which we are getting from here so here you can find the keys as well and yes you need to use the same keys in your code and you cannot change them here because they are by default specified by Firebase and the first thing here I'm going to specify is like campaign source so the campaign Source letters try to make it like a YouTube here so from YouTube I'm getting this particular referral and campaigning medium so they have specified like CPC so I'm just going to make use of the same and the campaign name is like amplify AB I'm going to specify and 50% off so you can just specify anything here and now let's try to create this particular Dynamic link and so here I'm going to specify my website name here so it would be like amplify.com and now let's try to create this particular URL and here amplify AB is now created so so now let's try to copy this particular link and get back to the Android Studio here and try to run this particular so now our application is installed on the device and here you can see welcome over there and let's try to make it to the center of the so let's try to wrap this into a center widget so Center and inside which let us try to specify child and in the column main AIS alignment do Center and let's try to save the code and here you can see it to the center of the screen now and now let's try to copy this particular link and try to make use of this and now I'm trying to open this particular link which we have created and yes here you can see we have got the data printed on the console here so this is what we have just printed right UTM Source medium and campaign and all those things were printed here in our console and we have made use of a stateless widget right so you can just make use of this uh data once you get them and try to print here using this particular text widget and yes this is it for this particular tutorial I hope you understood this particular tutorial if you are having any queries just let me know in the comment section below for more interesting tutorials do do like share and subscribe to our Channel

Channel: amplifyabhi coding

Views: 1,906

Keywords:

Id: IS2jZ1rjg9U

Length: 16min 11sec (971 seconds)

Published: Thu Nov 16 2023