Supercharge Your Coding with New GitHub Copilot Extensions for VS Code!

Microsoft's Visual Studio Code (VS Code) is a robust and adaptable source-code editor. It is popular among developers due to its lightweight and user-friendly interface. It enhances productivity by providing intelligent code completion, debugging, and version control integration with built-in support for many programming languages.

GitHub Copilot

VS Code's extensive extension marketplace allows users to customize their settings to meet their specific needs. GitHub Copilot is one such extension.

GitHub Copilot is an AI-powered code completion tool created in collaboration with GitHub by OpenAI. Copilot, which is integrated into Visual Studio Code, helps developers by proposing full lines or blocks of code as they write, considerably improving the coding process.

In July 2021, GitHub Copilot was integrated into VS code. And recently, it the some major changes and new features in the extension. In today's blog. Let's have a look at some of the GitHub Copilot features in VS Code.

Before diving totally into it, let's first quickly go through the major features that Copilot offers:

1. Inline suggestions: copilot starts generating code suggestions as soon as you start writing any code. These suggestions are intended to improve the efficiency of the programmer. If possible, the copilot may generate multiple suggestions while allowing coders to choose a suggestion or reject all of the suggestions. The suggestion will be shown in the grey text at first 
2. Natural language querying: You can interact with GitHub Copilot using Natural language queries such as comments or descriptions of the code you want to write, and Copilot will attempt to generate the code based on your intent 
3. Multi-language support: copilot supports a wide range of programming languages, allowing developers to work in different languages simultaneously 
4. Chat interface: Copilot in VS Code comes with a chat interface from which coders can get assistance while writing code. This is supported in two ways - u can either have chat in copilot chat view, or you can talk to copilot while writing code, inline in your files. 

Move chat sessions into the editor space

The chat session, which used to be located on the side in VS Code, is now moved into editor space which gives you a lot more room for activities.

Create workspaces with /createWorkspace

Working with numerous tech stacks, projects, customers, or domains is much easier when you have a distinct workspace with appropriate settings and setup.

With a single command, you can now instruct Copilot to create workspaces for common project kinds. Copilot will build you a directory structure. Here's how you can create a workspace with Next.js 13 app, TypeScript, and Tailwind CSS:

/createWorkspace Next.js 13 with /src folder, app directory, TypeScript and Tailwind CSS

Create notebook outlines with /createNotebook

Copilot also offers a way to make an outline for Jupyter notebooks, similar to what we just saw. Simply enter the /createNotebook command in the conversation and specify your needs.

As a sample, the following describes how to make an outline for a notebook that inserts data from a CSV file into a data frame:

/createNotebook load CSV into dataframe

Find regex searches with /search

Copilot is able to identify search regex patterns from your codebase with the latest update. This is an excellent tool that will save you a ton of time whether you are mass-replacing any portion of your code or troubleshooting.

For example, here's how you can generate regex for all .tsx files:

/search find .tsx files from /src directory

Apply changes directly with livePreview mode

Editor conversation has been enhanced, most notably by switching its default mode to "livePreview". Changes are made directly to the document in this mode, and a built-in diff view is displayed. Let's consider the following example:

The IUserFriendlyStatusItemEntry type now has a new attribute, and Copilot changed the isUserFriendlyStatusItemEntry check to reflect this.

An integrated diff view is used to display the response in the editor. By using the language extensions in VS Code, its right side may be edited and verified. This enables you to see any errors in the response (below, the isMarkdownString function is missing) and correct them before approving the recommendation.

Notebook improvements

The most recent upgrade to notebook editors improved the conversation functionalities. When used in a notebook document, Copilot can offer recommendations that are more relevant to the context of the notebook document. One example of using the code recommendations is to use variables or modules mentioned in earlier cells without having to create or re-import them.

When running notebook cells, Copilot now provides suggestions for unsuccessful executions of notebook cells. You may see them by choosing the Fix using the Copilot action from the cell status bar.

GitHub pull request and issues integration

As you complete a PR review, you can now use Copilot to automatically take ideas into account. Additionally, you can now use Copilot to automatically apply a review comment when the GitHub Pull Requests and Issues extension is installed and enabled while you are watching a review thread. For this, use the comment menu's Apply Suggestion with AI button.

Quick Question Experience

You may now ask Copilot about your code using the experimental Quick Question Experience in Visual Studio Code. You can use it by pressing Ctrl+Shift+Alt+I and inputting your query. Then Copilot will try to respond to your request by producing text or code.

The functionality is still under development, thus there may be some imperfections. However, getting instant help with your coding might be a helpful strategy.

Frequently asked questions:

How to effectively use Copilot:

There are several ways you can leverage GitHub Colilot to boost your productivity. Having Copilot in your toolbox helps you code more efficiently in less time. Here are some effective ways you can use GitHub Copilot:

1. Feedback and Improvements: GitHub Copilot is an evolving tool. Provide feedback to GitHub about your experiences, both positive and negative. This will help them refine and improve the tool over time.
2. Collaboration and Pair Programming: GitHub Copilot is an evolving tool. Provide feedback to GitHub about your experiences, both positive and negative. This will help them refine and improve the tool over time.
3. Code Documentation: Copilot can generate inline comments that explain code snippets. These comments can help you and others understand the code's purpose and functionality.
4. Contextual Comments: Write contextual comments in your code to give Copilot more information about what you're trying to achieve. This helps Copilot provide more accurate suggestions and code snippets.

How to set up GitHub Copilot

1. Make sure you have installed Visual on your machine. Also, make sure you have access to GitHub Copilot.
2. Download the GitHub Copilot extension from Visual Studio Marketplace.
3. Install the GitHub Copilot extension from the Visual Studio Code Marketplace.
4. In VS Code, Open the Command Palette (Ctrl+Shift+P) and type copilot: set subscription key.
5. Paste your subscription key into the prompt and click on the Enter key.
6. GitHub Copilot will be ready to use.