How to Integrate ChatGPT in Visual Studio Code and Create Awesome Apps For FREE Full Setup
Jan 9, 2025
How to Integrate ChatGPT in Visual Studio Code and Create Awesome Apps For FREE Full Setup
Show More Show Less View Video Transcript
0:00
uh hello guys welcome to this video so
0:02
in this video I will show you how to
0:03
integrate chat GPD uh which is the AI
0:06
bot inside your Visual Studio code
0:09
extension for day-to-day programming
0:11
tasks so if you want to build some kind
0:14
of applications you can take help of
0:16
chat GPT inside vs code so there is an
0:18
extension right here which provide you
0:21
free access you don't need any API key
0:24
you can use it for free of cost and this
0:26
is actually the extension let me show
0:29
you
0:31
so if you open your vs code simply go to
0:34
the extensions tab right
0:37
here simply click this and just search
0:40
for the extension and just type here
0:42
chat
0:44
GPT and the very first extension which
0:47
comes uh it has got over
0:50
938 th000 downloads almost reaching 1
0:53
million downloads so it is developed by
0:57
Shang this this is a person so it
1:01
doesn't need any API key and you just
1:04
need to click on the install button to
1:06
install this extension globally so now
1:09
the extension is enabled globally
1:12
so now once it is enabled uh you will
1:16
see this uh three dots right here just
1:19
click these three dots and you will see
1:22
this option of chat GPD so simply need
1:25
to click this option and this will
1:27
actually open this prompt window so here
1:30
you can actually write any task that you
1:33
write let me say write a simple Python
1:36
program to add two
1:40
numbers so if you just add this prompt
1:42
here it will actually write you the full
1:45
program in Python to add two numbers
1:47
you'll see that it will also give you
1:49
explanation of this program as well
1:51
short little explanation what this
1:53
program does you will see
1:55
that now you can copy this program and
1:58
uh you can create
2:00
paste
2:02
it so this is a program at it has now we
2:06
can run this program uh we can simply
2:08
say
2:13
here you can simply run this so can open
2:20
it so enter the first number 4 + 4 is
2:25
equal 8 so in this way you can make uh
2:29
use of this chat GPT extension so this
2:31
is a very simple example you can even
2:33
write a more complex app as well let's
2:36
suppose write
2:37
a python script
2:41
to download image from URL so this will
2:45
actually download a image from a certain
2:56
URL so here you will actually enter
3:00
the URL of the image let me go to
3:12
unsplash and you can pick any picture
3:15
right here let me copy image address and
3:17
paste it inside the python
3:26
script so now you can see the image is
3:29
downloaded successfully if I check right
3:31
here you can see the download images
3:33
downloaded so you can just see the scope
3:35
of chat GPD guys in vs code it is right
3:38
built inside this no need to paste any
3:40
API key you can use it for free
3:42
unlimited number of times so you can do
3:47
the same things let's suppose if I say
3:49
here make a random password generator in
3:56
HTML using JavaScript with the copy to
4:01
clipboard option and for that for UI we
4:05
need to use uh Tailwind CSS so we need
4:10
to be descriptive inside our prompts to
4:12
actually generate the correct code so we
4:15
can actually say just make the card
4:20
like UI in the center of the
4:25
screen provide full
4:28
code so now you will see you have given
4:31
a lot of description So based upon that
4:34
it will generate this program for you
4:35
random password generator you can see it
4:38
is really fast and uh you can uh
4:41
instantly use this simply paste the
4:44
program that it has generated you will
4:45
see that in a short period of time it
4:48
has generated a really quality program
4:50
so we can now run this with the in the
4:53
browser so this you can see how it has
4:56
generated this random password generator
4:58
so if I click this button you will see a
5:01
rimed app is basically generated by chat
5:03
GPT in a matter of seconds copy to
5:06
clipboard functionality is also present
5:08
so if I click this button my password
5:10
will be copied to clipboard I can change
5:12
the password strength to 30 characters
5:15
now the password will be 30 characters
5:18
so in this way guys you can just see the
5:20
limit is endless so it totally depends
5:23
upon how wisely you are using chart GPD
5:27
how descriptive you are while asking
5:29
question questions to chat GPD based
5:31
upon how much descriptive you are it
5:34
will generate answers accordingly So
5:37
based upon you need to just practice in
5:40
writing the prompts descriptively So
5:43
based upon that chat GPT will answer to
5:45
your questions so if you want to make
5:49
any sort
5:51
of you can see that uh the speed is
5:54
really fast and you can just say make a
5:57
similar program
6:00
using a different framework let's
6:02
suppose semantic UI which is again a UI
6:05
framework with samees
6:09
interface so now it will actually
6:11
generate the same application but this
6:13
time it will be using semantic UI
6:15
different classes different UI framework
6:18
but the logic of the application will
6:20
remain the
6:21
same this will be I will create index to
6:25
HTML so this time you will see the UI
6:28
will be different because it is using
6:29
the different UI framework if I open the
6:31
same
6:33
application now you can see that
6:42
uh it is actually generated uh a form
6:46
here so we can just uh tell that
6:50
to as I please
6:54
Generate random password generator reel
7:09
so you just need to explicitly tell them
7:12
what application you want to have so I
7:15
just told it so please Generate random
7:17
password generator that you generated
7:19
earlier with same UI but using semantic
7:22
UI so
7:24
now it has given me this code right here
7:27
uh this is actually the HTML code
7:33
and this is actually the JavaScript code
7:44
so so you can see that so it has
7:48
generated this app now this is using
7:50
semantic UI So based upon that you can
7:53
uh make very complex apps you can use
7:57
this will save you a lot of time because
7:59
you you don't need to write the same in
8:01
code again and again chat GPT will
8:05
generate lot of the common code for you
8:07
so you don't need to start start from
8:09
scratch you can make use of this uh
8:12
plug-in very easily inside vs code it uh
8:15
the main thing about chat GPT this
8:17
plugin is that it's totally free you
8:19
don't need to actually subscribe to any
8:21
subscription fees or any used API key
8:24
totally free so just make sure that you
8:27
install this plugin which is developed
8:29
by this plugin so there are various
8:30
plugins with the name chat GPT but this
8:33
is developed by this developer you need
8:35
to use this plugin it's totally free and
8:39
after that you can generate any sort of
8:41
application using this so you need to be
8:43
wise in asking the question be
8:45
descriptive and then you will get your
8:48
respective program so thank you very
8:50
much for watching this video please hit
8:52
that like button subscribe the channel
8:53
as well and I will be seeing you in the
8:55
next one
#Programming
#Software
#Development Tools
#Scripting Languages
#Intelligent Personal Assistants
