No menu items!

How to Install and Use CodeGPT in VS Code

VS Code has several useful extensions that enhance its functionality and provide features for development workflows. One of these extensions is CodeGPT, which brings the power of generative artificial intelligence to VS Code.

CodeGPT allows you to manipulate your code effortlessly. You can use it to generate code from comments, refactor it, debug it, document it, or even explain what a certain block of code does.

Installing and Configuring CodeGPT

To install CodeGPT, launch VS Code. Then click on the extensions icon on the left sidebar of your window. Then search for Code GPT​​​​​​. It should be the first in the search results. Make sure it has a blue verification badge.


Click on the Install button to add it to VS Code. Having installed CodeGPT, you now need to connect it to a large language model. This model is what gives it its generative capabilities.

To establish the connection between CodeGPT and the large language model, you need an API Key. In this guide, you’ll be using the OpenAI API. To get one proceed to the OpenAI API platform and log in. If you do not have an account, sign up for one. After logging in, select the API option on the page that appears.

OpenAI API service selection page

This will take you to the API homepage. In the top right corner, click on your profile and select the View API keys option.

OpenAI API homepage

Now, you will be directed to the API keys page. Click on the Create new secret key option. Then, name and generate your secret key.

OpenAI API key naming

This is the API key that you will use to connect the OpenAI large language model to CodeGPT. Copy it to your clipboard.

Proceed to VS Code and navigate to Settings > Extensions > CodeGPT​​​​​​.

CodeGPT configuration page in VSCode

From this page, you can configure how CodeGPT interacts with the large language model. You can choose your AI Provider, Max Tokens for each request, and the Model to use. Also, when you scroll further down you can also set the Temperature value.

Max Tokens help you control the length of the generated text. The Temperature value which is between 0 and 1 helps you control the randomness of the text in the model’s output. You are not limited to OpenAI LLM. You can use any of the language models in the AI Provider option, provided you have their API Key.

To enter your API Key, press Cmd + Shift + P on Mac or Ctrl + Shift + P on Windows to open the command palette. Then search for CodeGPT and select CodeGPT: Set API KEY.

CodeGPT API command on VSCode command palette

Click on it and paste your API key on the prompt that appears. Save it by pressing Enter. Finally, reload VS Code to start using CodeGPT.

Generating Code With CodeGPT

To demonstrate the CodeGPT code generation feature, you will create a calculator app using Python.

You can generate code with CodeGPT by the use of comments or using the chat CodeGPT chat window. To generate code from comments write a comment about what you would like CodeGPT to do in your script. Then with the cursor at the end of the comment, press Ctrl + Shift + I. CodeGPT will process the request and open a new window with the results.

CodeGPT generating code from a comment

You can then copy and paste the code into your script. This method is not tidy as the response has text on it.

To generate code by chatting with CodeGPT, click on the CodeGPT chat icon on the left sidebar. This will open a chat window.

CodeGPT chat window

Then input your request and click Send. In this case, the request is for a simple calculator. CodeGPT will process your request and generate your code in the chat window.

CodeGPT code generation in the chat window

Click on the “insert code” arrow to automatically paste the code into your script. As you can see, this method is more tidy. The generated code is as shown below:

 def add(x, y):
   return x + y
def subtract(x, y):
   return x - y
def multiply(x, y):
   return x * y
def divide(x, y):
   if y != 0:
       return x / y
       return "Error: cannot divide by zero"
print("Select operation:")
print("1. Addition")
print("2. Subtraction")
print("3. Multiplication")
print("4. Division")
choice = input("Enter your choice (1-4): ")
num1 = float(input("Enter the first number: "))
num2 = float(input("Enter the second number: "))
if choice == '1':
   print(num1, "+", num2, "=", add(num1, num2))
elif choice == '2':
   print(num1, "-", num2, "=", subtract(num1, num2))
elif choice == '3':
   print(num1, "*", num2, "=", multiply(num1, num2))
elif choice == '4':
   print(num1, "", num2, "=", divide(num1, num2))
   print("Invalid input. Please try again.")

When you run the code it works correctly. With just a single prompt, you were able to create a simple calculator.

Refactoring Your Code With CodeGPT

To refactor your code, select the code that you want to refactor, then right-click on it and select Refactor CodeGPT. In the Refactor CodeGPT dialog box, enter your prompt describing the refactoring that you want to perform. For example, you could enter “refactor this code to use a for loop instead of a while loop”.

CodeGPT will generate new code that implements the requested refactoring.

Explaining Your Code With CodeGPT

To explain your code, select the code that you want CodeGPT to explain. Then right-click on the highlighted code and select the Explain CodeGPT option.

CodeGPT code explanation on the chat window

CodeGPT will explain what the code does on the chat window.

Documenting Your Code Using CodeGPT

Documenting your code helps other developers read and understand your code. It can also help you understand your code in the future.

To document your code, select the code you want to document, then right-click on it and select the Document CodeGPT option. CodeGPT will generate documentation of the code in the chat window. You can then copy and paste the explanation into your documentation.

For inline comments, use the chat window to instruct CodeGPT to insert the necessary inline comments into your code. Instructing CodeGPT to insert inline comments to the functions in the calculator app produces the following results:

 def add(x, y):
   return x + y

def subtract(x, y):
   return x - y

def multiply(x, y):
   return x * y

def divide(x, y):
   if y != 0:
       return x / y
       return "Error: cannot divide by zero"

These are clear and correct inline comments.

Understanding How Generative AI Works

CodeGPT utilizes the power of generative AI for all its features. It may not always provide the correct information. Hence, you need to counter-check whether its results are correct. Understanding how generative AI works will help you become familiar with its strengths and weaknesses.


How to Use ChatGPT as a Detailed and Interactive Text-Based RPG

OpenAI’s ChatGPT is arguably the most advanced AI currently...

4 New Threats Targeting Macs in 2023 and How to Avoid Them

The past decade has witnessed a drastic change in...

What Are Improper Error Handling Vulnerabilities?

Do you know that little things like the errors...

5 AI-Powered Book Recommendation Sites and Apps to Find Your Next Read

Can ChatGPT find the best next book that you...

What Is Forefront AI and Is It Better Than ChatGPT?

Key Takeaways Forefront AI is an online...