Code Interpreter with GitHub Co-Pilot in Visual Studio Code

Codecademy Team
Learn how-to use Github Copilot, the AI programmer assistant, in Visual Studio Code to seamlessly build an application.

Introduction

Welcome! In this tutorial, we will embark on an exciting journey to explore how GitHub Copilot, an AI-powered coding assistant, can enhance our programming experience in Visual Studio Code (VSCode). Whether new to programming or an experienced coder, GitHub Copilot offers an innovative way to streamline our coding process, especially in a versatile language like Python.

In this tutorial, we will explore GitHub Copilot and its integration with VSCode. We will familiarize ourselves with GitHub Copilot by building a simple yet practical Python application. By the end of this tutorial, we will have not only created our first Python app with the help of GitHub Copilot but also gained a valuable toolset to boost our programming efficiency and creativity.

Introduction to Visual Studio Code and GitHub Copilot

Visual Studio Code

Visual Studio Code is a powerful, free source-code editor developed by Microsoft. It is widely recognized for its performance, customization options, and extensive plugin support, making it a favorite among developers.

Key Features of Visual Studio Code

  • IntelliSense (Code Completion)
  • Debugging Support
  • Built-in Git Commands
  • Vast Extension Marketplace

Capabilities of GitHub Copilot

Code Suggestions

GitHub Copilot’s primary capability lies in its power to suggest entire lines or blocks of code as we type. By analyzing the context of our existing code and comments, Copilot can predict and offer the next snippet of code that logically follows. This feature is particularly useful for rapidly prototyping ideas, writing boilerplate code, and even learning new programming patterns and libraries.

Writing Tests

Apart from regular code, Copilot is also adept at writing test cases. Given a function or a class, Copilot can suggest relevant test scripts, helping us adhere to best practices like Test-Driven Development (TDD). These suggestions can be a starting point for robust test coverage, saving time and ensuring that your codebase maintains a high quality.

Offering Alternative Solutions

One of the standout features of GitHub Copilot is its ability to offer alternative solutions to coding problems. If the first suggestion does not fit our needs, we can prompt Copilot to provide different approaches. This not only gives us options to choose from but also exposes us to several ways to tackle a problem, enhancing our problem-solving skills.

Integration with Visual Studio Code

Seamless Experience within VSCode

GitHub Copilot is designed to integrate seamlessly with VSCode, offering an enhanced coding experience right within the editor. This integration means there is no need to switch between applications or disrupt your workflow to get coding assistance.

How Copilot Integrates

Inline Suggestions: As we type in VSCode, Copilot provides inline suggestions that appear directly in the editor. These suggestions can be accepted with a simple keystroke, making it easy to incorporate them into our code.

Easy Activation: Copilot can be activated or deactivated at any time, giving us control over when and how you use it. This flexibility allows us to use Copilot as a full-time assistant or an occasional helper.

Contextual Awareness: Thanks to its integration with VSCode, Copilot is contextually aware of the current project, files, and even the coding language we are using, allowing it to tailor its suggestions more accurately.

Adding the GitHub Copilot Extension

To locate and install the GitHub Copilot extension in Visual Studio Code, follow these simple steps:

  1. Open Visual Studio Code and navigate to the Extensions view by clicking on the square icon on the left sidebar or pressing ctrl + shift + x.

  2. Search for GitHub Copilot: In the Extensions view, type “GitHub Copilot” into the search bar. You will see the GitHub Copilot extension listed in the search results.

  3. Identify the Correct Extension: Look for the extension named “GitHub Copilot” published by GitHub. This is the official extension for the Copilot service.

Visual Studio Marketplace Github Copilot Page

Installation Process

Installing GitHub Copilot is straightforward but requires a GitHub account.

Install the Extension: Click on the GitHub Copilot extension from the search results and press the ‘Install’ button.

