How To Build Your Own AI With ChatGPT API
Summary
TLDRThis video tutorial by Kyle from Web Dev Simplified introduces viewers to integrating Chat GPT into their applications via OpenAI's API. It guides through creating an account, obtaining an API key, setting up a .env file, and installing necessary dependencies. The script demonstrates a simple Node.js terminal application that interacts with Chat GPT, showcasing how to send messages and receive responses. The video also highlights the ease of use and potential of incorporating AI into custom projects.
Takeaways
- 🚀 OpenAI has expanded their API to include Chat GPT, allowing developers to integrate AI chat capabilities into their applications.
- 🔑 To get started, developers need to create an account on platform.openai.com and generate an API key for authentication.
- 💰 Chat GPT is a paid API, but it's cost-effective with pricing based on usage, and there's a free trial available for initial testing.
- 📝 The script demonstrates creating a .env file to securely store the API key and using the 'dotenv' package to load it into the application.
- 🛠️ Dependencies such as 'dotenv' and 'openai' are installed via npm to facilitate the API interaction within the application.
- 🔍 The 'openai' package is used to configure the API connection and interact with the Chat GPT model.
- 🗣️ The script includes creating a chat completion by sending messages with roles (e.g., 'user', 'assistant') and receiving responses.
- 🔁 The application uses a readline interface to continuously prompt the user for input and interact with Chat GPT in a loop.
- 📊 The response from Chat GPT includes a 'choices' array that contains the AI's messages and other relevant information.
- 🔎 The script shows how to parse the Chat GPT response to display the AI's message content to the user.
- 🔄 The video concludes with a demonstration of the interactive chat application, highlighting the quick response times and ease of integration.
Q & A
What is the main topic of the video?
-The video is about integrating Chat GPT into one's own applications using the OpenAI API.
What does OpenAI offer with their API expansion?
-OpenAI offers the ability to call their API and get responses directly from Chat GPT, allowing developers to integrate AI into their applications.
How can one get started with Chat GPT using the OpenAI API?
-To get started, one needs to visit platform.openai.com, create an account, and then manage the account to get an API key.
What is the cost associated with using the Chat GPT API?
-Chat GPT API is a paid service, but it is relatively cheap, costing fractions of a penny per usage.
What is the importance of the API key in this context?
-The API key is crucial as it is used to authenticate and authorize requests to the OpenAI API within one's application.
What is the recommended first step in setting up the application to use Chat GPT?
-The first step is to create a .env file to store the API key securely and then install necessary dependencies like 'dotenv' and 'openai'.
What are the two main dependencies needed for the application to interact with the OpenAI API?
-The two main dependencies are 'dotenv' for managing environment variables and 'openai' for interacting with the OpenAI API.
How does the video demonstrate the interaction with the Chat GPT API?
-The video demonstrates by creating a simple Node.js terminal application that sends messages to Chat GPT and logs the responses.
What is the role of the 'readline' library in the application?
-The 'readline' library is used to create a user interface for inputting information and interacting with the Chat GPT API.
How can the user get responses from Chat GPT in the application?
-The user can input text through the readline interface, which then sends the input to Chat GPT and logs the response back to the user.
What does the video suggest about the future implications of AI like Chat GPT on jobs?
-The video suggests that there might be concerns about AI taking jobs, and it refers to another video for a discussion on this topic.
Outlines
🚀 Introduction to ChatGPT API Integration
The paragraph introduces the new API expansion by OpenAI, allowing developers to directly integrate ChatGPT into their own applications. This integration enables the creation of AI-powered features within apps. The API is highlighted as being user-friendly, with the video set to demonstrate how to get started with this technology.
🔑 Setting Up Your OpenAI Account and API Key
This paragraph explains the steps to set up an OpenAI account, including signing up and managing your account. It mentions the free trial available and the cost-effectiveness of the API, especially for small-scale applications. It also covers the process of creating an API key, a critical step for using the API in your projects.
💻 Installing Dependencies and Setting Up the Project
The paragraph details the initial setup for the project, including installing dependencies like 'dotenv' and 'openai' via npm. It explains how to create a configuration file in VS Code, where the API key is stored, and setting up the package.json file to run scripts. The basic project structure is outlined, preparing the environment for further development.
⚙️ Configuring and Connecting to the OpenAI API
This section guides through configuring the OpenAI API in the project by setting up the necessary imports and creating an OpenAI object with the API key. It mentions the importance of checking the documentation for up-to-date information and demonstrates how to configure the chat model (GPT-3.5 Turbo) for generating responses.
📝 Sending Messages and Handling API Responses
The paragraph walks through the process of sending messages to the OpenAI API and handling the responses. It shows how to structure messages, access the API's response data, and extract the relevant information like message content. The importance of understanding the returned data and its structure is emphasized.
📜 Creating a User Interface for Input in Node.js
This section explains how to create a user interface in Node.js using the 'readline' library. It describes setting up a prompt for user input, processing the input asynchronously, and sending it to the API. The paragraph covers setting up a continuous loop to allow for multiple inputs, making the application interactive.
🔄 Running the Application and Getting Responses
The final paragraph demonstrates running the application and interacting with ChatGPT via the command line. It highlights the speed of the responses compared to the web interface and shows how the application can be expanded and integrated into larger projects. The video concludes by reassuring viewers about the practical applications of the API in their projects.
Mindmap
Keywords
💡API
💡Chat GPT
💡Web Dev Simplified
💡Node.js
💡Readline
💡.env file
💡NPM
💡Configuration
💡Chat Completion
💡Promise
💡Documentation
Highlights
Open AI has expanded their API to include Chat GPT, enabling direct responses integration into custom applications.
The API is user-friendly and allows building AI capabilities into applications with powerful chat functionalities.
A step-by-step guide is provided to get started with Chat GPT by creating an account on platform.openai.com.
Chat GPT is a paid API, but it's cost-effective with usage costing fractions of a penny.
An API key is essential for accessing the Chat GPT service and should be securely stored and used within applications.
A .env file is used to store and manage the API key for environmental configuration in the application.
Dependencies such as 'dotenv' and 'openai' are required for the application to interact with the Chat GPT API.
The script.js file is the core of the application where all the code for interacting with Chat GPT will reside.
The 'openai' module is imported to configure and access the Chat GPT API within the application.
Documentation is key for setting up and understanding the capabilities of the openai module.
Creating chat completions involves passing messages with roles and content to the Chat GPT model.
GPT-3.5-turbo is the current version of Chat GPT used in the example, but documentation should be checked for updates.
The API response includes a data property with choices that contain the AI's message content and other relevant information.
Readline is a built-in Node.js library used to create a user interface for input and output in the terminal.
The readline interface allows for continuous user interaction with Chat GPT through a loop that prompts and logs responses.
Chat GPT's responses are immediate and can be integrated into custom applications for various chat-related AI needs.
The video also addresses concerns about AI job displacement and provides a link for further discussion on the topic.
Transcripts
open AI which is the team behind chat
GPT just expanded upon their API and
added in chat GPT this means that you
can call their API and get responses
directly from chat GPT and include them
into your own applications which means
you can essentially build an AI into
your own applications which is super
powerful 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 chat GPT
[Music]
welcome back to web dev simplified my
name is Kyle and my job is to simplify
the web for you so you can start
building your dream project sooner to
get started with chat GPT the first
thing you want to go to is
platform.openai.com overview I'll leave
a link to that in the description down
below and all you need to do is create
an account 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
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
you can see that we have different usage
and also you should have a free trial
that has some amount of money added to
your account that's because chat gbt is
a paid API it's rather cheap in that it
only costs you fractions of a penny per
usage that you're doing as you can see
so far my usage has been less than one
penny in all the different trial stuff
that I've done and if you're working on
a small application it's going to cost
you almost nothing to run but obviously
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
your API keys and you're going to need
to create a brand new secret key when
you do this you can see your secret key
has popped up here this is the only time
you'll have to copy this so just make
sure you click copy on this and you're
going to use that inside of your
application other than that you don't
really need to mess with this at all and
just know that I'm going to be deleting
this 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 and we're going to come over to
our application in vs code I'm going to
create a file called D dot EnV and I'm
just going to paste that in here we'll
just say API key it's equal to whatever
that API key is going to be now the next
thing I want to do is actually install
all the dependencies we're going to need
so I can call npm init Dash y as you can
see that's generated a package Json for
me and then I can call npmi and I want
to install two dependencies the first
one is called dot EnV that's just going
to help us load our EnV file and the
next one is called open AI which is the
actual API we're trying to work with so
pretty self-explanatory what we're
working with there and now once we have
that done we can create a simple
script.js file where we're going to run
all of our code our package Json let's
just have a really simple
run in here so we're going to say Dev
and then inside of here we can say that
we want to run script.js every time we
run npm run Dev it's going to run all
the code in this file which is currently
nothing now in order to show you how
this works I'm just going to be doing a
really simple node terminal application
but you can obviously expand this to
whatever you want the very first thing
we could do I'll Zoom this in so it's a
little easier to read we can get our
config set up so we're going to say
import config from and we want to get
that from dot EnV and we can just call
this method what that's going to do is
it's just going to set up our config
file for us now if we console.log
process.env Dot and we called it API URL
we run our script 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 all
you need to do is come in here and set
your type here equal to module now if we
do that and we run this you can see it
should work and right now it's printing
out undefined the reason for this is
obviously this should say API key
instead of URL so now if I rerun that
you can see that it's printing out that
API key so we're able to get that in
information next we need to get all the
stuff from our openai 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 and then we're also
going to need access to the openai API
so configuration is how you set
everything up like your API key and
openai API is actually what you call to
do everything inside of the AI now if
you're curious how I found all this out
everything is inside the documentation
here for how you can set up openai and
if you go down they 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 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
anyway once we have that done we can set
up our open Ai and this is going to be
coming from
a new open AI object so we can create a
new version of our open Ai 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 we know that our API key here is
just this let's just copy it up there we
go so now we have access to that open
API now this open API has a lot of
things you can do inside of it so we can
say open AI Dot 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 and inside here we need
to pass in some information the first we
pass to the model of the AI that we want
to run in our case we want to use GPT
hyphen 3.5 turbo that is the current
most up-to-date version of Chad GPT that
you can use at this time 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's going to have a
role so this is going to be who sends
this message whether it comes from a
system whether it comes from chat gbt
themself which is the assistant or if it
comes from a user 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
then you need to specify the content so
whatever message you want to say like
hello chat CPT 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
but for now let's just console.log that
result and we're going to see exactly
what this looks like it's going to give
this quick save we're going to run this
and we're going to see what our result
prints out to us 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 it a ton of different information
being returned to us but most
importantly we have this section down
here which gives us information on our
choices as well as the different amounts
of usage that we have which is going to
determine our cost and all this is
coming inside of a data property so what
we can do is we can say dot data.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 I'll
rerun exactly what we did and we should
hopefully get back a result as you can
see it's an array of all the different
messages because you can ask it to give
you more than one message if you want
you can see it contains a message 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 and a few other
things such as why it stopped giving you
a response because there are certain
limits on the amount of text you can
return and if it goes over that limit
this reason may change for the most part
all we want to do is is get the first
element from this array and we want to
get the message and we want to get the
content of that message so we can do
that right now we want to get the very
first choice we want to get the content
which is going to be our message inside
that we want to get the content so now
if I run this again it should hopefully
just print to us whatever chatgpt
response hello how can I assist you
today that's exactly what we expect now
what we need to do is add a way for the
user to input information and be able to
react to that with chat GPT the best way
for us to do that inside of node.js is
going to be with a library called
readline which is built into node so we
can say read line
from readline just like that that's
coming straight from node and all we
need to do is set up some type of user
interface 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 read line
dot create
interface
this is going to take into properties
our input which is going to be our
standard in so we can say process that's
standard in and then we have our output
which is just process.standard out there
we go and now here our user interface we
can actually tell it to do certain
things so for example we can call user
interface.prompt and all that's going to
do is it's going to prompt the user to
have some type of input so if really
quickly I just comment out what we have
down here and I run this we should just
see a prompt show up as you can see we
have a prompt and we can type inside of
that prompt hit enter and it'll do
certain stuff now the next thing we want
to do we just comment this back in is we
can set up the listener in here so we
can say user interface dot on and I want
to listen online so every single time I
hit enter that's going to be saying 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 input I'm going to do
this asynchronously so we're going to
say async input we're going to use that
as an arrow function if you're not
familiar with async await I have a full
video on it I'll link in the cards and
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 and
we can get the result back just like
that so we don't even need to worry
about this dot then we comment this out
for now and our content here we just
want to put as our input is whatever we
type into our prompt and hit enter
that's going to be this input right here
then we can take this response and we
can log it out to the user so we can
just essentially copy this line right
here paste it down right there 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 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 whenever
they give us input send that over to
chatgpt log out the value to the screen
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 how are you
hit enter it's going to give us back a
response and it says a bunch of stuff if
I move my camera out of the way you can
see it says it doesn't have feelings
blah blah blah super straightforward we
can say who is web dev simplified
hit enter and it's going to give us
hopefully an accurate response we'll see
if it does or not span this a little bit
we'll have to simplifies YouTube Channel
created by me okay yeah it's rather
accurate I'm not going to read it all
but at least I got my name right and you
can see that we can interact with chat
gbt 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 while here
it's just showing you the response
immediately which is really nice the
best of all you can integrate this into
your own application for your own chat
related AI needs
and that's really all it takes to
implement this API now if you're afraid
that chat GPT is going to take your job
or change how you work 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
関連動画をさらに表示
Better than a ChatGPT iPhone App | S-GPT Shortcut!
Build Anything With ChatGPT API, Here’s How
How to Get ChatGPT to Make Phone Calls For You (Custom GPT Tool)
Asp.Net Core Web API Client/Server Application | Visual Studio 2019
手把手教大家搭建Autogen|微軟的多智能體協作系統|多AI協調|#multi-agent #autogen #openai #chatpgt #gpt4 #gpt #web3
ChatGPT - OpenAI API w Excelu (za darmo)
5.0 / 5 (0 votes)