- 23
- 119 350
FlutterFlow VIP
Приєднався 26 тра 2022
1k at 15-02-2024
Login with Google Using Supabase in FlutterFlow App @FlutterFlow @Supabase
Support Channel By Joining Patreon and get Clone the Project and Access Exclusiv Contents
www.patreon.com/FlutterFlowVip
Clone Project - www.patreon.com/posts/login-with-using-95251342
Codes - flutterflow.vip/flutterflow-google-login-with-supabase/
Time Stamps -
- (00:00) Supabase Google Login Demo
- (00:10) Setting up Supabase Connection
- (02:25) Email Authentication Setup
- (04:00) Google Authentication Setup
In this video tutorial, we will learn how to set up Google Authentication with Supabase in a FlutterFlow app. The script covers various topics, including an introduction to the topic, setting up the Supabase connection, email authentication, Google authentication, and concluding remarks. The step-by-step instructions and demonstrations provided in the script will guide you on how to implement these features in your app.
We will start by exploring the Supabase project and the web app created in FlutterFlow. Then, we will demonstrate how to log in with Google and check if the user has been created in Supabase.
Next, we will dive into the process of setting up Google Authentication in your app. We will walk you through the steps of retrieving the Supabase URL and Anon Key, connecting FlutterFlow with Supabase, and setting up email authentication. We will show you how to create a login page, set up email authentication, and test the functionality by creating a new account.
After that, we will focus on setting up Google Authentication. We will guide you through the steps of enabling Google as an authentication provider in Supabase, obtaining the Client ID and Client Secret from Google Cloud Platform, and adding them to Supabase.
Once the Supabase setup is complete, we will show you how to integrate Google Authentication into your FlutterFlow project. We will create a custom action and demonstrate how to use it in the UI.
By the end of this tutorial, you will have a solid understanding of how to implement Google Authentication with Supabase in your FlutterFlow app. The provided script and demonstrations will help you navigate through each step of the process.
If you want to follow along with the code or clone the project, you can find all the necessary resources in the description. Make sure to like and subscribe to our channel for more helpful videos on FlutterFlow and custom code. If you have any questions, feel free to leave a comment, and we will be happy to assist you.
www.patreon.com/FlutterFlowVip
Clone Project - www.patreon.com/posts/login-with-using-95251342
Codes - flutterflow.vip/flutterflow-google-login-with-supabase/
Time Stamps -
- (00:00) Supabase Google Login Demo
- (00:10) Setting up Supabase Connection
- (02:25) Email Authentication Setup
- (04:00) Google Authentication Setup
In this video tutorial, we will learn how to set up Google Authentication with Supabase in a FlutterFlow app. The script covers various topics, including an introduction to the topic, setting up the Supabase connection, email authentication, Google authentication, and concluding remarks. The step-by-step instructions and demonstrations provided in the script will guide you on how to implement these features in your app.
We will start by exploring the Supabase project and the web app created in FlutterFlow. Then, we will demonstrate how to log in with Google and check if the user has been created in Supabase.
Next, we will dive into the process of setting up Google Authentication in your app. We will walk you through the steps of retrieving the Supabase URL and Anon Key, connecting FlutterFlow with Supabase, and setting up email authentication. We will show you how to create a login page, set up email authentication, and test the functionality by creating a new account.
After that, we will focus on setting up Google Authentication. We will guide you through the steps of enabling Google as an authentication provider in Supabase, obtaining the Client ID and Client Secret from Google Cloud Platform, and adding them to Supabase.
Once the Supabase setup is complete, we will show you how to integrate Google Authentication into your FlutterFlow project. We will create a custom action and demonstrate how to use it in the UI.
By the end of this tutorial, you will have a solid understanding of how to implement Google Authentication with Supabase in your FlutterFlow app. The provided script and demonstrations will help you navigate through each step of the process.
If you want to follow along with the code or clone the project, you can find all the necessary resources in the description. Make sure to like and subscribe to our channel for more helpful videos on FlutterFlow and custom code. If you have any questions, feel free to leave a comment, and we will be happy to assist you.
Переглядів: 6 209
Відео
FlutterFlow Reflect ( AI powered Journaling app ) web version demo #FlutterFlowImagine @flutterflow
Переглядів 485Рік тому
FlutterFlow Reflect ( AI powered Journaling app ) web version demo #FlutterFlowImagine @flutterflow
@OpenAI Whisper' Audio Trasnscription Integration Demo in @FlutterFlow #FlutterFlowImagine
Переглядів 897Рік тому
@OpenAI Whisper' Audio Trasnscription Integration Demo in @FlutterFlow #FlutterFlowImagine
Reflect App Trailer #FlutterFlowImagine @FlutterFlow
Переглядів 215Рік тому
Ai Powered Jounening app made in FlutterFlow
Reflect app Reimagined #flutterflow #FlutterFlowImagine @FlutterFlow
Переглядів 228Рік тому
App Created for FlutterFlow Reimagined
Sending Local Notifications in FlutterFlow - A Step-by-Step Tutorial @flutterflow
Переглядів 16 тис.Рік тому
Support Channel By Joining Patreon and get Clone the Project and Access Exclusiv Contents www.patreon.com/FlutterFlowVip Clone Project - www.patreon.com/posts/local-project-92688079 Codes - flutterflow.vip/setup-local-notification-in-flutterflow/ In this video tutorial, we will learn how to send notifications to users in an offline app using Flutter. If you're building an app with offline capab...
Send Push Notification using @Supabase and @onesignalofficial to @flutterdev or @FlutterFlow Apps
Переглядів 11 тис.Рік тому
Support Channel By Joining Patreon and get Access to Exclusic Content www.patreon.com/FlutterFlowVip Code - flutterflowvip.notion.site/OneSignal-Supabase-Integration-5121b124665341b2b7cfc9beaf05dc99?pvs=4 In this video, we will learn how to send notifications using Supabase and OneSignal with Edge Function on your FlutterFlow app or any app that uses OneSignal SDK. In the demo, we have a table ...
Send Push Notification Using Onesignal in FlutterFllow App @FlutterFlow @onesignalofficial
Переглядів 14 тис.Рік тому
Send Push Notification Using @onesignalofficial in @FlutterFlow App In this video, we will learn how to integrate OneSignal push notifications in FlutterFlow using custom code. We will go through the process of setting up a OneSignal account, creating a OneSignal app, uploading the Firebase service account JSON file, and obtaining the OneSignal app ID. Then, we will demonstrate how to add the n...
How to Populate Drop Down From API in FlutterFlow App @flutterflow
Переглядів 6 тис.Рік тому
In this video tutorial, we will learn how to populate a dropdown menu from an API in FlutterFlow. We will start by understanding how the dropdown widget works and how it requires a list of strings to populate the menu. Next, we will explore an API that contains a list of categories for a Shopping App. We will set up our project to retrieve a list of these categories using the PocketBase API. We...
Upload Media Files To any API and any backend in FlutterFlow @FlutterFlow
Переглядів 11 тис.Рік тому
In this FlutterFlow tutorial, we'll show you how to upload binary files using an API. Follow along with our step-by-step guide to learn how to upload any file to any backend that supports multiform data. We'll be using PocketBase for this demo, but you can apply the same principles to any backend that supports multiform data for file uploading. First, we'll set up the UI to allow the user to pr...
@FlutterFlow Detailed Introduction of Flutteflow 4.0 : FFDC 2023 : All Features Launched Explained
Переглядів 449Рік тому
In this video, we discuss the exciting new features that have been launched in FlutterFlow's FFDC 2023. From the ability to create and sell your own app templates in the marketplace, to automated testing and cloud functions, Flutterflow is making the development process smoother and more efficient. We also cover the new iPad app, perfect for developers who want to build amazing apps anywhere, a...
How to Change the Status Bar Color in a @FlutterFlow App: A Step-by-Step Guide . #flutterflow
Переглядів 3,2 тис.Рік тому
Blog Post URL - flutterflowvip.notion.site/How-to-Change-the-Status-Bar-Color-in-a-FlutterFlow-App-7bb8c591d1084717801c13781190193f In this tutorial, we will guide you through the process of changing the status bar color in a FlutterFlow app using custom code. We will show you each step of the process, including creating a new custom action, implementing the necessary code, and integrating the ...
Upload Media /Photos to @Supabase in @FlutterFlow app
Переглядів 12 тис.Рік тому
In this video, we will learn how to upload photos or media files to Supabase Storage in FlutterFlow. We will cover the steps to create a bucket, connect your Supabase instance to your FlutterFlow project, and upload media files. We will also show you how to access the uploaded images in your app. If you found this video helpful, please like and subscribe to our channel for more content!
SELFHOST @Supabase for @FlutterFlow with Custom Domain and SSL Certificate
Переглядів 9 тис.Рік тому
SELFHOST @Supabase for @FlutterFlow with Custom Domain and SSL Certificate
Self Host @FlutterFlow Webapp - Custom Domain - with Firebase Hosting
Переглядів 9 тис.Рік тому
Self host @FlutterFlow and @flutterdev Apps on Firebase hosting with custom Domain For Free
image Carasoul in @FlutterFlow using Pageview
Переглядів 4,4 тис.Рік тому
image Carasoul in @FlutterFlow using Pageview
How to Create Custom Navbar in FlutterFlow
Переглядів 6 тис.Рік тому
How to Create Custom Navbar in FlutterFlow
How to Hide the Status Bar in a FlutterFlow App: A Step-by-Step Guide . #flutterflow
Переглядів 3,1 тис.Рік тому
How to Hide the Status Bar in a FlutterFlow App: A Step-by-Step Guide . #flutterflow
Flutter Prerequisite || Flutter Learning Course 2023 #flutter #flutterdeveloper
Переглядів 47Рік тому
Flutter Prerequisite || Flutter Learning Course 2023 #flutter #flutterdeveloper
At around 1:40, noting that "Uploaded File" is no longer an option for the variable type. It looks like it was replaced with image path, but it fails in the action editor if you try to assign the image file to that variable type
im agreed
How to make app like ola ?
We'll try to make a video on this in future
hi is this also helpful if i only want to create an attach file and submit that kind of feature in my app
Yes you can use it however you like.
It must be a public bucket. because flutter flow will save image URL as below {url}/storage/v1/object/public/{bucket name}/{folder path} If you make your bucket private, you can access it to {url}/storage/v1/object/sign/{bucket name}/{folder path}
Thank you, brother.
What about json body? the API im using dont allow multipart
can you share the api definition. so I can guide properly
@@flutterflowvip Thanks! i already did it, convert the image bytes to base64 with custom code
Hello! All good? Thank you in advance for sharing your knowledge with us! Well, I have a screen for updating products and I need to delete and/or add new images in order to update the registration. How can I proceed? Thank you in advance for your attention.
your description is not clear. can you be little bit specific?
I can't get the code
we are working on it.
Uhhh, Thanks bro!
The more I research Supabase and Appwrite, the more it seems that Appwrite has an edge in terms of usability and command structure. Both are open-source, but I'm still undecided about which one to dive deeper into. While Appwrite lacks extensive tutorials, many of the available Supabase tutorials are outdated. Any ideas?
hello, is using google sign-in free (with supabase)?
yes its free
How can I send notify for other user??
For notifying other users you need to use push notifications instead of local notification
how can i send my problem to you?
You can comment here or mail me - manish@flutterflow.vip
Link not open
thanks for reporting i am working on it
@@flutterflowvip link not up :/
updated the link you can try now -- Thanks For reporting
updated the link you can try now -- Thanks For reporting
I've never seen any videos with OneSignal + iOS + Flutterflow.
does custom action for scheduled notification still work ?
No, you got??
@@am_cny nope =(
What initial conditions must be met for a user to receive a push message?
onesignal should be initialized
I paid two times in two months but still your project is not working. Either fix the project or refund (11 dollars).
sorry for the inconvenience it will be fix this sunday.
@@flutterflowvip You said this two months ago that it will be fixed by tonight but it has been almost two months now it has not been fixed.
@@flutterflowvipbrother your demo is great. But please provide 🙏🏻 code link for educational purposes 😢
It's available now.
@@flutterflowvipbro please do another video showing code, I request you that we are using for educational purposes only please
Thankyou very much, I was stuck with a 400 error because I was missing the policies.
does inbuilt razorpay settings work with this?
I haven't tested yet.
@@flutterflowvip I already tried later and it works.
Awesome
can you post a video to make it work with IOS
Sure soon
i followed your steps and did the all steps. push notification is receving well but i unable to store notification to read the users later ho to do it??
for that you have to store the notification in your database so you can list in the app
@@flutterflowvip can you please give full video how to do that . I mean full notification system
How to give different values to different items via api response
is this only for andriod ? i´m not able to run it on iOS
This method is only for Android. I haven't covered for ios yet.
@@flutterflowvip than you for your reply. I‘m working for a iOS Solution .. for Now it Looks good 😊
@@blnfreak hello, you found a solution for iOS?
@@samuelmartinez9327 yes, i‘ve a Solution - but it requires a Mac
Tried this for iOS on Flutterflow. The app did ask for push permissions but it did not register as successful on OneSignal's side (error: You have 1 total subscribed user for this app, but none specifically for the Google Android (FCM) platform.). I can see a user was added but I can't send anything to it. I think this might be happening because you are using Firebase Auth, while many Flutterflow users might be using custom auth.
In the tutorial I am not using firebase auth. and I didn't test on IOS .Yet I'll let you know after testing.
Thank you, this is very helpful! I was wondering if the same approach could be used to use Clevertap Flutter SDK instead of OneSignal. Have you tested that or could explore doing that as a small custom request?
I haven't tried clevertap but will try when I get time .
How to show notification daily on a specific time chosen by the user?
You have to modify the custom code . But I will try to cover this topic soon.
@@flutterflowvip I will be waiting for the video.
Do you have upwork account? I want hire you a service
sorry for the delay response. I do not work through upwork. You can directly contact me here . manish@flutterflow.vip Thanks
Hi, I need consultation.
sure you can contact me - manish@flutterflow.vip
@@flutterflowvip email sent :)
Hey man thanks for the video but I could not get to continue as the code you provided has expired in notion, it literarily saying I should ask you to update the link, i will appreciate it if you can update it soon 🙏🙏
Thanks for updating me, updated the expired url.
Anyone know how to create custom actions using onesignal? inside FlutterFlow? I want to do something similar to the video, but instead of sending from the OneSiganl website, the notification is sent when publishing a new product, and add this custom action to my publish button and give the variables the title, description and Product image.
Yeah I think I already have setup this think you can check other my video on onesignal
@@flutterflowvip Yes? I don't find other video where you speak this situation, I need create a custom action in FlutterFlow; I have the idea but never touch Dart or Flutter. i need you help please
m.ua-cam.com/video/DJaFai5hJn8/v-deo.html
I did not create an action . But directly using api. it's simpler but serves the purpose
@@flutterflowvip oh!, you use a supabase rather than Firebase for implement push notifications, FlutterFlow don't use "push" or "in-app" notifications true? with OneSignal, I should download my code and work in a code editor for implement this? and, my project can workwith Firebase and Supabase together?
Alguien sabe como crear acciones customizada usando onesignal? dentro de FlutterFlow? quiero hacer algo similar al video, pero en lugar de enviar desde la web de OneSiganl, se envie la notificación al publicar un nuevo producto, y agregar esta custom action a mi botón de publicar y entregarle a las variables el titulo, la descripción y la imagen del producto.
Brother please provide username and password to download the code
It will be available tomorrow
Do you know how to do it also with AppStore loging?
What do you mean. AppStore loging
@@flutterflowvip iOS logging sorry, with the Apple account
Great video! It seems the links you provided in description and comments are broken. I cannot open it.
Ohh . Thanks for reporting. I will fix it soon.
Thank you for a great video! Any suggestion how to upload the signature to Supabase?
Sure you can convert signature data to base64 string and use it to upload to supabase
If you want to teach us then explain slowly. 😢
Thanks for the feedback I ll try to explain little slow.
I can't open the code it needs authorization
Thanks for reporting I'll check.
@@flutterflowvipI face Auth too. Can I download code for free? Or do I have to have a pay subscription to get access to codes?
Hi Manish, how do I connect with you?
Hi pramod you can mail me here - manish@flutterflow.vip
Coooool, thanks a lot. It seems just send a push to receiver who already registered all subscriptions. If i wanna send specific subscriptions or groups, then how to do it? Can I get apns, fcm device token from Onesignal? and register subscription using that token??
For that you need to get users device onesignal I'd and and store it somewhere or change users External id with something like userid then u can send notification to specific user
Hey, the status bar color changed but the text and icons on status bar is not visible. maybe those text and icon colors are also white? how to handle this?
To change color of status bar text and icon you have to extend the code to use color for these.
Hi, do you have any idea how to solve CORS problems? I'm not reaaly sure why all of a sudden I can't upload anymore.
Where is the app hosted . on custom host or flutterflow?
Hello! The video is good, but is I don't need to create an account in the app, how should I perform auth. to the app. For example, I want to create the app for private company and the access to the app will only for the people, who are in the DB.
you can disable account creation . and add users manually.
or if everyone using organization email id . Then you can allow login or registration with specific domain .
you can follow any of these.
can you make one with discord login with supabase and get groups channel notifications
Sure I will try to make it soon.
@@flutterflowvip that’s would be great ! !
Really great video but why are you going so fast lol :D :P :)
can I use a godaddy hosting to deploy the website ?
I am not sure about GoDaddy hosting .
I did all of this and it worked great , how can i get the db-url like this : "postgres://postgres.<host>:<password>@aws-0-eu-central-1.pooler.supabase.com:5432/postgres"
this is great, thanks for the detailed and to the point video.... quick question, can we have supabase as backend service and still host to firebase hosting? And how much does it cost, please?
yes, you can use Firebase hosting for app hosting and supabase for database. and about the cost for Firebase hosting depends on the traffic on your site for basic usage it's free so you can start now for free.
@@flutterflowvip great man, thank you!! I have an app ready, will check it out. God bless!
why static list why can it be dynamic like you getting from backend
You can get dynamic list . It's just need a dynamic list.