Flutter ChatGPT Chat App Tutorial | Build Open AI Powered Chat App In Flutter

Рет қаралды 21,029

9 ай бұрын

💼 Book a meeting: cutt.ly/Pegxp5rA
💎 Ultimate Flutter UI Kit: cutt.ly/3w6tqwFA
In this video, I am going to show you a easy way to implement OpenAI ChatGPT LLM model within your Flutter application. We will take a look at setting using the OpenAI API within our Flutter application using the chat_gpt_sdk. We will implement a Chat UI within Flutter which will help us communicate with ChatGPT GPT3.5 Turbo model. This guide will help you set up and navigate through the process of adding AI LLM Chatbot functionality to your Flutter app. This is an excellent guide for beginner Flutter developers.
Resources:
Source Code: cutt.ly/dwQwXtCF
ChatGPT SDK: pub.dev/packages/chat_gpt_sdk
Dash Chat: pub.dev/packages/dash_chat_2
Socials:
Website: hussainmustafa.com
Github: github.com/hussain-mustafa990
LinkedIn: www.linkedin.com/in/hussain-mustafa-960920184/
Twitter: Hussain34274892
Buy Me A Coffee: www.buymeacoffee.com/hussainmustafa
#flutter #openai #chatgpt #chatgptmobileapp #openaichat

Пікірлер: 195

@m_hussain_mustafa 9 ай бұрын

I've gone ahead and fixed the error regarding List? in the source code, and updated it. Feel free to download the source code and it'll have the appropriate changes in it. Download source code: cutt.ly/dwQwXtCF

@ronyhassanroman 9 ай бұрын

As always you are the best. I watched your every videos. And they are Very helpful

@m_hussain_mustafa 9 ай бұрын

Glad you like them!

@basit_ali 8 ай бұрын

Mind blowing. Simple and to the point

@m_hussain_mustafa 8 ай бұрын

Thanks for your support.

@moneyman-ne9lw 9 ай бұрын

Thanks for this awesome tutorial. Keep at it they are great. :)

@m_hussain_mustafa 9 ай бұрын

Thanks for your support.

@bestpractice_english 9 ай бұрын

Thank you for posting such valuable content. Post more content related to AI. 😀

@m_hussain_mustafa 9 ай бұрын

Thanks 🙏

@RonyHassan47 9 ай бұрын

Thanks a lot. I watched many videos on this topic. But your one is very easy and effective.

@m_hussain_mustafa 9 ай бұрын

Thank you. So nice of you.

@Anna-zd1dc 13 күн бұрын

Is it working?

@MHM-jy4uj 9 ай бұрын

Amazing video like always. Keep up the good work.

@m_hussain_mustafa 9 ай бұрын

Thanks, will do!

@KAIZENTECHNOLOGIES 6 ай бұрын

It would be cool if you made a similar tutorial but for using the assistants api. Great video!

@m_hussain_mustafa 6 ай бұрын

Hi, Thanks for your suggestion, I’ll try your create one using assistants api.

@jemmytech5474 4 ай бұрын

getting this error "The argument type 'List' can't be assigned to the parameter type 'List" List _messagesHistory = _messages.reversed.map((m) { if (m.user == _currentUser) { return {'role': 'user', 'content': m.text}; } else { return {'role': 'assistant', 'content': m.text}; } }).toList();

@mortezaehsani8943 3 ай бұрын

getting the same error....could you fix it?

@jemmytech5474 3 ай бұрын

@@mortezaehsani8943 yep

@m_hussain_mustafa 2 ай бұрын

I've fixed the error, you can download the new source code with link in description or pinned comment.

@rajibtalukder6678 8 ай бұрын

It was very helpful... Well wishes for you..

@m_hussain_mustafa 8 ай бұрын

Glad it was helpful!

@safabeauty8910 2 күн бұрын

Thank you!

@m_hussain_mustafa 2 күн бұрын

You're welcome 😊

@newjx 8 ай бұрын

can it work wit ht new openai assistant and code interpreter?

@ggre55 Ай бұрын

Very usefull tnks ❤❤

@m_hussain_mustafa Ай бұрын

You're welcome 😊

@PaintingHub7 Ай бұрын

