GitHub for Beginners: Code review and refactoring with GitHub Copilot

Welcome to the next episode in our GitHub for Beginners series, where we’re diving into the world of GitHub Copilot. This is our eighth and final episode, and it’s been quite a journey. We’ve covered a lot of different topics showcasing the power of GitHub Copilot, and you can check out all our previous episodes on our blog or as videos.

Today we’re covering that important step of code review—getting a second pair of eyes on your code. This can help catch bugs, improve code quality, and ensure consistency. We’ll also talk about refactoring code—restructuring existing code without changing its functionality. This can make things more efficient or more readable for those who need to understand it later (even if that’s yourself).

In any development project, maintaining a clean and efficient codebase is crucial to make future work easier. But in reality, things can quickly become messy as you’re focused on making it work. That’s where Copilot can come in handy. It doesn’t just assist you in writing code, it also makes the review and refactoring process smoother and more efficient.

Refactoring code

Suppose that you have a function that is long and difficult to understand. Refactoring code can make it easier to understand and ensure pieces of it aren’t too unwieldy to follow.

To use GitHub Copilot to help you with this refactoring task, open up Copilot Chat and do the following:

1. Highlight the function you want to refactor in your code editor.
2. In Copilot Chat, send the prompt please provide refactoring suggestions.
3. Review the changes that Copilot suggests. It might break the code up into smaller pieces or optimize the logic for better performance. It might even update variable names to be aligned with your naming conventions.
4. Once you’re comfortable with the suggested changes, click the Apply in editor button to apply the changes and have Copilot automatically update the file.

This works well for small changes, but there’s no reason to stop there. This is just if you want to focus Copilot’s attention on a specific area of your code. You can also have it look across entire files or your project. For example, take a look at this dashboard component. Let’s say you want to improve it.

To do so, open up the component in your editor and send Copilot Chat the following prompt:

How can I improve this code?

Copilot will then give several suggestions on ways the code can be improved. You can review these suggestions and even ask Copilot to explain each step in greater detail. When you’re finished, click the Apply in editor button to have Copilot make the necessary changes.

To see this in action, check out the video version of this episode. Just remember that since Copilot is a generative AI tool, the suggestions you see might not match those in the video exactly.

You can take this a step further by asking specific and direct questions. For example, you might want to make the data fetching logic reusable across components by creating a custom hook and centralizing the logic. To do this, create a new chat conversation and ask it the following:

How can I extract the data fetching logic into a custom hook?

Copilot generates refactored code that allows you to extract the logic out of the Dashboard component into a new hook directory that you can use in multiple components in the app. This makes it much more reusable! To follow through on this:

1. Save the changes in a new file by selecting … > Insert into New File.
2. Import the hook into the dashboard file.
3. Remove the old code.

Now what if you wanted Copilot to take a look and make sure you didn’t have a bunch of redundant code in your file? Just ask it.

Is there any redundant code in this file?

Copilot scans your code and identifies any redundancies that can be corrected. After reviewing the suggestions, go ahead and apply them to tighten up your code and make it a bit cleaner.

Reviewing and refactoring your code with GitHub Copilot is a great way to do an initial overview of the work you’ve done. You can also ask Copilot for performance improvement suggestions, how to make functions more modular, have it add comments, or upgrade syntax to be more modern. If you can think of a question, ask Copilot and see what it can do.

Code reviews in github.com

If you have the proper access, you can also get GitHub Copilot code reviews directly on github.com to make the process even more seamless. First, open up a pull request. Under the “Reviewers” section in the top-right corner, you’ll notice Copilot listed as a possible reviewer. Click Request to have Copilot review your code.

Once Copilot finishes the review, scroll down on the pull request to see any suggestions that it makes. It’s important to note that Copilot always leaves a Comment review, and never an Approve or Request changes review. This means that Copilot’s reviews will never be required nor block merges.

To accept any of Copilot’s suggestions, click Commit suggestion at the bottom of the specific suggestion you’d like to integrate. This pulls up a context menu. Click Commit changes and GitHub will update your pull request with that change.

You can also batch several suggested changes by clicking the Add to batch button under individual suggestions so they are pulled into one change.

After you’ve integrated any suggestions and made any changes, you can request another review from Copilot by clicking the circular arrows in the “Reviewers” box next to Copilot’s name.

With Copilot code review, you can have Copilot perform a preliminary review of your code before asking your team for that final code review. 

Key components and limitations

The key components of using Copilot for code review and refactoring can be broken down into five areas:

• Automated suggestions: Copilot suggests improvements and optimizations as you review your code.
• Consistency checks: Copilot helps maintain coding standards by suggesting consistent naming conventions and structures for your functions.
• Refactoring assistance: Copilot provides actionable refactoring suggestions, whether it’s simplifying complex functions or reorganizing your codebase.
• Error detection: Copilot can spot potential bugs or inefficiencies that you might have missed while building.
• Comment support: Copilot helps generate clear comments in your code, making it easier to understand for others.

While GitHub Copilot can do a lot, it’s important to keep in mind that you are the pilot, and we call it Copilot for a reason. It’s a powerful tool, but it does have some limitations. First and foremost, it relies on the context you provide, so unclear or poorly documented code might lead to less effective suggestions.

In addition, while Copilot can catch many issues, it’s not a substitute for a thorough human review. Always double check the suggestions it provides to ensure they align with your project’s goals and standards, as well as your organizational policies.

Your next steps

GitHub Copilot is an invaluable assistant for code review and refactoring. It helps you maintain clean, efficient, and consistent code, saving you time and reducing errors. By integrating Copilot into your workflow, you can focus more on building great features and less on the nitty-gritty aspects of code maintenance.

If you’d like to dive a little deeper into using Copilot to help with code reviews and refactoring, here are some links to get you started:

• Improving code readability and maintainability
• Refactoring code with GitHub Copilot
• Refactoring for performance optimization
• Using GitHub Copilot code review
• Configuring coding guidelines for GitHub Copilot code review

Don’t forget that you can use GitHub Copilot for free! If you have any questions, pop them in the GitHub Community thread, and we’ll be sure to respond. Thanks so much for joining us for this season of GitHub for Beginners! Don’t forget to check out our previous episodes if you haven’t already.

Happy coding!

The post GitHub for Beginners: Code review and refactoring with GitHub Copilot appeared first on The GitHub Blog.

Source: Read More