FlutterFlow & Agora: Build Video Calling Apps In 5 Minutes | No Code

I'm testing my latest video calling app with an avocado by throwing [Music] it and the reason it's working perfectly right now is hours and hours of debugging I had to suffer through so you don't have to with flood oflow aora and this video you can build a video calling app in 10 minutes my first video was about implementing a voice channel on flood the flow and people loved it I received so many requests for more advanced implementation of voice channels or video calling and getting them to production today we're going to create a video calling app just like Zoom or Google meet with no code in a record time for the purpose of this video I decided to create a really simple clone of Zoom meeting with a few authentication Pages homepage and a meeting page on this video we are only going to focus on the meeting page where we put the custom widget all right to begin we need to go to the code section and click on ADD and create a new widget this is the main widget of this video okay just copy the code and paste it over here and you can find the code for this widget on GitHub the link is in the description below we have to set the widget name just copy it from the code and paste it over on widget name and click on save this will automatically add the parameters as a last step on this page we need to add some pop spec dependencies the first one is Agora RTC engine we are going to use an older version of it because it works really easily on the web the version should be 5.3.0 and the next one is permission Handler for Android and iOS to ask for camera and microphone and don't forget to click save I'm guilty of forgetting it so many times now back to the meeting page this one can be any page on your app it we just need to add our newly created custom widget and give it the wids and height and then we need to fill in channel name app ID and token to do that we need to go to agora.io and over there uh you can create an account it's super simple after creating the account you will see something like this just click on create new project and this will add a new project on top of the other project now click on configure over here we're going to keep this stage as testing and give it a use case and if you scroll down a bit this part is really important first of all we need to enable primary certificate and then delete no certificate it's going to ask for the owner's email and delete next click on generate temp RTC token this will allow us to test the app really quickly on this page first of first of all copy app ID and just put it into flutter flow and then give it a channel name it could be whatever you want here we're going to just put test two and it's going to give us a token so copy the channel name and put it into flut flow and copy token and do the same okay we are done we don't have any errors we can publish it to the web uh we first need to enable it for web and then publish it and now publish while we wait for the deployment I wanted to share something with you guys after creating this channel I realized many flood oflow developers spent hours even days on problems that could be solved in a few minutes that's pretty normal in the development world but imagine if you could ask someone who has already been through those long hours so you could save yourself a lot of trouble that's why I launched a small patreon community I'll be spending time there to help out other flood flow developers with more technical stuff by joining the community I'll try to help you as much as possible and share exclusive content on flood oflow and share the projects we create on these videos I hope I can see you all over there back to throwing avocados as you can see it's deployed and working pretty well there are some considerations for production apps you'll need a cloud function to create the channels and the to to for each of the users it's not that hard but it's a bit different for different types of apps thank you so much for watching the video to the end don't forget to subscribe and dropping a like on the video see you on the next one [Music]

Channel: Ali Ideas

Views: 3,567

Keywords: flutterflow, flutter tutorial, flutter, app, ios, app development for beginners, mvp, tutorial, no code, low lode, how to use flutterflow, flutterflow app builder, flutterflow tutorial, video call app, Agora, flutter video chat

Id: qzCxIzeeznk

Length: 4min 53sec (293 seconds)

Published: Tue Apr 30 2024