@@m_hussain_mustafa please help me mujhy sirf chatgpt is typing show horaha

@PaintingHub7 Ай бұрын

Meny video bhi pori Dekhi kuch missing nahi hy

@codewithprajith 5 ай бұрын

You are really great man !. I saw lots of tutorials to create an ChatGPT clone. But this is the only tutorial where I didn't get any errors and all. Can we able to make the model to answer only to a particular questions?

@m_hussain_mustafa 5 ай бұрын

Hi, Thanks for the comment. You should take a look at training a custom gpt on OpenAI and then accessing that through the API for your use case.

@None-vj7vu 17 күн бұрын

Thanks a lot bro. I wanted to ask you can you make a video about connecting a flutter app to Chat GPT4 with sending a photo with text to AI. like your video with Gemini

@m_hussain_mustafa 17 күн бұрын

Will try

@None-vj7vu 16 күн бұрын

@@m_hussain_mustafa Thanks bro I appriciate it

@julianguerrero6842 Ай бұрын

I have this error, thanks for helping me

@julianguerrero6842 Ай бұрын

E/flutter (17516): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: status code :404 message :{message: null, code: null, type: null}

@julianguerrero6842 Ай бұрын

start debugging app in the phone, but...

@ababacarcisse7969 5 ай бұрын

Merci beaucoup

@m_hussain_mustafa 5 ай бұрын

You’re welcome.

@ayotunde.4034 2 ай бұрын

The argument type 'List' can't be assigned to the parameter type 'List'. I keep getting this error when I try to add the _messageHistory List under the ChatCompleteText() function. Pls how can I fix this

@m_hussain_mustafa 2 ай бұрын

I've fixed the error, you can download the new source code with link in description or pinned comment.

@SK-on4lq Ай бұрын

i am not getting the reply , its only showing chatgpt is typing

@PaintingHub7 Ай бұрын

You are right mujhy bhi sirf yahi show horaha result nahi arah

@puffertech6779 2 ай бұрын

getting this error "The argument type 'List' can't be assigned to the parameter type 'List" kindly solve it asap 🙂

@m_hussain_mustafa 2 ай бұрын

I've fixed the error, you can download the new source code with link in description or pinned comment.

@user-sk3qp9dv9r 3 ай бұрын

Error on mesages:_messagehistory...it says "the argument type list(messages) can't be assigned to list(map(string,dynamic))...

@mortezaehsani8943 3 ай бұрын

I've the same error. Could you fix it?

@m_hussain_mustafa 2 ай бұрын

I've fixed the error, you can download the new source code with link in description or pinned comment.

@JimPaoloCinco-iy4zv8kf3o 25 күн бұрын

Sir good day thanks for this tutorial. However, mine doesn't work because it says the model is not available "The model `gpt-3.5-turbo-0301` has been deprecated" do you know some available model on this time sir?

@m_hussain_mustafa 23 күн бұрын

Hi, i'd recommend taking a look at the docs for the package and seeing what other models are avalible.

@JohnCena-vj6tn 6 ай бұрын

Where can I change the text box and text color for that textfield where it says write a message, and how can I change it?

@m_hussain_mustafa 6 ай бұрын

You can take a look at the documentation here: docs.flutter.dev/cookbook/forms/text-input

@Showfootball567 2 ай бұрын

Prerequisites for this

@m_hussain_mustafa 2 ай бұрын

I believe just the basics of Flutter.

@MrIMacro 6 ай бұрын

Amazing Hussain, could you please make a tutorial on how to merge a flutter app inside another flutter app?

@m_hussain_mustafa 6 ай бұрын

Hi, I am a bit confused by your request. What does merge one Flutter app inside another mean?

@MrIMacro 6 ай бұрын

@@m_hussain_mustafa i have a large app and another small compass app. I want to insert the compass app within the large app, so the large app has a button to open the smaller compass app. I tried to do it manually but my vscode project will have two main.dart files which is something wrong.

@ahmetcicek4696 4 ай бұрын

I have this error: The argument type 'List' can't be assigned to the parameter type 'List'.

@m_hussain_mustafa 4 ай бұрын

Hi, Since many people have been getting this error, allow me to take a look at this and I'll post a pinned comment to this video with the fix and also updated the source code I've provided.

