Build ChatGPT App in Flutter using OpenAI API - Full Course
This course covers how to integrate the Rest API in a Flutter application.
The course mostly focuses on REST API integration in Flutter.
Course prerequisites:
Basic knowledge in programming to get started
A basic understanding of Flutter and good knowledge are recommended
🔥 This course on Udemy: cutt.ly/X3EzCJM
📦 Complete source code: cutt.ly/f3WP3bx
💙 Flutter courses: www.udemy.com/user/hadi-kachm...
Special thank you to Hadi Kachmar for generously sharing his paid Udemy course with us for free.
🎬 Coding with Hadi: / @codingwithhadi
►For the 3D intro, I'm using Rotato: bit.ly/3heGagj
►Support Us: / theflutterway
► Social Media
GitHub: github.com/abuanwar072
Twitter: / theflutterway
Twitter: / abuanwar072 (my personal profile)
Facebook: / theflutterway
► Timestamps
00:00 - Intro
02:02 - App Overview
03:32 - Source code on GitHub
04:19 - Add the required packages
09:05 - Setting up the application
19:05 - Start building the chat screen
30:18 - Build the chat widget
40:14 - Implement the ModalBottomSheet
43:11 - Create the dropDownButton and optimize the previous code
51:10 - Explain the API documentation and test it using Postman
59:05 - Write a Function to get the model response
01:09:36 - Implement the Models model class Enhance the function And error handling
01:17:24 - Start displaying all Models using FutureBuilder
01:24:29 - Implement the Models provider
01:34:24 - Implement the chats model and allow the user to send a message
01:49:42 - Start display the chats on the screen
01:57:55 - Scroll the chat List to the end
02:00:36 - Animate the bot response like ChatGPT
02:04:54 - Implement the chat provider
02:12:28 - Show the error, and not allow the user to send an empty message
02:17:11 - Get a better response, and avoid spamming
Thanks for watching!
Make sure to like + Subscribe For More!
Пікірлер: 107
Thanks for hosting my course on your channel 🙏.
@TheFlutterWay
Жыл бұрын
It's my pleasure
@bigtaco4362
Жыл бұрын
Hi are planning to make a service app/booking service for home services course on udemy anytime soon ? I have purchased your courses and i really liked it. Sir great course, Thankyou.
@lowkeylyesmith
Жыл бұрын
Hi Hadi, thank you very much for making the course freely available. I bought your course "Flutter 3.0&Firebase Build a Grocery App&WEB Admin Panel" on Udemy, but unfortunately I haven't got around to it yet due to lack of time. That's why I find this short course here very helpful. I hope to come close to your knowledge at some point and be able to develop apps myself. Thank you from the bottom of my heart and best regards from Austria.
This is an awesome tutorial! Fresh and clean. Thank you a lot for making it free for us!
@TheFlutterWay
Жыл бұрын
You're very welcome!
Very well explained. Thank you so much !
very useful content my friend, thank you 🤙
Great course man!!!! I think that the url for the models were change since you post your curse. Now, differents post url are required for each model.
You always impress me 😍😍, my favorite teacher, I will not let your work go to waste, one day I will meet you, thanks my teacher 💙
Thx for the tutorial, guys! 10/10
@TheFlutterWay
Жыл бұрын
Our pleasure!
This course is really helpful, thanks a lot, sir
@TheFlutterWay
Жыл бұрын
Glad to hear that
Thanks man its working
thanks great lecture.
Hi, extraordinaty tutorial i really like it! Can you please add save chats and other features? Thanks.
Awesome tutorial ❤
@TheFlutterWay
Жыл бұрын
Thank you! Cheers!
Great effort by you
@TheFlutterWay
Жыл бұрын
Thanks a lot
thank you bro
Thx for this tutorial
@TheFlutterWay
Жыл бұрын
Any time
thank you
This is good. Thank you.
@TheFlutterWay
Жыл бұрын
Thank you too!
For those who are getting the error "You exceeded your current quota, please check your plan and billing details" it's probably because you have not received free credits from OpenAI, as these free credits are dependent on the phone number of the country you are in
@faridwicaksono6387
Жыл бұрын
how to input my own api key in editor?
@keshavkishor
Жыл бұрын
Any idea, how to get free credits?
@me_musthu
11 ай бұрын
i got this error ,im from kerala ,india
hello my bro I get this error when I want to use the app. Can you explain it to me about it? (error HttpException: You exceeded your current quota, please check your plan and billing details.)
@waseemakram9835
Жыл бұрын
just change the api key that's why this happening.?
@aarun8502
Жыл бұрын
@@waseemakram9835 it's not working
@muhsinsalam
Жыл бұрын
Same here... already given my api key credentials..but response is this error msg
How would it be possible for the answers created in constants.dart to be answered by the bot? is posible?
At 1:56:26, Why do we need setState(){} after chatList.addAll() ? I can't see the difference if I remove setState and let setState there.
@codingwithhadi
Жыл бұрын
Hello, you are changing some values, and the changes should appear on the screen, it won't work without it. Also to change the value of the isTyping and show the loader on the screen
how do i continue chatting on the same query(topic) with the AI?
First person to watch your video
@TheFlutterWay
Жыл бұрын
💙
what to do if I want to use just one Model instead of the dropdownlist?
Hello! How did you surpassed the "You exceeded your current quota, please check your plan and billing details" error? I think now we have to pay to use the API, correct?
@awscloud-dx1nk
Жыл бұрын
Use new token from another account it's working
will it remember past conversation like chatGPT?
How can the program be modified to support streaming? Thanks!
I am getting the following error : "Converting object to an encodable object failed: _LinkedHashSet len:1" at 1:44:30
Hey! All of a sudden I'm getting an error "FormatException: Unexpected character (at character 1) ^" when triggering a dropdown menu Seems like API returns me HTML file instead of json. Did you encounter such problem?
@captcha1337
Жыл бұрын
ChatGPT was down due to high demand. That was the reason why API sent me HTML instead of JSON.
33:44 how did you open the code in a new tab? somebody please explain
1:04:44 Why is this message appearing? " flutter: {error: {message: you must provide a model parameter, type: invalid_request_error, param: null, code: null}} "
hello since I followed this tutorial, but I am stuck at the level of " log("error: $error"); " in the function "ApiService.getModels" where I have this error "_TypeError (type 'Null' is not a subtype of type 'String') "I've tried everything I know what's wrong. I receive the list of models but when it comes to displaying them I get this error. help me please . timeline: 1:21:51
How can I make the result that the AI gave copyable ?
Thank you for this amazing course bro. However, at tutorial 01:49:42 - (Start display the chats on the screen) I keep get wrong and random answers from the bot when I asked questions. Please help🙏
@codingwithhadi
Жыл бұрын
Hello, 02:17:15 - in the last lecture I fixed this issue.
@martinedemklutsey4952
Жыл бұрын
@@codingwithhadi Oh ok that's amazing, thanks a lot🙏
How can i make the list view automatically scrollable while the model is answering can you provide me a solution for it?
where did i find the token
🤯
@TheFlutterWay
Жыл бұрын
Glad you like it!
anybody know what plugin is used at 33:44? drag and generate code file?
@prajwallamkhade9477
11 ай бұрын
searching for the same. let me know if you get it
Why do you use Material and Padding separately when you can use just a Container? If you're only going to use the color property, wouldn't it be better to use a ColoredBox? Sorry for my ignorance, you left me with these doubts.
@codingwithhadi
Жыл бұрын
Same but easier to read the code
Why use a provider? Why did you not use riverpod?
someone can help me pls with this error 2 [log] error HttpException: 'messages' is a required property
When I click to post the data the Error:You exceeded your current quota, please check your plan and billing details
@thedemonroyal72
Жыл бұрын
me too i am also searcing for answer can anyone help
How do I integrate this With chat history
If someone has a font error, please use if (jsonResponse['choices'].length > 0) { for (int index = 0; index String text = jsonResponse['choices'][index]['text']; List bytes = text.codeUnits; Utf8Decoder decoder = Utf8Decoder(); String utf8String = decoder.convert(bytes); log(utf8String); chatList.add( ChatModel( msg: utf8String, chatIndex: 1, ), ); } } thay cho if (jsonResponse['choices'].length > 0) { log("jsonResponse['choices']text ${jsonResponse['choices'][0]['text']}"); chatList = List.generate( jsonResponse['choices'].length, (index) => ChatModel( msg: jsonResponse['choices'][index]['text'], chatIndex: 1, ), ); }
For me getting error in " http exception - incorrect API key provided - sk-ioDx2** . How to solve this error? Please anyone answer
@sachinbasnet8258
Жыл бұрын
generate another api key and use it from openai
@faridwicaksono6387
Жыл бұрын
@@sachinbasnet8258 sir, how to fix runtimes JAR file in the classpath should have same version(error message when generate apk)
how can i use the free api??
The page is not scrolling down what should I do??
How can I get ChatGPT to respond in a language other than English?
Why turbo isn't working?
ChatGPT remembers previous conversation, how can we add the same functionality on this app..
How to change our own api key?
237th...Thanks
you have not uploaded the project to github. can you upload it please?
Everything is working fine but answer of chatGpt is spam message.. How to fix it?
@IM-my3em
Жыл бұрын
Did you find a solution for this problem ?
Does it support the other languages ? like Arabic and Turkish
@codingwithhadi
Жыл бұрын
Yes, however you need to an extra step "decode the response"
@yasseralhassan4188
Жыл бұрын
@@codingwithhadi I need only to decode the response or to decode the request too ?
@codingwithhadi
Жыл бұрын
@@yasseralhassan4188 I added a lecture about it on Udemy, and the source code has been updated
Hello, do you know how to program that ChatGPT only answers 5 questions per day and that it is restored in 24 hours?
@codingwithhadi
Жыл бұрын
You need to make authentication, if you use firebase, you can use firebase function to update the timing counter. And everytime the user send a message and get an answer, reduce the counter by 1. When the timer is done the firebase function will update it
Hello sir, how can we contact you ? About a project, we want to hire you
is it free to use openai API?
Is this a complete course in this KZread video?
@codingwithhadi
Жыл бұрын
Yes, the full course is available here, I might add new sections to the course, but we will keep it up to date.
@ghulammurtaza7959
Жыл бұрын
@@codingwithhadi that's good
How can I convert string to utf8?
@codingwithhadi
Жыл бұрын
The code is on my GitHub, I implemented it but it's not explained on KZread. It's one line of code
AI Text to Speech Flutter Full App please hot to note and play and download this audio? how to add options maleVoice and famleVoice
Is this api free to use?
Uwu♥️
But It's not free.
@TheFlutterWay
Жыл бұрын
What do you mean by not free?
@Mfbzai
Жыл бұрын
@@TheFlutterWay Open AI api, that implement on flutter. It's not free to use, should buy their license to get their api key. Anyway, God bless you for this tutorial.
@mohammadminhaziftekhar4074
Жыл бұрын
@@Mfbzai No its free, try it.
get lost!