Authenticate with GitHub: After installation, you might be prompted to sign in with your GitHub account. This is necessary for Copilot to access its AI models and provide coding suggestions. If you do not have a GitHub account, you will need to create one. Then, you will need to sign up for Github Copilot here. Github Copilot is a paid Github feature that costs the individual about $10/month, but Github offers a 7-day trial period.

Complete the Authentication: Follow the on-screen instructions to authenticate Visual Studio Code with your GitHub account. This process usually involves signing in through your web browser and then allowing VSCode access to your GitHub account.

Github Login Page

Basics of GitHub Copilot

GitHub Copilot is powered by OpenAI’s Codex model, which was trained on a diverse range of public code repositories. It offers code suggestions in real-time as we type, based on the context of the code we are working on. These suggestions can be full lines of code or entire functions, and they adapt to the coding style and requirements of our project.

Navigating Copilot’s Features in VSCode

Autocompletion: As you start typing in VSCode, Copilot will automatically suggest completions for your code. This includes not only simple syntax but also complex code structures.

Accepting Suggestions: When a suggestion appears that you want to use, you can accept it with a simple keyboard shortcut (e.g., Tab).

Fine-tuning Results: Copilot may not always provide the perfect solution on the first try. You can refine your prompts or keep typing to guide it toward the desired outcome.

Practical Tips for Using Copilot

Use as a Starting Point: Treat Copilot’s suggestions as a starting point, which can sometimes require adjustments or optimizations.

Learn from Suggestions: Even if you do not use a suggestion, analyzing it can be a valuable learning experience, especially for understanding different approaches to a problem.

Building a Simple Python Application

Let’s build a basic Python application—a simple calculator that can perform basic arithmetic operations like addition, subtraction, multiplication, and division.

Create a New File

Open Visual Studio Code. Create a new Python file by going to File > New File. Save the file as calculator.py.

Initializing the Project

At the top of calculator.py, start with a comment or a simple print statement. For example:

# Simple Calculator in Python
print("Welcome to the Simple Calculator!")

Calculator.py File

Using Copilot to Build the Calculator

Defining Functions

Start typing a function definition for addition like so:

def add(x, y):

GitHub Copilot should suggest the complete function. It might look like this:

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

Function Suggestion Example 1

Accept the suggestion if it is correct by pressing tab, or modify it as needed.

Building Other Functions

Repeat the process for the subtraction, multiplication, and division functions. Begin by typing the function definitions like def subtract(x, y):, def multiply(x, y):, and def divide(x, y):.

Accept or modify the suggestions from Copilot. The functions might look like this:

def subtract(x, y):
return x - y
def multiply(x, y):
return x * y
def divide(x, y):
return x / y if y != 0 else "Error: Division by zero"

Github Suggesting Complete Code

Creating a User Interface

Start creating a user interface in the console. Begin by typing a print statement for the menu:

print("Select operation: 1.Add 2.Subtract 3.Multiply 4.Divide")

Use Copilot to help suggest the structure of your UI, which might include taking user input for the choice of operation and operands, and then calling the corresponding function.

Prompting Copilot

Copilot will continue providing suggestions per line until the objective of the prompt is met:

Suggested Code for Calculator

The completed code, just from suggestions, will resemble the following:

# Simple Calculator in Python
print("Welcome to the Simple Calculator!")
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):
return x / y if y != 0 else "Cannot divide by zero"
print("Select operation: 1.Add 2.Subtract 3.Multiply 4.Divide")
# Take input from the user and perform the operation(s) selected by the user in the above print statement
choice = input("Enter choice(1/2/3/4): ")
num1 = float(input("Enter first number: "))
num2 = float(input("Enter second number: "))
# Perform the operation(s) selected by the user
if choice == '1':
add_result = add(num1, num2)
print(f"The sum of {num1} and {num2} is {add_result}")
if choice == '2':
subtract_result = subtract(num1, num2)
print(f"The difference of {num1} and {num2} is {subtract_result}")
if choice == '3':
multiply_result = multiply(num1, num2)
print(f"The product of {num1} and {num2} is {multiply_result}")
if choice == '4':
divide_result = divide(num1, num2)
print(f"The quotient of {num1} and {num2} is {divide_result}")
else:
print("Invalid input")
# End of the program