@ahmetcicek4696 4 ай бұрын

@@m_hussain_mustafa I used " chat_gpt_sdk: ^2.2.5 " and it worked but gpt api quota was exceeded

@jemmytech5474 4 ай бұрын

@@m_hussain_mustafa same issue, when will you pinned it?

@user-ej7ei9mn6f 2 ай бұрын

Hello! Could you tell me please whether there are any methods to save chat messages of different users in Firebase for example?

@m_hussain_mustafa 2 ай бұрын

Hi, I'd refer you to watch my Firebase Firestore tutorial or Firebase Chat app course video on my channel to learn more about this topic.

@Steveshp1 7 ай бұрын

Thanks for good contents. I have a question, How to increace font size in dash chart 2 of this App?

@m_hussain_mustafa 7 ай бұрын

Hi, I'd recommend taking a look at the dash chat package documentation on pub.dev.

@sandeepreddy862 5 ай бұрын

hello sir ,i am facing an issue when i give the input from user there is no response from the GPT can u plse help me out

@m_hussain_mustafa 5 ай бұрын

Hi, I believe yo have reached the limit of the free API use and might need to upgrade to a paid plan now.

@sandeepreddy862 5 ай бұрын

@@m_hussain_mustafa bro but I used the API key for the 1st time how come it expired ?? I copied the code and pasted it in my code even though there is no response

@gustavofonseca7744 4 ай бұрын

@@sandeepreddy862 The same thing happened to me. I have never used this API, I created it now and put it in the code to test, and the chat does not generate a response.

@gustavofonseca7744 4 ай бұрын

@@sandeepreddy862 Hello my friend, I created a new account on gpt chat and created a new api, and it worked. You can also create a new account.

@techysparta9227 3 ай бұрын

@@sandeepreddy862same issue

@yendri9899 6 ай бұрын

sir, why i dont get any response from chatgpt ,iam not yet reach the limit, trying to debugging and this show [OpenAI] request body :{model: gpt-3.5-turbo-0301, messages: [{role: user, content: hi}], temperature: 0.3, top_p: 1.0, n: 1, stream: false, max_tokens: 100, presence_penalty: 0.0, frequency_penalty: 0.0, user: } DioException [bad response]: The request returned an invalid status code of 429. sorry iam newbie

@m_hussain_mustafa 6 ай бұрын

What is error 429?

@yendri9899 6 ай бұрын

@@m_hussain_mustafa solved, change api_key using a different open ai account, weird, even though my first account has never used the api even on the page it also says it's still empty, btw thanks for the video and replay, have a nice day sir

@dhianprameswari3524 8 күн бұрын

can i use this but iwth gemini ai key instead ?

@m_hussain_mustafa 7 күн бұрын

I already have another tutorial on my channel on Gemini API check that out.

@Fazz-mt8lr 7 ай бұрын

Kindly guide me i have stong concept in c++ so what should i learn now for backend for flutter smooth apps?

@m_hussain_mustafa 7 ай бұрын

Hi, Almost all backend solutions have there pros and cons you need to do proper research and determine which is the best backend solution for your project. Some good recommendations are Firebase, Supabase, AppWrite or Strapi.

@Rahaf518. 4 ай бұрын

I got an error like this argument type 'List' can't be assigned to the parameter type 'List

@user-ow9zj9by4o 4 ай бұрын

Code ? Error it self says you are assigning value to wrong variable ( type is different)

@m_hussain_mustafa 4 ай бұрын

Hi, Since many people have been getting this error, allow me to take a look at this and I'll post a pinned comment to this video with the fix and also updated the source code I've provided.

@mortezaehsani8943 3 ай бұрын

@@m_hussain_mustafa Hi Mustafa! Impatiently waiting for the solution. Thanks a million!

@m_hussain_mustafa 2 ай бұрын

I've fixed the error, you can download the new source code with link in description or pinned comment.

@jemmytech5474 4 ай бұрын

is it possible to give custom string for typing user, like i want to say, Jemmy is typing?

@m_hussain_mustafa 4 ай бұрын

Hi, Yes this is possible taking a look at the typing users property on dash chat.

