Flutterflow Google Sheet Tutorial: How To Integrate With The Google Sheet Api

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
Hi my name is Shriyansh and how are you all, I welcome you all once again in a new video of Flutter and in today's video we will integrate G Sheet and see how you can convert G Sheet into S. You can use the back end, okay, actually there are two methods to integrate the app, the first is by calling your API and the second is by using the app script, but we will see both the methods today, which will make it easier for you too, okay. And before starting the video, I want to give an information that whatever video I make, whatever app I make, it is a clone of that app, of that project, it is available on my website. Okay, so you go from there and download that thing. You can purchase it for around ₹ which is given in the description, you can go there and connect with me 24*7. Whenever you have any question, you can ask me from there. So let's start the video first. I take an excel sheet, okay here, either I create a blank or I take this excel sheet that I had with your queries. Okay, we have the excel sheet of queries. Now let's come. People, I will come from here - Sheet API Overview - Okay, here we gate, after gating, we will have this, we will get an end point, okay now what to do in this end point, give us the ID of the spread sheet. What will we do for the ID? We will come here, let's copy it. Okay, let's copy it. We will come here and paste it. If I need a key here, I will directly execute it here. Execute this thing. After doing this, you see here the success of 200 has been shown, which means that your seat is loaded, it is ok and coming down, we have to give the range from where to where we have to show the seat, which means our seat is G. There is a range of cells in it. If you guys have worked on Excel then you must have seen that there is a range of cells there. Okay, so it is something like this. We have a range of cells, so from here I come from the bottom till till here. Let's go, okay, this is the range of cells that we have and the range that is coming is going from A to C 54, right here I paste it, execute it, look at this again, whatever your range was from here. It has come, okay, so now let's see how to access it, what to do, I have told you in a simple way, you have to do this, okay now how do we have to access it, the spread sheet values ​​will appear, let's come here. Okay, after coming to the overview page, we will come here, we will come to the gate, okay, after coming to the gate, I open it, here again I give it the ID of the spread sheet, okay, we will come from here, let's copy it from here. After copying, we will paste it, we have to give the range from A1 to 54, we only need the API key, so I will activate it for the API, everything has come to us, everything is fine, whatever content we had, please check this content. We had it here, we have got it, now we have to do the same thing in stir flow, so how will we do it, I copy it from here to the last one, till here for a minute, I do one thing, first I copy this. Right because this will make it easier for you guys, let's copy it, after copying it, I come here and call Create API, I write here, 'Shut', okay, I paste it here, I get the values, I get the range, after that In the end , what we need is our API key, let's remove this value range, we have this given API key, it will be called as a query, okay, so we will keep key equal to two, we will copy this so that's it. I copy from here to here and paste it right here. Now let's come to the variable. What we have to do in the variable is to enter the ID of the spread sheet. We copy it from here. It will be a string. After that we have to give the range. We have to give the range here . Here I copy and paste the string and add variable. Which API key is ok? Here I paste this will also be our string. Now see, you will get the API key you want on your page and you will get it from here. You have to choose the project, whatever your project is, or you can create a new project again. After doing this, you have to come here in the dashboard. When you come here, you will get the API and services here. After coming here to the library, after coming to the library, write here Sheet API, then when you click on it, it will show you enabled here, if it is not already enabled, then it will show enabled here, then when you click on it, you will Whatever API you have, it will be enabled. Okay, now that it is enabled, we come again to our API. Sorry, we will not come to this. We come back. We come to the credentials. Okay, these credentials are done. After coming here, you can create credentials here. If you want to create an API then do it from here. If you already have one then you can choose that thing from here also. Now as soon as the API is created, Ours will be done, we have got this key, I close it and this is our key, this one, I rename it, let's rename it, we have the API key of G shut, okay and save . This is done, I copy it again from here the API which is ours and I do this, paste add call here, the response will come in the test, you have to give the spreadsheet ID of the spreadsheet, so for that we People will come here, I copy it, okay, I paste it here and our range was from A1 to C54, let's paste it and we already have the API key. One minute, this is your range, right ? You will have to do it right, you will have to do it this way, only then your conclusion will come in the test. Okay, now I will call the test API from here. So see, the content that was in your gullet, we have got it here. Look, you can give us all these things . If you have found it, then what is the trick in it that this call of yours is coming, it is coming in the list of lists, that is, in a way, it is coming in an array, okay, so what you have to do is directly you Select it here, it's okay, you will come to the selected here and do the same thing, copy it from here, it's okay, paste it and save it, now what happens from here is that this value of yours has come, right, if I copy it here. Let's go to Jason beautify, Jason is there, no, no problem, if I do it from here, let's beautify it here, look something like this, your call is coming, that means this is your list. Okay, whenever you have square brackets inside this list, it is called a list. Now another list is coming inside this list, so what does it mean, it has become an array. Okay, when it has become an array, then how do you call it? What we have to do is a little trick, so you look at it properly, now look at it, we have to show it, then we will come directly here, okay, we will come to our UI, after coming to this, let's add the column here, right after adding the column. First I will remove it, I will do a back end query, I will call the API from here, OK, we will come to the gal sheet, we will give the spread sheet ID, we will copy the ID that we have given here, we will paste the range which We will give it to this person, we will give it to him, we will give it from A1 to 54, okay and we will confirm, you will think that I am not giving the API key here, I am not giving the API key here because I already have it, from here we will give the API key. Ok, we have the default value, so we do not need to enter it. However, if I want to make it more simple, I remove it from here and whatever is the API key, and here I straighten it, ok and save it. I am giving this, now you will not need to enter the API. Let's come here. Now the back end that we had has been added. After the back end is added, let's come to this. We will come here and click on the list here. After clicking, we will take custom, what will we do after taking custom, we do it here, dollar dollar dot values ​​means what will remain, let me tell you, we will take values ​​when here, meaning now this values ​​value, which came here, call this one this one. I will show you the meaning, let me once again confirm to you that this value that came from your list will generate that list. Look, this will generate this list. Okay, I will show this list, the rest of the things that were yours . Here, it will not show whatever things were there at the top. Okay, so the values ​​will come here. We have come back to the columns. Let's click here and the values ​​will come in the custom. So we had written that if you want, select this also. You can, but to make it easier for you, we do it here, the values ​​are ok and we will confirm here, we will confirm the API API values, we will do OK. Now let's put it here, we will put the text inside, we will do a little spacing between them. There will be a spacing of 20 here, we will do it in the middle, okay, there will be a little space from the top as well, okay, let's come to this, now how will we have to show the text, like see, if you agree, name. If you want to show it, then you will have to use zero for the name, which means you have to show it here according to the index, so if you want to show the name, then you will have to use the index zero because whenever you create a list, you see the list. The data that is fed into it is in the form of an index. The first index is zero, which means the first item with this name will be at index zero and the second one will be at index one. But and this third thing that will happen will be on your two. Okay, so if we want to call according to the index, then we will come here and we will come in the API value, we will come here in the session path, here we will do it, will we do one one here ? Meaning, this thing will come, this one will come with MT, otherwise we remove MT here and make it zero, now what will come in zero, this name of yours will come, okay, here we confirm, after confirming, we go here once in test mode. Let's run it and see if it is working or not. Well, as far as I can tell, it seems to be working. Okay, your build is ready and as soon as it shows, I will let you know if it is working. Is it working or not? Let's see, this is your list, that is, name has come, Sheikh has come, Rahul Pradeep Patil has come, so in this way, you have got the data that was there, that is, you have got the data that was there. Okay, now along with this, if you want to show other data also, then what will we do with it? After ripping it, we will do the test. After duplicating it, we will duplicate it. This is your column. I will give the spacing of 20, it is ok and we will make it scrollable and we will make it above, what has to be done in this, we have to show which data is of query, this one is ok, so what will we do for it, we will come with our Jason Waver. I will see on which index is this, this is our index, it is on the third or second index, right, meaning this is on zero, this is on one and this is on two. Okay, so here we will do two and confirm it like this. You will see one thing here, when I come once again in this, you see, the name is showing, that is, it is showing you this thing, this thing, so you can simple for this, you can do the range which you have now. Had you given this range from where and had given it means you were giving the range from here but now what to do that instead of giving the range from there you give the range from A2, it is fine, it means you are now giving the range from here. OK and confirm from here. After confirming, save it. After saving, run it once again in test mode. I will read the instant again. Then see this. After loading your instant, this is yours. The data has arrived, meaning the first data and the second data, everything has come from here. Okay, so in this way you can call the API. Now let's come to the second method, which means by writing your script. You will have to write a little code, what has to be done for that, we come directly to it, here you click on the extension, then you will get a script, click here, you are okay, you will have to write the code, which I will write quickly . By the way, what is the benefit of this script, that which you just called inside Flutter Flow, your output was coming like this, okay, there were many things coming in it which you could write in a proper way. You will not be able to call from and can get a lot of complexity. Okay, I will write the code quickly, let's do the webl doc, it will be equal to spreadsheet, we will dot it, let's do the get active spread sheet, okay, this will be done, we will have this. What we do is, let's close the data from the front, let's make it active, let's make it active, okay, let's keep it simple for a minute, otherwise this function will start calling, let's dock it, dot get the sheet by name, okay. What is the name of our sheet? Sheet One. What is the name of this sheet? Sheet One. Okay, we will do it on this sheet, we will do this, from this, the second will come, the value will come on this variable value, what will this do? Equal to do means active. Set dot get data range means data range means up to where is your data, like from A to L, A is up to 54, it will take this, this will do this, we will dot like this, here we will do the get value, okay Yes, the get value will be there, or your sorry value will be there, or there will be no value, okay, we will do it, it is closed from here, now we will do the output, do not write output, you can also write equal to result, what will we do, or will we list it. I will make it, that is, I will make an MT list, okay, I will do it. Below now we will create a for loop for the for loop we will do we are equal to i equal to 0 ok we will do comma sorry not comma we will apply semi calculus after that i value ok dot length is done we will do it like this we will increment i and tell Now, what I am doing is I will write the code, we will create a bar graph, we will make it equal to this, whatever format it will be in, then I will do this in Kali Bases, now we will do this, this will be: Whose list do we have to give in the list, so whose name is this name? It means this one is your name, we will name it as Y P N A ME. Okay, name is equal to value. First we will take I. Okay, we will take zero. What is happening here is that you will take the meaning from I which is yours. First look, let me show you like this, stop, look at this one, what does your I mean, in the values, this is your first array that was coming, the first index is going to pick up what thing from it, the one with zero index is okay, what is it with zero index? Is it your name? This one is the name of whatever thing is yours, it will pick it up, okay, seconds come, we do not need to write in seconds, let the name remain, I do the output on Y, sorry, the output will not remain, we will have the result, output again and again. I am going to push it, how will we push it, we will close it inside the row, we will close it, we will come to Y, we will return, what to do, we have to return content service, we will dot Y, we will mime type on Y, sorry, we do not mime type Y. While creating, we will output the text ' cut'. If we want to output it in Jason format, we will do it as JSON, we will dot it, we will convert it into string, okay, after that we will keep the data here, while stuffing it, we will keep it as the data. We will output the data okay. This is done, you will dot here, you will type set mime, okay, we will do this, in the content type, content type will be service dot mime type, after that dot is json, it is okay, meaning you want it in json format, let's close it like this . And from here we do save. After saving, I run it and see whether it is working or not. Just a minute, I did not use it, okay, I did not use cmd calculus, I did not close it, I am checking it. Is it running? Is it not running? The action has started. Output is not defined. We do not have to write the output. We have to write the result here and save it. I run it once again and deploy will run. By the way, ours will not ask for authorization. When you do it, you will have to authorize it. Mine is not asking for authorization because I had tried it several times before making the video. Okay, so my thread is complete. So you see, you got it like this. We will copy this and if we see it in the json view, paste it and beautify it, you have got something like this, here your data cast data is listed and after that your name has come, you see, your name is visible. Maybe you can remove this also, I will check it once and see once I modify it, let's say we will make it one, ok, after that I will diploid, not diploid , it is not a matter, we will make a new diploid, okay And I remove it from here, sorry, I am removing it, that is, I click here, your name is showing, but all the output that is coming is your MT of name, but we do not have to do this, right, so we are one. This will work, let's keep it at zero, let's make it zero from ya, okay and the value of i, if I start from one, if I start from one, then it means it should start from here, ya will be at zero, it should be one, once again displayed. Let me check it, it is not working, I am coming to remove it, let me tell you again that your name is coming, this one is the name of this column, it has to be removed, the name of the previous column is coming. I delete it again , let's go to it, okay, now see, it is correct, whatever name you had, has been removed, okay, I removed it, see how, here, if I made it equal to and, then it is okay, then from where will it go? It will work from here, okay, this is the zero index, this is the one index, then from here, your aa will work, okay, from there, which index element will be taken from the index with zero, if you are not able to understand like this, then understand like this: test mode. I come, sorry, not in test mode, we come here, we come in flutter flow, see what happened first of all, your coming here was equal to zero, then when it was equal to zero, it was taking the first thing, meaning. I was taking this one arrow, okay which one of these I was taking, I was taking the name, okay if we made it equal to one, that means it came It became equal to one, what did it do, it left this thing because it is not there in this index, now it started from here, it is okay, it started from here, what did it see after this, it is zero, okay, the second index that I saw was zero. Look, it has come here, I will do the same in this also and show it, see what it has done here, it has got zero here, okay, it has got zero, the name is blank, it has come, okay, so you were seeing the name there, but as soon as He did one. Sorry, here I do one. Okay, so he has removed the first thing which was yours and has taken the second thing. Okay, so according to the index, he is adjusting his, this is how your name is done. If you want to do a curry show, then come in row, okay, by the way, there is MT in the middle, so let me see for MT, what can we do, we come here in the row, Harry, I do copy paste e equal to value i After that, we do a zero run on it and see whether it works or not, maybe it doesn't work, never mind, we test it , we turn it off, then see what your curiosities were, they are here. So it is gone but Curies all MTs are coming is n't it Reese all your MTs are coming Harry Sheikh Sheikh is coming in the name also no problem let's not make it zero but let's make it one ok di Palay again I will do it from here Because we have to keep it on the second index, we don't have to keep it on the first index, let's come here, by the way, its index will be the one of Curie, it will be yours, no, let's take a look, now Bhiri, the one that was coming to you is coming to MT only . Isn't it yes, MT is coming, that MT is coming because there is nothing of yours, if you do second p, then you look like this, the way I am testing, you too can test by changing the values ​​here and there. You can do it, it's okay because if you are a non-coder, you don't have technical knowledge, then in this way you can try it and see if the issue is coming, look, all our things are here, okay, I will copy it here. After copying, paste it in Beautify and Beautify, what will happen is that whatever data you had has come here. Okay, now we will tell you how to do this in the next section, or copy copy. After doing this, here I create an API call, here I cancel it, okay, let's do this, create an API call, paste it, okay, I do a paste call, come to the response test, click on the API call. Let me see, your data has arrived, now we have to come to the recommendation and take the data directly, okay, after the data, you can take the name of the data, from here you can take the blank of the data, okay, so here I am giving our data. I got the pass, let me take the data, okay, I have got the name here, the query has come, OK, let's save it, we come here, now we have to add query inside the column, so we will directly come here and remove it. We will add this back and query, we will come in the API call which A sheet needs to be done and we will confirm from here, we will come here, OK, we will cancel and remove this, we will come here, we need the response of the A sheet, we need a list of data or If we want a list of names , then we need a list of data. Well, if you want, you can also take a list of names here and you will confirm it from here. When you come to the name page, you will confirm it. You will OK it. What to do here is to remove it. You don't have to do anything else, you have to come directly, no further changes, you have to make it here, okay, remove it, you will save it, when you run it once again, you will see that thing here, if any . If the issue comes then we build it again, this is your build and it is ready, let's see whether the correct output comes or not, then see that the output you had was there, it is ok, it is Sheikh, it has come by the name of Rahul. Whatever MT value was there, MT is there in it, all the other values ​​have come here, okay, in this way you can integrate the G sheet and you will get its demo on the website, although there is nothing special in it. I will give you the code on the website, okay if you have followed this entire video then you can easily learn what to write and how to write, okay let's meet you in the second video, till then you guys take care of yourself and This time I will come live on Saturday, so please as many people as you want, it is okay to attend it once, so let's meet you later on the day I come live on Saturday, you guys take care of yourself, have a nice day bye bye .
Info
Channel: No Code Academy
Views: 2,888
Rating: undefined out of 5
Keywords: FlutterFlow Tutorial, flutterflow tutorial for beginners, Flutterflow google sheet, flutterflow tutorial 2023, flutterflow tutorial for beginners 2023, flutterflow tutorial in hindi, flutterflow tutorial español, flutterflow tutorial bangla, flutterflow tutorial firebase, flutterflow tutorial api, flutterflow tutorial web app, flutterflow tutorial indonesia, flutterflow tutorial in tamil, flutterflow tutorial authentication, flutterflow tutorial for begginers
Id: bTBvupiTkQM
Channel Id: undefined
Length: 27min 43sec (1663 seconds)
Published: Thu Nov 02 2023
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.