Up next in 10
How To Build Your Own AI With ChatGPT API
3K views
Feb 7, 2024
Unleash the power of artificial intelligence in your projects with this tutorial on "How to Build Your Own AI with ChatGPT API." In this video, you'll be taken through the exciting process of integrating the ChatGPT API into your applications, enabling you to create personalized and dynamic conversational AI experiences. The tutorial covers everything from obtaining API keys to making API calls, offering a step-by-step guide suitable for developers of all levels. Whether you're a seasoned AI enthusiast or a newcomer eager to explore the capabilities of language models, this tutorial empowers you to harness the potential of ChatGPT in your own projects. Elevate your applications by incorporating a custom-built AI, capable of generating human-like text and engaging in meaningful conversations. Dive into the world of AI development with this accessible and informative guide, and discover the endless possibilities of building your own AI using the ChatGPT API.
View Video Transcript
0:00
Flip in AI, which is the team behind ChatGPT, just expanded upon their API and added in ChatGPT
0:07
This means that you can call their API and get responses directly from ChatGPT and include them into your own applications
0:13
which means you can essentially build an AI into your own applications, which is super powerful
0:18
Not only that, but this API is really easy to use. And in this video, I'm going to show you how you can get started by creating your own application using ChatGPT
0:25
Welcome back to WebDev Simplified. My name is Kyle, and my job is to simplify the web for you so you can start building your dream project sooner
0:35
To get started with ChatGPT, the first thing you want to go to is Platform.OpernA.com slash overview
0:41
I'll leave a link to that in the description down below, and all you need to do is create an account
0:45
so you can just click on sign up to create your account. Once you've done that, you should probably get redirected back to the same exact page
0:50
but now you'll see that you have an account over here, and if you click on that, you can go to manage your account
0:55
You can see that we have different usage and also you should have a free trial that has some
0:59
amount of money added to your account. That's because ChatGPT is a paid API
1:04
It's rather cheap in that it only costs you fractions of a penny per usage that you're doing
1:08
As you can see so far, my usage has been less than one penny and all the different trial
1:11
stuff that I've done. If you're working on a small application, it's going to cost you almost nothing to run, but obviously
1:17
if you scale up, it'll be quite expensive on a larger scale application. Now the most important thing to get started with the project is you need to go down to
1:23
your API keys and you're going to create a brand new secret key. When you do this, you can see your secret key is popped up here
1:29
This is the only time you'll have to copy this. So just make sure you click copy on this and you're
1:33
going to use that inside of your application. Other than that, you don't really need to mess with
1:36
this at all. And just know that I'm going to be deleting the secret key after this video, so this won't actually work for you. Now that we have that created, we can just close out of this
1:43
and we're going to come over to our application in VS code. I'm going to create a file called
1:47
d.d.n. And I'm just going to paste that in here. We'll just say API key is equal to whatever that
1:53
API key is going to be. Now the next thing I want to do is actually install all the dependencies
1:57
we're going to need. So I can call NPM init dash y. As you can see, that's generated a package
2:02
JSON for me. And then I can call NPMI, and I want to install two dependencies. The first one is called
2:06
dot env. That's just going to help us load our dot env file. And the next one is called OpenAI
2:11
which is the actual API we're trying to work with. So pretty self-explanatory what we're working
2:15
with there. And now, once we have that done, we can create a simple script.js file where we're
2:19
going to run all of our code And our package JSON let just have a really simple simple run in here so we going to say dev and then inside of here we can say that we want to run script Every time we run NPM run dev it going to run all the code in this file which is currently nothing
2:35
Now, in order to show you how this works, I'm just going to be doing a really simple node terminal application
2:40
but you can obviously expand this to whatever you want. The very first thing we can do, I'll zoom this in so it's a little easy to read
2:45
We can get our config set up, so we're going to say import config from, and we want to get that from
2:50
dot env, and we can just call this method. What that's going to do is just going to set up our config file for us
2:55
Now if we console.log process.env. And we call it API URL. We run our script
3:02
It should hopefully print out that URL for us. You're going to notice we're getting an error though. And this is because if you want to use modules like I have inside of Node
3:09
all you need to do is come in here and set your type here equal to module
3:13
Now if we do that and we run this, you can see it should work. And right now it's printing out undefined
3:17
The reason for this is obviously this should say API key instead of URL. So now if I rerun that, you can see that is printing out that API
3:23
So we're able to get that information Next we need to get all the stuff from our open AI
3:27
We can come in here we can import from open AI and the most important things that we're going to need is we're going to need some type of configuration
3:33
And then we're also going to need access to the open AI API So configuration is how you set everything up like your API key and open AI API
3:40
is actually what you call to do everything inside of the AI now if you're curious how I found all this out
3:45
Everything is inside the documentation here for how you can set up open AI and if you go down the
3:50
have guides for things like chat, so you can set up all of your chat-related stuff. Most of these guides are going to be in PHP, because that's what they expect you to use
3:56
but you can kind of translate over to what JSON or JavaScript is going to look like. It's not too much of a translation
4:01
Anyway, once we have that done, we can set up our OpenAI. And this is going to be coming from a new open AI object, so we can create a new version of our open AI
4:10
and here we just need to pass it a new version of our configuration. And the only thing we need to pass to our configuration is an API key
4:16
We know that our API key here is just this. Let's just copy it up. So now we have access to that open API
4:23
Now, this open API has a lot of things you can do inside of it. So we can say open a AI
4:27
And as you can see, there's a ton of things, but the one we care about is going to be creating a chat completion
4:31
And inside of here, we need to pass it some information. But first we pass to the model of the AI that we want to run
4:36
In our case, we want to use GPT-3.5 turbo. That is the current most up-to-date version of chat GPT that you can use at this time
4:45
But again, if you want to get a more up-to-date or different version, you can check the documentation for whatever the best version is going to be Then we want to send it the messages And the message is just an array of all the messages you want to send and each object in the array is an object It going to have a rule so this is going to be who sends this message
5:01
whether it comes from a system, whether it comes from chat gbt themselves, which is the assistant, or if it comes from a user
5:07
In most cases, you're going to be sending messages that come from a user, so you're going to say the role is user
5:11
Then you need to specify the content. So whatever message you want to say, like, hello, chat, GPT
5:18
that's what we could have our message be. Let's just capitalize it properly. And that's going to be calling this, and this gives us a promise, which comes out with a result
5:25
So for now, let's just console. log that result, and we're going to see exactly what this looks like
5:30
It's going to give this quicksave. We're going to run this, and we're going to see what our result prints out to us
5:34
So give it a second, and I'll just expand this up, so it's a little easier to see. You can see it gives us a ton of different information being returned to us
5:41
But most importantly, we have this section down here, which gives us information on our choices
5:45
as well as the different amounts of usage that we have, which is going to determine our cost
5:49
And all of this is coming inside of a data property. So what we can do is we can say dot data
5:54
Dot choices. And that's the thing that we really care about the most. So if we just rerun this real quick, I'll expand this up
6:00
and I'll rerun exactly what we did. And we should hopefully get back a result. And as you can see, it's an array of all the different messages
6:05
because you can ask it to give you more than one message if you want. You can see it contains a message
6:10
The role is assistant because this is coming from chat GPT, as well as the actual message content that it's going to be printing out to us
6:16
And a few other things such as why it stopped giving your response, because there are certain limits on the amount of text you can return
6:22
And if it goes over that limit, this reason may change. But for the most part, all we want to do is get the first element from this array
6:27
and we want to get the message, and we want to get the content of that message. So we can do that right now
6:31
We want to get the very first choice. We want to get the content, which is going to be our message
6:36
Inside that, we want to get the content. So now, if I run this again, it should hopefully just print to us whatever chat GPT response
6:42
Hello, how can I assist you today? That's exactly what we expect. Now what we need to do is add away for the user to input information
6:48
and be able to react to that with chat gpt. The best way for us to do that inside of Node.js
6:54
is going to be with a library called Readline, which is built into Node. So we can say readline from readline, just like that
7:01
That's coming straight from Node. And all we need to do is set up some type of user interface
7:05
This is going to be how we input information. So I'm going to call this user interface. This is just going to be set to readline
7:12
Create interface. This is going to take into properties, our input which is going to be our standard end so we can say process That standard in And then we have our output which is just process out There we go And now here our user interface we can actually tell it to do certain things
7:30
So for example, we can call user interface. Prompt, and all that's going to do is is going to prompt the user to have some type of input
7:36
So if really quickly I just comment out what we have down here, and I run this, we should just
7:40
see a prompt show up. As you can see, we have a prompt, and we can type inside of that prompt, hit enter
7:44
and it'll do certain stuff. Now the next thing we want to do, you just comment
7:47
comment this back in is we can set up the listener in here. So we can say user interface dot on
7:51
and I want to listen online. So every single time I hit enter, that's going to be saying
7:55
hey, send this along. That's going to be a brand new line. And all I want to do is I want to get our
7:59
input. I'm going to do this asynchronously. So we're going to say async input. We're going to use
8:03
that as an arrow function. If you're not familiar with async await, I have a full video on it
8:07
I'll link in the cards in description for you, but essentially it allows you just to wait for promises to finish, which in our case, this is a promise right here. We can await this
8:15
and we can get the result back, just like that. So we don't even need to worry about this dot bend
8:19
We can comment this out for now. And our content here, we just want to put as our input. Because whatever we type into our prompt and hit enter
8:25
that's going to be this input right here. Then we can take this response, and we can log it out to the user
8:30
So we can just essentially copy this line right here and paste it down right there
8:34
That's going to be most of what we need. All we want to do is then just show the prompt back to the user
8:39
So if we just delete all that code and we look at what we have here, essentially we're saying, okay, prompt the user for some input
8:44
Whenever they give us input, send that over to chat GPT, log out the value to the screen
8:49
and then ask them for input again, and just loop and loop forever. So if we run this, you can see, it's going to ask us for something, so I can say
8:56
How are you? Hit enter. It's going to give us back a response, and it says a bunch of stuff
9:01
If I move my camera out of the way, you can see it says it doesn't have feelings, blah, blah, super straightforward
9:05
We can say, who is web dev simplified? Hit enter, and it's going to give us hopefully an accurate response
9:12
We'll see if it does or not. a little bit, but I have to simplify a YouTube channel created by me
9:17
Okay, yeah, it's rather accurate. I'm not going to read it all, but at least they got my name right. And you can see that we can interact with chat GPT
9:22
And the responses are actually rather quick that it gives it to us back. It's a lot quicker than when you use the website because it makes you type out each character individually
9:29
While here, it's just showing you the response immediately, which is really nice. Best of all, you can integrate this into your own application for your own chat-related AI needs
9:37
And that's really all it takes to implement this API. And if you're afraid that chat GPT is going to take your job or change how you work
9:44
You're going to want to check out this video right over here where I talk about that exact topic. With that said, thank you very much for watching and have a good day
#Intelligent Personal Assistants
#Programming
#Software
#Voice & Video Chat
#Web Services