@abhijitpatil9697 4 ай бұрын

you guys if anyone is having error with the List, _messages just chagne the chat gpt sdk version to the version used in the vid it will solve it but the 429 message will still be there i don't know why it is there

@m_hussain_mustafa 4 ай бұрын

Thank you for helping others out. Appreciate it.

@amineatyq3643 4 ай бұрын

Did you solve the issue? I have the same issue.

@ericaember8571 4 ай бұрын

getting this error "The argument type 'List' can't be assigned to the parameter type 'List"

@ahmetcicek4696 4 ай бұрын

Do you solve the error ?

@ericaember8571 4 ай бұрын

no i gave up on the project@@ahmetcicek4696

@m_hussain_mustafa 4 ай бұрын

Hi, Since many people have been getting this error, allow me to take a look at this and I'll post a pinned comment to this video with the fix and also updated the source code I've provided.

@NaoyaMizukani 3 ай бұрын

@@m_hussain_mustafaterribly sorry, i have the same question with this case and i wanna know which part should i fix to get this problem solve. it's kinda hard to understand if i just download your source code and compare which part is the problem

@m_hussain_mustafa 2 ай бұрын

I've fixed the error, you can download the new source code with link in description or pinned comment.

@not_justdesign 6 ай бұрын

yoo guy, i trid to install your code and use it and bam i think i have spoilt my env, like i keep getting "Waiting for another flutter command to release the startup lock" i need help abeg(pleas )

@m_hussain_mustafa 6 ай бұрын

Although there are many fixes to this issue. The easiest one that I recommend is to restart your computer.

@ababacarcisse7969 5 ай бұрын

Thank, very good tuto .hello how to add role system in this chat app

@m_hussain_mustafa 5 ай бұрын

Hi, I believe the best option is to take a look at the documentation for the api.

@mansipatel2220 8 ай бұрын

according to you which is the best and most affordable Tech stack that we should use, and also what all languages should we learn in order to be great at job interview and become a nice flutter developer and get a nice paying job,

@m_hussain_mustafa 8 ай бұрын

The advice totally depends on your career goals. If you want to a career as a Flutter developer then you'd certainly want to become proficient in Dart. Moreover learn Flutter development, and also understand a little bit about native iOS and Android development.

@user-qc4bv2dt3b 2 ай бұрын

can i make a chat gpt assistant that is designed for students and don't answer anything unrelated to school curriculum

@m_hussain_mustafa 2 ай бұрын

Yes, this should be possible but isn't very straightforward. You'll have to research into training your own GPT.

@user-qc4bv2dt3b 2 ай бұрын

@@m_hussain_mustafa can u pls make a tutorial

@m_hussain_mustafa 2 ай бұрын

@@user-qc4bv2dt3b It’s much more complicated than what I can cover in a single tutorial.

@HaroutHarryTutunjian 2 ай бұрын

hello im having trouble in integrating the ai in my flutter project can you assist me please?

@m_hussain_mustafa 2 ай бұрын

What issue are you facing?

@mugdadelneama7389 5 ай бұрын

I keep getting this error The argument type 'List' can't be assigned to the parameter type 'List'. massages property seems that it's only accepts List of maps, any solutions?

@m_hussain_mustafa 5 ай бұрын

Hi, I’d recommend taking a look at source code I’ve provided link is in the description. This is a type mismatch error.

@brent. 4 ай бұрын

