live_tv
Livestream Starting Soon
00
Hours
:
00
Minutes
:
00
Seconds
Up next in 10
This VS Code Github Copilot Agent Mode Just Changed Everything For Programmers to Code Faster
Jun 3, 2025
Get the full source code of application here:
Watch My Visual Studio Code IDE Setup Video For Fonts,Themes & Extensions
https://youtu.be/Bon8Pm1gbX8
Hi Join the official discord server to resolve doubts here:
https://discord.gg/cRnjhk6nzW
Visit my Online Free Media Tool Website
https://freemediatools.com/
Buy Premium Scripts and Apps Here:
https://procodestore.com/
Show More Show Less View Video Transcript
0:00
uh hello guys uh welcome to this video
0:02
So in this video I will show you how to
0:05
enable the AI agent mode inside your VS
0:08
code Uh agent mode is a special kind of
0:12
a artificial intelligent mode which is
0:14
uh recently released in VS code which
0:17
allows you to build your application
0:19
faster using a agent mode So by default
0:24
you will see GitHub copilot is there
0:26
This is actually the icon here So if you
0:29
are not seeing this you should obviously
0:32
update your VS code by going to this
0:36
help option So just go to help and just
0:39
check this option which is check for
0:41
updates and it will actually check for
0:44
recent updates and you can see I'm
0:47
saying there are currently no updates
0:49
available So in our in your case if any
0:52
update is available it will download
0:54
this and install it So just install the
0:58
latest version of VS Code And after that
1:01
just go to this uh button right here
1:03
This is GitHub Copilot It's built in
1:06
inside VS Code And this doesn't require
1:09
any paid version of GitHub copilot It's
1:12
totally free You can use it Simply click
1:14
this open chat button And after that you
1:17
will see these two options which will
1:19
appear by default If you see the ask
1:22
mode and the edit mode So the ask mode
1:24
here
1:26
basically it actually if you ask any
1:30
kind of question right here let's
1:31
suppose I will say how to make a
1:35
calculator in
1:38
uh HTML CSS and
1:41
JavaScript So this is actually the ask
1:44
mode It's a very basic AI mode where you
1:46
actually ask the question and then the
1:48
AI will basically generate the response
1:51
for you and it actually generated all
1:54
the files here If you see that but it
1:56
hasn't created these files in our local
1:59
directory So it just provided us with
2:02
the code here You will see if you
2:05
individually click on the files it will
2:07
be the code will be shown right here
2:14
And then there is a second mode here
2:16
which will be you can see this is
2:17
actually your calculator code here And
2:20
then there is a second mode right here
2:22
If you see this is actually the edit
2:24
mode And uh this mode allows you to
2:27
create files automatically So now the
2:30
this mode whenever you ask a question to
2:33
the artificial intelligent it will also
2:35
create files for you automatically
2:38
rather than answering the question So
2:40
now if I ask the same
2:42
question just make
2:45
a
2:48
scientific
2:50
calculator and
2:52
uh HTML CSS and and start the dev
3:00
server So we actually asked a question
3:03
So now it will actually generate the
3:05
response It will also create the files
3:07
for us
3:09
So you can see it is generating the HTML
3:12
file and
3:14
uh now in this edit mode it will also
3:18
create the file automatically for you
3:19
You see it has created this index html
3:22
file and now it is writing the
3:25
stylesheet code here If you see it has
3:28
written the stylesheet code and now it
3:31
is creating the JavaScript code
3:38
So this is your JavaScript code also
3:41
written and now we have these options
3:44
here to keep these files or not I will
3:46
say keep these files and
3:49
uh all the files here you will see now
3:52
we have these commands
3:55
here it is telling us so whenever you
3:58
click it will automatically
4:01
uh just execute these commands as well
4:03
Just click on the individual command and
4:06
you can see it is installing these
4:08
dependencies npm install you will see
4:12
and then just click on that npm start So
4:16
it will start your application at
4:18
the
4:19
browser So this is this edit
4:24
mode which uh automatically does all all
4:28
the things for you You don't need to do
4:29
anything You just ask ask the question
4:32
and then it will build out the
4:34
application and also
4:39
start you will see it is started the
4:43
live
4:46
server So this is your calculator which
4:49
is ready It is executed in the browser
4:51
You can see
4:52
that And now there is the third kind of
4:55
a mode which is recently released in the
4:57
latest version of VS code which is agent
5:00
mode So by default it will not be showed
5:04
So now to enable this agent mode you
5:06
just need to go to uh
5:09
preferences and preferences open
5:11
settings user interface and here you
5:14
just need to search for the agent
5:17
setting right here and just enable this
5:19
mode here By default it will not be
5:21
enabled Just tick mark this option and
5:23
it will enable this agent mode And also
5:26
tick mark this option as well And after
5:30
doing that just restart your system and
5:36
uh just restart your system and then
5:39
again go to this uh GitHub copilot and
5:42
then here you will see the third mode
5:44
which is there which is the agent mode
5:47
Uh agent mode is slightly different from
5:49
this edit mode agent mode slightly works
5:53
uh like a developer like a real human
5:56
being So AI will actually think about
6:00
before generating the response So it's a
6:02
special kind of a mode and you can
6:04
select any AI model from this drop-down
6:07
here By default it selected claude 3.5
6:10
So here you can change to any AI model
6:13
So here you can again ask the same
6:15
question
6:20
and let's suppose I delete
6:23
these files here
6:26
and now we don't have anything and uh
6:29
you can create a new chat here by
6:31
clicking the plus icon to create a new
6:34
chat and now if you want to build out
6:37
anything you can just
6:49
Just build
6:57
a scientific calculator
7:01
in
7:03
React and start the React app
7:10
So you can just ask any question here
7:12
and it will do the entire thing on its
7:15
own You don't need to do
7:17
anything So it is automatically
7:20
detecting whatever you ask depending
7:22
upon that it will generate the files for
7:25
you So it this is the difference between
7:28
the edit and the agent mode So at every
7:31
step it will ask you whether you want to
7:33
continue or not So you will see this
7:36
command Now you say continue And now it
7:39
will
7:41
basically execute this command to create
7:43
a brand new React
7:46
application And once it is done it will
7:49
move to the next step You can see on the
7:51
left hand side the React project is
7:53
created And then it is telling us to
7:55
execute Can I execute this command so at
7:58
every step it will ask you and just
8:01
click continue And now it is installing
8:04
the npm
8:06
dependencies And uh after that it will
8:08
write the code So this is the difference
8:11
between the agent and the edit mode Uh
8:14
in agent mode it will ask you at every
8:17
point whether you want to continue or
8:19
not So this is the
8:21
advantage and
8:24
uh with this you can generate any sort
8:27
of application uh just ask the question
8:31
and you can see all the things are doing
8:33
it
8:35
automatically So once it is done right
8:43
here it is creating these files here of
8:46
the calculator If you see
9:03
So there is some kind of limitation of
9:06
how much request you can make You can
9:09
read the documentation of GitHub copilot
9:12
This is a newly launched mode here agent
9:14
mode So I think only five requests are
9:19
there per our basis
9:30
So you can see sometimes it actually
9:33
stuckss as well because it's a newly
9:35
launched feature So that's why it can
9:38
draw create some loading time as well So
9:42
you can pause
9:45
and start the application as well
9:51
Now create the code and start the app So
9:54
at any point of time you can even stop
9:56
this as well and then it will
9:58
automatically detect where it left off
10:01
and then it will actually start from
10:04
that location So that's the advantage of
10:06
using agent mode So now it
10:09
is creating that scientific
10:15
calculator So you can enable this agent
10:17
mode guys It's very helpful It will save
10:20
you a lot of time in writing the code
10:22
and uh uh building out your applications
10:26
in very easy time You can see it is
10:29
writing this code
10:46
So now it is telling us to can I execute
10:49
this command So I will say continue So
10:51
it will run this project in the browser
10:59
So So if you go to the local host
11:12
5173 So this is your scientific
11:14
calculator in ReactJS You will see that
11:18
it is perfectly
11:19
working So this is a very simple example
11:22
that I showed you of a very basic app
11:24
but uh using this agent mode you can
11:28
basically create any sort of app and uh
11:30
it will save you a lot of time So this
11:32
is a tutorial on how to using it and
11:34
enabling it It's a fairly new feature
11:38
and uh if you like this feature please
11:40
comment on this video and also hit the
11:42
like button and uh also check out my
11:45
website freemediattools.com which
11:48
contains thousands of tools regarding
11:50
audio video and image
#Programming
#Software
#Development Tools
#Scripting Languages
#Intelligent Personal Assistants