Testing and Debugging

Test each function of your calculator by running the calculator.py file. You can do this in VSCode by right-clicking in the editor and selecting “Run Python File in Terminal.”

Run Caclulator.py in Terminal

Interact with your calculator in the terminal to check if all functions work as expected.

Calculator.py in Terminal

Iterative Development

If you encounter any bugs or errors, modify your code accordingly.

Use GitHub Copilot to suggest fixes or improvements. For example, if there is a bug in one of the functions, start typing a comment like # fix the bug in... and see how Copilot responds.

Continuously test and refine your application, paying attention to how Copilot adapts its suggestions to your code changes.

Enhancing Code Quality with GitHub Copilot

Understanding Over Reliance

While GitHub Copilot can be an incredibly powerful tool in our coding arsenal, it is important to be cautious of over-reliance on its suggestions. Always remember that Copilot is a tool to assist, not replace, our coding skills.

Critical Evaluation: Make sure to critically evaluate and understand the code that Copilot suggests. It is crucial to know why a particular piece of code works, not just how it works.

Customization: We may adapt Copilot’s suggestions to fit the specific requirements and style of our project. Do not hesitate to modify the code to better suit our needs.

Code Review and Refinement

Regular code reviews are essential, even when using an AI assistant like Copilot.

Best Practices: Review Copilot’s suggestions to ensure they align with coding best practices and the latest standards.

Optimization: Assess whether the suggested code is the most efficient and effective way to achieve our goals, and refine it as needed.

Effective Collaboration with Copilot

While GitHub Copilot can accelerate the coding process, it is important to balance its assistance with our learning and understanding.

Underlying Logic: Try to understand the logic and principles behind the code Copilot generates. This understanding is crucial for our development as programmers.

Problem-Solving Skills: Use Copilot as a learning tool. Try to solve problems on your own first, then compare our solution with Copilot’s suggestions.

Exploring Multiple Solutions

GitHub Copilot can be a great tool for exploring multiple ways to solve a coding problem.

Diverse Approaches: Use Copilot to generate different approaches to a problem. This can expose us to new methods and techniques.

Enhanced Learning: By comparing various solutions, we gain a deeper understanding of coding strategies and expand our problem-solving toolkit.

Improving Efficiency

GitHub Copilot excels at handling repetitive coding tasks, allowing us to focus our attention on more complex and creative aspects of our project. Use Copilot to generate boilerplate code, which can be particularly timesaving in large projects or when using frameworks. For standard implementations and patterns, Copilot can provide quick and reliable solutions.

Customizing Suggestions

One of the keys to effectively using GitHub Copilot is learning how to guide its suggestions to suit our needs. Provide clear context in the comments and code to help steer Copilot’s suggestions in the right direction. As we accept, reject, or modify suggestions, Copilot adapts to our preferences, leading to more tailored code over time.

Conclusion

GitHub Copilot represents a significant advancement in the realm of AI-assisted development. Its capabilities as an AI coding assistant can bring remarkable efficiencies and innovative approaches to our coding process. Whether we are tackling a new programming language, diving into a complex framework, or simply streamlining your daily coding tasks, Copilot offers a unique blend of assistance and insight. This tool not only speeds up the development process but also opens new avenues for creative coding solutions.

The field of software development is ever-evolving, with new tools and technologies constantly emerging. Embracing continuous learning and being adaptable is key to staying relevant and effective as a developer. Tools like GitHub Copilot are part of this dynamic landscape, and learning to integrate them into your workflow is a key step in your development journey.

Stay engaged with the broader coding community. Keep abreast of the latest developments in AI-assisted coding, share experiences with peers, and be open to learning from the insights of others. The collective knowledge and experience of the community are invaluable resources for continuous growth and innovation.

To see what else you can do with generative AI, checkout some of the topics covered in the articles located here: AI Articles.