Flutter Api Integration | Connect Flutter to MySql | XAMPP Server LocalHost | eCommerce App Tutorial

so before we proceed let me just show it to you one by one our phone which i simply means the flutter application okay which we are developing using dot programming language flutter dot programming language it is basically our this thing that is our flutter cloth sap project which we are developing and which we are testing on our mobile phone so basically this is our client application and then our api then come the api okay this api which we will implement which is inside the xampp folder htdocs this one api okay api cloud store this is our api so this is our api which we will implement then comes the server or you can say mysql database it is basically our this one xampp server xampp server mysql database and currently our database name is cloud sap database okay in which we have our first table users table so this is our mysql database so i hope now you understand it uh further in details what are the meaning of these three things now we will go step by step so first of all in this video what we will do we will uh establish a connection between our flutter application with the api okay that is we will make a connection between our flutter application and our api service so for that purpose we have to go to our flutter application so this is our clause flutter application in here what we need to do is for the connection right click on lib new and let's create a new folder or new directory and let's give this folder name as api underscore connection api connection just like this api connection so this is our api connection folder now inside the api connection folder that is right click on api connection folder new dot file and let's give it name as api underscore connection and press enter so inside the api connection we have our dot file which is api underscore connection dot dot file now inside this dot dot file we will make a connection to our api that is the connection the connection between our flutter application and our api service so for that purpose let's create a class let's give it name as api and we have to initialize the host and let's give it name as host connect or you can say host connection so inside this double quote we have to specify the uh url or you can say the host connection the link to our api so for that purpose first of all you have to type here http just like this colon slash slash double slash http colon double slash and then after the slash we have to provide our uh api ip address ipv4 address now how we can get that ipv4 address for that purpose you have to open up in your computer the command prompt okay so in the command prompt you have to just type ip config i p c o n f i g i p config just type this and press enter and it will show you this ipv4 address so in front of it this is the address so just select this address okay select this address and press ctrl c in order to copy it and then come back here and after this double slash you can simply paste that okay make sure to confirm it okay ipv4 address in my case it is this address so i just copy and paste that here now after that put slash just like this and then here we have to provide our api folder name where we have our api so you know that it is inside the c xampp htdocs and api folder name is this one basically in this folder we will implement our api service i have told you this uh also in the previous videos so let's just copy our api folder name which is this name and then after the slash we can simply pass that just like this so this is our host connection okay or you can simply say that uh connection to our api service which we can access using this whole host connect

Channel: Muhammad Ali's Coding Cafe

Views: 33,623

Keywords: flutter php backend, flutter rest api crud, best backend for flutter, flutter api, flutter with php and mysql, flutter laravel, flutter php, flutter php api, flutter php rest api, flutter php mysql, flutter mysql chat app, flutter mysql, rest api in flutter, rest api tutorial, rest api php, third party api, third party api integration in laravel, third party api integration in php, clothes app, flutter shopping app, flutter clothing app, final year project computer science

Id: PFIwMziDQqI

Length: 5min 14sec (314 seconds)

Published: Wed Sep 07 2022