Gemini AI in Flutterflow (NEW 2024 Method) AI Chatbot Included!

[Music] Hello friends and welcome back to another video tutorial in this video we will be implementing the new Gemini AI into our flutter flow apps all right so right here I have a very simple homepage with an app bar and a text view where the user will be able to input their prompt which they want to ask to Gemini Ai and I also have this button to submit their prompt to the Gemini Ai and I have this text which will contain the output of the AI all right so this is a very simple app in flooded flow and now we will be going to implement the Gemini AI into a flood Flow app this is the newest and improved method as FL FL has recently made some Integrations which makes our implementation of Gemini AI into our flood flow apps extremely extremely easy all right so let's just open a new tab and in the new tab you can search for termin AI API so just search for that I'll also be putting this link in the description below so you can go on this link I'll be putting it in the description below Yep this page then we can click on this to get the API key for our Gemini AI so you should be brought to this dashboard after you have signed in with your Google account and you can click on this get API key and we can create an API key you can just select this generative language clients as your Cloud project and then just create an API key in the existing project so just wait for the API key to load so now it's loaded we can just copy the API key and then we can go back to our flut Flow app now we can just go to our settings on this left hand side bar over here and we can scroll all the way down under Integrations we can see that there's this new Gemini over here so we can just enable Gemini and now we can just paste in our API key and now that is all that we have to do to integrate Gemini AI into our flutter flow apps and now we can start using the AI so now let's start adding some AI functions to our app so we can click on our button and inside the actions flow editor we can add a new action so now we can search for Gemini and we can try to generate some text from our prompt that we will that the user will get to ask the AI so as you can see under text prompt over here we can give it a value so we'll just give it the value of the widget State and we want to give it the value of the text field The Prompt or question that the user wants to ask the AI and will put inside the text field so you can just click on that and we can just give it an action output variable name of result all right so that's basically it we can close the action flow editor and now we can we want to show the result that the AI has given us so we can just go on this text and we will change the text to our action output and we want to change it to the result that the AI gives to us can just give a default variable of no results if there's no result given we can click on confirm and yes that's it it's that simple now to implement AI an AI chatboard into our flut flow apps so now we can try testing it out with our test mode and I will see you back when the test mode has loaded up all right so the test has just loaded up and now we can ask the AI something that we want to ask so let's just ask what is flut flow and we can ask it and now it's loading the AI is thinking of an answer and here we go see now we have an answer fow is a low Cloe platform that de enables developers to build blah blah blah blah blah so that's pretty cool now we have our own Ai and our own app within a matter of minutes so yeah that's really cool let's just ask another question who is the most famous person in the world oops let's ask the AI that Cristiano Ronaldo I'm pretty sure that's a mistake it should be me but whatever okay yeah so so that's basically it it's super simple to implement the Gemini AI into your flood flow apps right now because of the new integration that the flut flow team has put into their software so yep that's all for today's tutorial and I hope to see you in the next next video thank you and [Music] goodbye

Channel: just xolotl

Views: 3,022

Keywords: flutterflow ai chatbot, flutterflow, flutterflow tutorial, no code app, no code tutorial, gemini ai, google gemini ai, google gemini, gemini ai google, flutterflow gemini ai, flutterflow tutorial for beginners, flutterflow tutorial playlist, Gemini AI in Flutterflow (NEW 2024 Method) AI Chatbot Included!, no code, flutterflow app builder

Id: PceQ47r5ybY

Length: 5min 51sec (351 seconds)

Published: Sat Mar 09 2024