Play Around With GitHub Copilot Through Visual Studio 2022 IDE

Try out GitHub Copilot to get a glimpse into the future of programming

Photo by Andy Hermawan on Unsplash

GitHub Copilot is an AI tool created by GitHub and OpenAI to support programmers.

As of today, GitHub Copilot is available as an extension for Neovim, JetBrains, and Visual Studio Code.

Despite being a technical preview, it “does especially well for Python, JavaScript, TypeScript, Ruby, Java, and Go, but it understands dozens of languages and can help you find your way around almost anything”, as reported on GitHub Copilot.

Generally speaking, if you are into data science, web development, and more broadly software, you should try this out.

GitHub Copilot extension on VS Code

Let’s play

In brief, GitHub Copilot does two things:

1. It will automatically suggest some code you may want to use while you type. Press tab to accept it.
2. If you are not happy with the first suggestion, keep typing or press Alt + ]to see the next suggestion. If Alt + ]doesn’t work you might have the same keyboard shortcut used by other extensions. E.g. Jupyter extensions might use Alt + ]. However, you can change shortcuts. In VS Code go to the menu under File > Preferences > Keyboard Shortcuts. (Code > Preferences > Keyboard Shortcuts on macOS).

Side note: I added a summary of the shortcuts at the end of the post.

I started by trying out some examples proposed in the documentation. According to the docs:

1. Create a new JavaScript (.js) file.
2. Type the following function header:

function calculateDaysBetweenDates(begin, end) {

and sure enough, GitHub Copilot automatically suggested an entire function as in the documentation:

This is literally what I’ve got, so I am using the screenshot from the documentation

Ok, too good and too easy.

I followed too many guides where everything was sunshine and rainbows until the moment I took a step out of the suggested path.

A walk in the neighborhood

I then typed the following:

function calculateDaysBetweenDates(begin, end) {

as the name suggests I would like to get the number of days between two dates.

This is similar to the previous function and I would expect it to work just fine. Sure enough, I got the following function:

Cool, but still very easy, in my opinion.

The context, in test.js, is very clear, and the name of the function too.

Just above this function, I had the previous function calculateDaysBetweenDates.

A walk into the wilderness

I decided to try something completely out of context.

When people start to code they usually create functions that output an area, or a volume, given some variables. So I simply typed:

function getVolume(

and booooooooom

Photo by Jeff Kingma on Unsplash

The outcome was less explosive but surely exhilarating:

So much hype for copy-pasting lol.

Actually, this opens the ground for something you should be aware of.

Some legal stuff

GitHub Copilot is trained on public GitHub repositories of any license! GitHub itself admits that a small portion of the code might be copied verbatim.

I noticed.

For this reason, they got a post titled GitHub’s automatic coding tool rests on untested legal ground on The Verge.

In that case, a developer who was trying GitHub Copilot noticed that when he asked to generate an About Me page Copilot proposed the following text:

“I love to learn new things and build things”

and the following code

I have a <a href="https://github.com/davidcelis"> Github</a> account

The problem is that davidcelis does exist and currently has nothing to do with Copilot!

At the moment, Nat Friedman, GitHub’s CEO, found a solution by declaring that “Training machine learning models on publicly available data is considered fair use across the machine learning community”.

And that’s all folks! No worries!

Should I think that, by extension, a model trained on publicly available data will always be publicly available?

We’ll see about that.

Back to our walk

I assume the lack of context was the problem while declaring getVolume so let’s start by giving some context.

I started by declaring a height variable and the result got immediately more interesting:

Adding variables for context

It is a fair assumption that when we declare some measure there might be some similar measures.

I accepted the suggestion of height = 100 and all the following suggestions regarding width and length!

Finally, I tried again my luck calculating a volume, with a more appropriately named function:

The function is a good one

Pretty cool! It seems there could be value in this tool!

Let’s test it with some typescript then!

Typing the volume

I started as follows

1. Create a new TypeScript (.ts) file
2. Type the following interface:

interface Volume { 
  height: 
}

And here is the suggestion I received:

Interface snippet

Pretty good! I mean, it seems pretty straightforward and to some extent, it reminds me of a combination of typescript and Angular Language Service.

However, it is much more than that.

By simply accepting all the suggestions I quickly created an interface with the right types.

With the right context, Copilot gives much more than completions and hints.

Copilot completes the function declaration with types

Things you may want to try

As said earlier, if you are not happy with the suggestion provided by Copilot, you can see more suggestions with the following shortcuts

• Show next suggestion — Alt + ] or Option (⌥) + ]
• Show previous suggestion — Alt + [ or Option (⌥) + [

You can also try the following shortcuts:

• Trigger suggestion — Alt + \ or Option (⌥) + \
• Open ten suggestions in a separate pane — Ctrl + Enter

There are some other things worth mentioning.

Copilot “can generate entire functions from something as simple as a comment”.

Here are a few quick screenshots:

Copilot autocompletes the comment

Not only did it change the suggestion while I was typing, but it also suggests more comments.

Copilot suggests appropriate comments

A few tabs and Enter later and after encouraging the shy copilot by typing const I can see this function:

Copilot suggests comments and a function that calculates the area of a rectangle

My take

I just started and it feels great.

Developers using Copilot on VS Code are also very positive.

As declared in the documentation, GitHub Copilot doesn’t write perfect code but “tries to understand your intent and to generate the best code it can, but the code it suggests may not always work, or even make sense”.

Despite this warning, the outcome is pretty impressive and I can’t wait to use it in some bigger and more complex applications.

There are some grey areas though.

Legal stuff…

Back to this?

Surely, this is not relevant for my applications but sure enough, some industries won’t jump on it.

Think about financial companies and generally speaking companies that handle very sensitive data.

…and security

According to some studies, GitHub’s Copilot may steer you into dangerous waters about 40% of the time.

Now the question is, would the average developer do better?

Just to be clear, GitHub declares that “GitHub Copilot may suggest old or deprecated uses of libraries and languages. You can use the code anywhere, but you do so at your own risk.”

On this point, they encourage developers who find “dangerous, biased, or offensive output”, to report it to copilot-safety@github.com.

What about accessibility?

I didn’t explore that but considering that many developers consider it an afterthought, some inline suggestions might be a great starting point.

Tests

As declared on GitHub: Tests are the backbone of any robust software engineering project. Import a unit test package, and let GitHub Copilot suggest tests that match your implementation code.

It is possible to use GitHub on test files as well.

How To Try GitHub Copilot In Your IDE

At this point, you should have no doubts about wanting to try it out.

Here are the steps you need to follow:

1. Sign up for the waiting list to get access to the GitHub Copilot technical preview. The team at GitHub is adding developers to the preview as they increase capacity
2. Once you receive a confirmation email from GitHub, install the extension in your IDE. In VS Code go to Extensions and search for GitHub Copilot. Do you have another IDE? Follow this guide.
3. You will be prompted to connect your GitHub account to the extension. Authorize GitHub Copilot Plugin and you are pretty much good to go.
4. One last thing you need to accept: the telemetry terms. You may want to read more about how GitHub Copilot collects and uses data. Otherwise, that’s it.

Shortcuts Recap

• Accept suggestion — Tab
• Dismiss suggestion — Esc or keep typing
• Show next suggestion — Alt + ] or Option (⌥) + ]
• Show previous suggestions — Alt + [ or Option (⌥) + [
• Trigger suggestion — Alt + \ or Option (⌥) + \
• Open ten suggestions in a separate pane — Ctrl + Enter