Xano + FF 😍This is hands down my favorite stack! For those that don't know, Xano is a SCALABLE nocode backend (imagine if Airtable and Zapier had a baby that exceeded their parents expectations 😂). You can do incredible things when you pair these two tools together! Also, it looks like the FF team fixed API group headers! 🙌
@@PrinceSingh-z9v4i Firebase scales, but it doesn't work great for many types of applications like social apps, learning management systems, and more. Plus, you need to know how to code or use AI to write code to do any logic on the backend. Xano allows you to do it all visually (NoCode) and much quicker!
@@PrinceSingh-z9v4i Benefits of Xano and Firebase as Backend-as-a-Service platforms: Xano: 1. Allows for visual API creation with no code 2. Uses SQL instead of NoSQL (more people comfortable with SQL, and SQL allows for more complex queries) 3. Allows for more customizable API endpoints and complex back-end logic. 4. More scalable and faster than Firebase at lower cost over the long term Firebase: 1. Best for realtime DB updates and synching data across devises 2. Built-in support for strong user authentication 3. Best for quick prototyping and deployment of web apps and sites 4. Support for Cloud Functions triggered by events web hostingIn summary 5. An all-in-one no code app development / deployment solution from one vendor people trust (Google) Right @flutterflow?
@@PrinceSingh-z9v4i Benefits of Xano and Firebase as Backend-as-a-Service platforms: Xano: 1. Allows for visual API creation with no code 2. Uses SQL instead of NoSQL (more people comfortable with SQL, and SQL allows for more complex queries) 3. Allows for more customizable API endpoints and complex back-end logic. 4. More scalable and faster than Firebase at lower cost over the long term Firebase: 1. Best for realtime DB updates and synching data across devises 2. Built-in support for strong user authentication 3. Best for quick prototyping and deployment of web apps and sites 4. Support for Cloud Functions triggered by events web hostingIn summary 5. An all-in-one no code app development / deployment solution from one vendor people trust (Google) Right @flutterflow?
How would you suggest securely storing/accessing API keys so that bad actors can't get them? Such as the openai keys etc. I'd love to see a production ready tutorial with auth and security best practices for backend integration 🙏
Great Question. Toggle on the "Make Private" in the advanced settings. That will route the call through a cloud function so the header values are not exposed. Your API keys are typically set in the "Authentication: Bearer ${apiKeyOrTokenHere}" header, and by just toggling on "Make Private" in the API settings, you'll automatically get the benefit of securely routing via a Google Cloud Function.
@@FlutterFlowas long as the key is stored in the frontend (pesisted on the device and encrypted or not), the user can still see the API key exposed in the payload of the network request. You can try this yourself to verify. Storing your keys in the backend (as Firebase secrets, etc) is the way to go.
Thanks so much for the video! You could make a video teaching how to use the Progress Bar and its interaction with other pages of an App: This will help me a lot. Thank you!
How did you produce the token? Shouldn't tokens expire and be refreshed periodically? If so, hard-coding them into the headers doesn't make sense. Can you explain the approach please?
How can we add before action and after action while making any API request ? For example : Globally in all the API calls if API sends 401 (Unauthorized) status then it should redirect to some login page.
Is there a way to increase TimeOut in POST API calls in FlutterFlow? My call to OpenAI Assistant takes longer than 60 seconds because of the Code Interpreter taking a long time to generate a chart. I searched for the solution and even started chatting with your online support but have not found a solution yet.
Excellent video. I am using wordpress REST API to create new users on wordpress. I have created my customer route which is enabling me to insert the users with no issues. On the other hand, I would like to add the profile image and following the instructions in the video, i should select multipart rather than JSON ,, so how would you recommend doing it in one step if possible?
Is it possible to read the api url from a variable in order not for it to be static and allow me to change the server's location without having to rewrite the urls?
I’m encountering an issue with API integration in my FlutterFlow project. While the API responds correctly in Postman, it shows a 403 error and returns null in the response window when tested within FlutterFlow. Interestingly, the same API works perfectly on another FlutterFlow account on a different system, but the issue persists with my account, even after creating a new project. Could you please assist in identifying and resolving this issue?
Hey great! One question - how do I connect 2 API's endpoints? For example, I have API for posts and API for comments. How do you connect/binding the post ID to the specific comments list?? @flutterflow?
Forget about connecting the APIs, one sec. I suppose that u have in your database each Comments : a PostID as a reference to each of your posts. So In your PostDetailPage, create a global variable for that PostID (or maybe u already have it in a paramater). Then you make 2 api call : first your specific Post (not the all post endpoint) and second, his Comments, by the same postID variable.😊 I think it make sense, right ??
Thank you for the help, I try to understand what is mean not all the post endpoint, because I have a list with all the post the pass parameters with PostID, in the PostDetailPage I add Backend quary for Comments (that come from different API call) and get Null because I didn't create children and all the variables get Custom JSON path@@growthmania17
This is great. What about Firebase, please if a tutorial can be done on how to connect social media APIs to a FlutterFlow app (example; TikTok, Instagram, Facebook, RUclips... etc) 🙏🙏🙏
When I follow the directions exactly, the first call to generate children works fine. But the next call (to the body instead of to a path) generates a "NoSuchMethodError:'toList" error.
if any one can help me with this. i have been stock here with some issues. i have a timer widget and the timer widget begins when a button is clicked...but the problem i am facing now is, when i navigate to another page that the timer widget is not found, the timer stops and that is what i don't want. how can i resolve this problem?.. A guide or a hint will be a big time relief. Thanks for your understanding
Looks like there might be a bug, its first when you have multiple items in a list, that FF understands its a list, even though the json has one object inside the list.
hah what are the odd. one thing you picked up for an example is the widget which comes with an widget state property. How about using iimage widget which does not come with an wideget state
the quality of this tutorial is outstanding!
Flutterflow + Xano = Seriously Match Made In Heaven😍 Please continue to create more videos on Xano integration🙌
Please make figma extension, you will make development not just 10x faster, but 50x faster
them need more money for this
@@caney33 Bravo Studio do it already. FlutterFlow seems to be levels ahead.
Xano + FF 😍This is hands down my favorite stack! For those that don't know, Xano is a SCALABLE nocode backend (imagine if Airtable and Zapier had a baby that exceeded their parents expectations 😂). You can do incredible things when you pair these two tools together!
Also, it looks like the FF team fixed API group headers! 🙌
what the problem with firebase, its not scalable? I'm new
@@PrinceSingh-z9v4i Firebase scales, but it doesn't work great for many types of applications like social apps, learning management systems, and more. Plus, you need to know how to code or use AI to write code to do any logic on the backend. Xano allows you to do it all visually (NoCode) and much quicker!
@@PrinceSingh-z9v4i
Benefits of Xano and Firebase as Backend-as-a-Service platforms:
Xano:
1. Allows for visual API creation with no code
2. Uses SQL instead of NoSQL (more people comfortable with SQL, and SQL allows for more complex queries)
3. Allows for more customizable API endpoints and complex back-end logic.
4. More scalable and faster than Firebase at lower cost over the long term
Firebase:
1. Best for realtime DB updates and synching data across devises
2. Built-in support for strong user authentication
3. Best for quick prototyping and deployment of web apps and sites
4. Support for Cloud Functions triggered by events web hostingIn summary
5. An all-in-one no code app development / deployment solution from one vendor people trust (Google)
Right @flutterflow?
@@PrinceSingh-z9v4i
Benefits of Xano and Firebase as Backend-as-a-Service platforms:
Xano:
1. Allows for visual API creation with no code
2. Uses SQL instead of NoSQL (more people comfortable with SQL, and SQL allows for more complex queries)
3. Allows for more customizable API endpoints and complex back-end logic.
4. More scalable and faster than Firebase at lower cost over the long term
Firebase:
1. Best for realtime DB updates and synching data across devises
2. Built-in support for strong user authentication
3. Best for quick prototyping and deployment of web apps and sites
4. Support for Cloud Functions triggered by events web hostingIn summary
5. An all-in-one no code app development / deployment solution from one vendor people trust (Google)
Right @flutterflow?
BROOO!! u are the best teacher FF !!!! make more videos !!! I like u voice and your way of teaching! thx a lot!! slowly and claire
I now love to setup API calls.
I have just found FF and this is what I thought Webflow would become. FF is awesome.
How would you suggest securely storing/accessing API keys so that bad actors can't get them? Such as the openai keys etc. I'd love to see a production ready tutorial with auth and security best practices for backend integration 🙏
Great Question.
Toggle on the "Make Private" in the advanced settings. That will route the call through a cloud function so the header values are not exposed. Your API keys are typically set in the "Authentication: Bearer ${apiKeyOrTokenHere}" header, and by just toggling on "Make Private" in the API settings, you'll automatically get the benefit of securely routing via a Google Cloud Function.
Thanks @@FlutterFlow team, that's great! So this would only work with a Firebase cloud function setup?
@@FlutterFlowas long as the key is stored in the frontend (pesisted on the device and encrypted or not), the user can still see the API key exposed in the payload of the network request. You can try this yourself to verify. Storing your keys in the backend (as Firebase secrets, etc) is the way to go.
@@FlutterDev1337 correct. updated.
Thanks so much for the video! You could make a video teaching how to use the Progress Bar and its interaction with other pages of an App: This will help me a lot. Thank you!
How did you produce the token? Shouldn't tokens expire and be refreshed periodically? If so, hard-coding them into the headers doesn't make sense. Can you explain the approach please?
nice video but i have a problem using the second way to bind to body pls can someone help
How can we add before action and after action while making any API request ? For example : Globally in all the API calls if API sends 401 (Unauthorized) status then it should redirect to some login page.
I am wondering the same @FlutterFlow
Is there a way to increase TimeOut in POST API calls in FlutterFlow? My call to OpenAI Assistant takes longer than 60 seconds because of the Code Interpreter taking a long time to generate a chart. I searched for the solution and even started chatting with your online support but have not found a solution yet.
Thanks. Please make more tutorials on API. Integration with to OpenAI, Google/MSFT/Amazon APIs, etc.
Excellent video. I am using wordpress REST API to create new users on wordpress. I have created my customer route which is enabling me to insert the users with no issues. On the other hand, I would like to add the profile image and following the instructions in the video, i should select multipart rather than JSON ,, so how would you recommend doing it in one step if possible?
how to get image path to show image of base 64 string images through api call
I have tried the team Api but when i pass my access_token in header as a group variable it doesn't work
in the group API how can I make it dynamic?
Help, my pictures are actually a child in a Component, I cant really figure out how to pass the imgUrl from my json into that.
thank you so much. this video helps me alot
Please create a small series of fluttterflow with Firebase of Tutorial.
Amazing videos.Can you please make a video with live streaming api call from owncast?
Hi, i got xml response and not json response. How can i do please ?
Is it possible to read the api url from a variable in order not for it to be static and allow me to change the server's location without having to rewrite the urls?
Please make a video about "how to crop an image in specific ratio and store it to firestore" finding the solution from long time!
Thanks. How to generate swagger api definition from SUPABASE to load in FlutterFlow?
I’m encountering an issue with API integration in my FlutterFlow project. While the API responds correctly in Postman, it shows a 403 error and returns null in the response window when tested within FlutterFlow.
Interestingly, the same API works perfectly on another FlutterFlow account on a different system, but the issue persists with my account, even after creating a new project.
Could you please assist in identifying and resolving this issue?
Hey great! One question - how do I connect 2 API's endpoints? For example, I have API for posts and API for comments. How do you connect/binding the post ID to the specific comments list?? @flutterflow?
Forget about connecting the APIs, one sec. I suppose that u have in your database each Comments : a PostID as a reference to each of your posts.
So In your PostDetailPage, create a global variable for that PostID (or maybe u already have it in a paramater). Then you make 2 api call : first your specific Post (not the all post endpoint) and second, his Comments, by the same postID variable.😊 I think it make sense, right ??
Thank you for the help, I try to understand what is mean not all the post endpoint, because I have a list with all the post the pass parameters with PostID, in the PostDetailPage I add Backend quary for Comments (that come from different API call) and get Null because I didn't create children and all the variables get Custom JSON path@@growthmania17
Excellent explanation
HOW TO RECEIVE RESPONCE FROM THE API. EXample when I send payment request then I want to capture the responce from the Api , something like a webhook
where you save your apis?
Hi. Great stuff ! Is it possible to import a Postman collection as well ?
Yes, but you have to convert it first. You can use this: kevinswiber.github.io/postman2openapi/
@@FlutterFlow beautiful ! Thanks !
Hi guys i would like to know how to display multiple images from an api call in flutterflow
This is great. What about Firebase, please if a tutorial can be done on how to connect social media APIs to a FlutterFlow app (example; TikTok, Instagram, Facebook, RUclips... etc)
🙏🙏🙏
agreed this is sorely needed
That's outstanding!
guys, is it possible to import figma files? The whole design and everything
When I follow the directions exactly, the first call to generate children works fine. But the next call (to the body instead of to a path) generates a "NoSuchMethodError:'toList" error.
Yes for me too. How to resolve it???
Found the error. Try to parse the JSON according to your JSON body. It works perfectly fine for my now.
How to handle errors api ?
if any one can help me with this. i have been stock here with some issues. i have a timer widget and the timer widget begins when a button is clicked...but the problem i am facing now is, when i navigate to another page that the timer widget is not found, the timer stops and that is what i don't want. how can i resolve this problem?..
A guide or a hint will be a big time relief.
Thanks for your understanding
use original flutter dont use flutter flow thats the solution
Looks like there might be a bug, its first when you have multiple items in a list, that FF understands its a list, even though the json has one object inside the list.
How download image?
hah what are the odd. one thing you picked up for an example is the widget which comes with an widget state property. How about using iimage widget which does not come with an wideget state
API with authentication @17:04
I wished I understand 😭😭😭😭😭 I really need a beginner crash course on flutterflow, someone please help me out 🙏🙏
This video is part of a series that's an intro to FlutterFlow course. You can find it here: ruclips.net/p/PLsUp7t2vRqx-xMe6gucpfjeDgIj0tJRIm
documentation is better. I also recommend talking with llms like google gemini and chatgpt because you can ask basic questions
what idea does Flutter have?
Bro I found this voice over is exactly the same voice with the guy from Javascript Mastery channel :D
this tutorial doesn't work...
no such method error : 'tolist' dynamic call of null.
great videos, but i just got to say though, the vocal fry is very distracting and isn't necessary. but thanks for the videos :)