Flutter Get Request | Flutter get data from API | Flutter Get JSON Data | Flutter REST API

in the previous video we have created a system where we can send a feedback back to the API in this video I'll show you how you can import the feedback right so please make sure you have watched the tutorial where I where I shown how you can create AR API service and send some feedback back to the red API right so in order to fish feedbacks back we have to Simply copy the entire function and here instead of sending the feedback I'll call it fet feedbacks right now in order to F feedback for this tutorial we won't require any parameter so I can remove the following params and the URL will be changed the URL will be f/ all now please make sure you cross check your url back with the API or whatever your API is that is URL is uh for fetching data we won't require anybody for now so I can remove the body tag and here instead of a post function I can make it a get and eventually the get method won't require any parameter or any property of body if you H over it it will only require URL and headers right so after this what I'll do I'll remove entire thing we don't require this let's simply try to debug print the entire response so here if I try to debug print the entire response do two string let's try and in order to try it what we have to do we have to go back okay so now if I tap on F feedback I should be able to get all the response back yes we are getting all the response back now what we have to do in instead of showing the raw data that instead of showing this scatter data we have to create a model for that data right now I'll show you how you can create that what we have to do we have to Simply take the URL uh this is the URL of fing all the feedbacks copy that URL uh go to any of your browser and create a new tab and enter that URL you'll be getting all of this data now you have to copy all the data and you have to go to the website called quick tab. iio and this website will be helping us in converting the Json into a code that is types safe code code so tap on quick uh that is open Quick type and this is the previous one so if I tap it press enter entire code here and press enter you'll be getting bunch of data back all right so here you can name the following model I can name it a feedback model I will change entire thing here initially it can be a possibility that this thing might be in Swift or any other language so please make sure you convert that into a dart and thus you can copy entire code uh what I'll do in the models folder I'll create create a new model called feedback all feedback. model. and here I can paste everything now what we have to do we have to go back uh first of all we have to convert we have to take the decoded data that is encoded data so what I do I'll simply say final data should be equal to Json encode or Json decode response. body right if I over over it it will be showing me a type of dynamic but it is a type of this on and now what I can do I can do a feedback model I can create an instance of feedback model that we just created and here I can say feedback model of feedback model should be equal to feedback model from Json which is our data right so here I'll simply say this thing to be Jon data for now so this will make more sense and I can copy that and paste it here right now if I try to print my uh feedback model if I say uh feedback model dot you can see we'll be getting two things data and status for now let's try to print the status and let's see what we get so if I tap on it we should be getting a value of true because we are getting a response of true that is status of true now if I see uh data and if I tap on it you can see we'll be getting instance of all the dats right so instead of that what I'll do I'll go back and here in s of this to be data I'll simply say feedback model data now if I go back uh if I uh try to fetch all the feedbacks you'll be getting all the instes back one more time so here you can see uh we are getting all the responses back let's try to hard start everything cool so if I tap on feedback you can see we'll be getting a instance of feedback model data is now we are getting all the responses back so what I can do I can return a feedback model do data right so I can say this model is a type of feedback model data a list of feedback model data so let's say feedback model data right so this is how it will go now it will have a bunch of uh error exceptions but we won't see that here that will be for other tutorial where I will be creating a separate guide or how you can catch all the errors all the track blocks Etc and etc for now what really matters is if we are able to get our data back but before mov forward what I'll do I'll simply create a variable of status so I'll say a final Boolean status should be equal to feedback model do status now here I'll simply say if status if the status is true only at the time send the response else return null easy so for that purpose we have to make it things to be nullable right so now when this thing is done what we can do here we are uh this is a form so we don't require a form anymore so I'll hide everything I'll just comment it out and here I'll be creating a list view Builder so this list view Builder will be in a future so let's go back and create a future Builder easy now the future will be from the fetch feedbacks model so I'll say rest API service of phe feedbacks initial data will be nothing so I can remove it out and this thing will be rainning as a list to Builder right so now what I'll do I'll go back I'll simply say if uh snapshot has some data just return that else return let's say a size box for now if easy so uh this won't be a fancy UI but simply a small thing to you how to show you how it works so now what I'll do I'll simply say final feedback data model data or feedback model data should be equal to snapshot dot data you have to convert that as a list of feedback model data so let's say a list of feedback model data is equal to a list of feedback model data so it will be like this and here we have to create a new account so let's say if back model data of count and also here let's create a list style for the purpose of showing how it works so it will be having a title of text so what I'll do I'll create an instance of it so I'll simply say uh final feedback is equal to feedback model data of the index right so if I over it if I I can give it a type now we are just taking an index that index value from all the list and we are only getting the feedback so I can say feedback do feedback title just show it and here I can add a new Tex style of font size of medium so we can do it like this so what I have to do uh I have to H restart everything let's also remove this thing we don't require let's H restart everything okay so now you can see we are getting an error because this thing should be uh under shrink wrap so now you can see we are getting entire feedbacks back so let's make it a bold and I can copy the entire text paste it again I can make it subtitle and make it in a description and make it in a medium font right so this is how it will go you can also make it more variably so what I'll do I'll past it again I'll say a leading text so it will be not a text but a circle Ava so let's say a circle Ava and here I'll make it a child right and here I if I go you can see we can add a index of it and make it two string all right so here let's add a background color of this thing yeah this should be it I can make it a light thing yeah so now this is how you can fetch all the feedbacks from the RPI with the help of H package now I have shown you the most conventional way through which you can fetch all the data and show it to the user right in the future videos I'll show you how you can actually add some catch blocks cat the error show exceptions create some awesome UI Etc and Etc in the future project of mine which is called pulse in this project I'll be showing you everything that you require in order to create a social media application from scratch this application will be built with flutter and typescript and Hyper stack if you know about it so this project will be completely free I'll be creating this tutorial I will be creating tutorial for this project soon as possible till then you can keep an eye over this website this will be in the link of in the link in the bio and yeah so if you have loved this tutorial and if you have learned anything about how you can f data back and before ending this video please hit that like button on this video and also subscribe if you new to this channel I regularly post or Instagram if I show you my Instagram I regularly post over it so please make sure you also follow me over to Instagram I regularly post new content over every single day and if you find it amazing please hit that like button on this video as well see you in the next video bye-bye

Channel: Abhishvek

Views: 282

Keywords: flutter post method, flutter post request, how to make a post request in flutter, send post request flutter rest api, rest api post request flutter, post data flutter http, http post request flutter, flutter rest api post method, http post method in flutter, dio post method rest api flutter, rest api dio post method, create and send data flutter rest api, flutter post method in rest api 2020, send data to rest api flutter, flutter send data to rest api, http post flutter, http

Id: giYuBp_dc8M

Length: 9min 29sec (569 seconds)

Published: Thu Apr 25 2024