When i copy the source code I still have the exact same and only error :((((@@m_hussain_mustafa

@m_hussain_mustafa 2 ай бұрын

I've fixed the error, you can download the new source code with link in description or pinned comment.

@user-mq8ib9ti4u 3 ай бұрын

Getting this error in the final request section: Can anyone help me? final request = ChatCompleteText( model: GptTurbo0301ChatModel(), messages: _messagesHistory, maxToken: 200, ); The argument type 'List' can't be assigned to the parameter type 'List'. dartargument_type_not_assignable List _messagesHistory

@m_hussain_mustafa 2 ай бұрын

I've fixed the error, you can download the new source code with link in description or pinned comment.

@user-mq8ib9ti4u 2 ай бұрын

@@m_hussain_mustafa thank you

@rafaymushtaq2316 9 ай бұрын

Sir can you please make a video on Arcore flutter plugin? It gives an error. I tried many things but I am unsuccessful. Please it's my humble request make a video of it.

@m_hussain_mustafa 9 ай бұрын

I have never worked with this plugin, but I'll take a look at it and try to make a tutorial on it.

@user-sk3qp9dv9r 3 ай бұрын

Do i have to verify mobile number....it says you currently don't have any Api keys,verify your phone number to create an api key...do i have enter my phone number for that? Pls reply its urgent

@m_hussain_mustafa 3 ай бұрын

Hi, If it says that then you have to I guess.

@kenilchandrani9805 5 ай бұрын

i am getting error like this he argument type 'List' can't be assigned to the parameter type 'List

@m_hussain_mustafa 5 ай бұрын

Hi, I'd recommend taking a look at the source code I've provided link to in the description this is a type mismatch error.

@mutken 4 ай бұрын

@@m_hussain_mustafaEven in your code it shows the same error

@Showfootball567 2 ай бұрын

How to run this app on our mobile and use it regularly and download it and show to others

@m_hussain_mustafa 2 ай бұрын

Hi, you'll have to publish the app on the Google Play or iOS app store.

@Showfootball567 2 ай бұрын

Could you please make a video about it

@Showfootball567 2 ай бұрын

@@m_hussain_mustafaplease make a video on how to publish this app on play store

@mansipatel2220 8 ай бұрын

can we use getx state management for this?

@m_hussain_mustafa 8 ай бұрын

Yes absolutely.

@39_fiklialfaiqgyonanda26 8 ай бұрын

How to change Text "Write a message..." and change color?

@m_hussain_mustafa 8 ай бұрын

It should be fairly simple. Just change the hintText and hintTextStyle attributes for the textfield.

@muhammadaqsam8523 10 күн бұрын

I have not recieve any response from gpt and my debug console look like this : Error 429 - You exceeded your current quota, please check your plan and billing details

@m_hussain_mustafa 10 күн бұрын

The error says you've reached your free quota limit for ChatGPT API, you have to enable billing and subscribe to a plan to proceed further.

@shaikshaheera5569 8 күн бұрын

@@m_hussain_mustafa don't we have any free models??

@freddykrugger5332 3 ай бұрын

Can we use this in production?? I mean with a valid api key?

@m_hussain_mustafa 3 ай бұрын

Yes I believe so, but the app might still require a bit more polishing.

@justlike333 8 ай бұрын

when iam request to chat gpt gpt give me a ans of some quest like hii , what is your name , who is owner of google ets but i am send other req like what is flutter and other question gpt not reply anything . how can i fix this issue and my limit free tpken limit is not crossed

@m_hussain_mustafa 8 ай бұрын

You'll have to use the GPT v4 for this type of functionality and this is a more advanced use case that will require research on your part.

@nandiniarora3932 8 ай бұрын

Error code: 429, message :The request returned an invalid status code of 429. data:{error: {message: You exceeded your current quota, please check your plan and billing details., type: insufficient_quota, param: null, code: insufficient_quota}} I am getting this error .How to resolve it.

@m_hussain_mustafa 8 ай бұрын

You need to upgrade your billing plan to a paid plan. You’ve reached limit of free tier usage.

@Spongeboimibob 6 ай бұрын

hello i keep getting this error for _messagehistory. The argument type 'List' can't be assigned to the parameter type 'List'.dartargument_type_not_assignable

@m_hussain_mustafa 6 ай бұрын

This is a type mismatch error. I’d have to take a look at your code to deduce the changes required to get it working.

@m_hussain_mustafa 6 ай бұрын

An easy way you be to change the List to just List.

@Spongeboimibob 6 ай бұрын

List _messagesHistory = _messages.reversed.map((m) { if (m.user == _currentUser) { return Messages(role: Role.user, content: m.text); } else { return Messages(role: Role.assistant, content: m.text); } }).toList(); final request = ChatCompleteText( model: GptTurbo0301ChatModel(), messages: _messagesHistory, // I GET THAT ERROR RIGHT HERE maxToken: 200, );

@kenilchandrani9805 5 ай бұрын

i am getting same error and tring solve according to you but its didnt work @@m_hussain_mustafa

@asishgokarakonda9336 8 ай бұрын

Can we use this chat_gpt_sdk for commercial purpose? Like deploying it in playstore...

@m_hussain_mustafa 8 ай бұрын

Yes you can.

@asishgokarakonda9336 8 ай бұрын

thank you

@satyamatreja9828 8 ай бұрын

My app didn't reply back anything "Chat Gpt is typing " is only thing coming on home screen

@m_hussain_mustafa 8 ай бұрын

Did you check to see if your request is being responded to successfully by OpenAI api?

@Fazz-mt8lr 7 ай бұрын

Bro what should i do for backend node js?

@m_hussain_mustafa 7 ай бұрын

Why do you need a backend for this app?

@Fazz-mt8lr 7 ай бұрын

@@m_hussain_mustafa not for this, sir how can I collect different objects in one user cart screen guide me

@joelkoshyjohn9010 5 ай бұрын

The argument type 'List' can't be assigned to the parameter type 'List'. dartargument_type_not_assignable how to solve it

@m_hussain_mustafa 5 ай бұрын

Hi, This is a type mismatch error. I'd recommend taking a look at the source code to fix this.

@Rahaf518. 4 ай бұрын

Did you solve the problem?

@joelkoshyjohn9010 4 ай бұрын

@@Rahaf518. yes ask in github get a solution

@joelkoshyjohn9010 4 ай бұрын

@@Rahaf518. Just copy the full code ask gpt to slove the error in the code

@shaibysheikh5209 6 ай бұрын

i have a error is answer is not give in debugg mode.....?

@m_hussain_mustafa 6 ай бұрын

Hi, I am a bit confused as to what you are asking.

@chani4551 4 ай бұрын

Yo i get "NOT missing your token"

@Zewyn 9 ай бұрын

error 429 do you have a solution for this?

@m_hussain_mustafa 9 ай бұрын

What is the error specifically?

@user-pw7zn9yf7h 7 ай бұрын

dont work when i build apk

@blackknightjoker7594 4 ай бұрын

Some times you will loss some json data in API call when build apk

@adammurday17 6 ай бұрын

i have downloaded the source code and watched the video. i tried to test the app after inputting my API key but the chatbot just kept showing as "typing" and never returned a response. where could i have gone wrong? tia, great video btw.

@m_hussain_mustafa 6 ай бұрын

Hi, are you getting any output in the debug log, try to see what the response from the api is, and if you are getting a 200 response or anything else.

@adammurday17 6 ай бұрын

@m_hussain_mustafa sorry, I meant to come back. But I think I found the issue. It's an account issue on openai side with my api activation.

@KaiderVn 6 ай бұрын

@@adammurday17 i have the same problem how did you fix that

@adammurday17 6 ай бұрын

@KaiderVn my account had run out of funds. I just had to top-up my account.

@MrIMacro 6 ай бұрын

i have the same problem: it says you have exceeded your limit even though it is the first time i use it !! Any solution please?

@AhmedAlabd122 7 ай бұрын

can you give me a link to your android emulator version?

@m_hussain_mustafa 7 ай бұрын

Hi, I use Pixel 7 Android API 33 as my simulator.

@dovanlam1207 8 ай бұрын

please give me source code again, thank a lot,

@m_hussain_mustafa 8 ай бұрын

Hi, source code link is in description.

@rafhaellowixhomwad 7 ай бұрын

is there a limit?

@m_hussain_mustafa 7 ай бұрын

Yes there is a free tier limit imposed by openai, after which you have to pay.

@tcgalien 6 ай бұрын

there is an error while i setState why

@m_hussain_mustafa 6 ай бұрын

What is the error?

@tcgalien 6 ай бұрын

@@m_hussain_mustafa setState is not recognized

@ajeeshdas8561 7 ай бұрын

I got this error,, "E/flutter ( 5501): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: status code :429 message :{message: You exceeded your current quota, please check your plan and billing details., code: insufficient_quota, type: insufficient_quota}". What to do sir?

@m_hussain_mustafa 7 ай бұрын

This means you've exceeded the limit of the free usage you now need to provide your payment information to continue using the API further.