GitHub Copilot Tips and Tricks (en)

Transcript

1. GitHub Copilot Tips and Tricks
2. Yuichi Tanaka Strategic Solutions Engineer GitHub @yuichielectric
3. Today’s Topics Code Completion Chat Editor Integration Note: this session is based on Visual Studio Code 1.95 (Oct 2024 release).
4. Code Completion How To Provide Effective Context
5. GitHub Copilot LLM Context Suggestion
6. GitHub Copilot What is Context? Context is the information that GitHub Copilot extracts to provide code suggestion: - Code snippets (including comments) before and after the cursor in the current file - Relevant code snippets from other open files in your editor This information is prioritized, filtered, and then added to the prompt sent to the LLM. https://github.blog/2023-05-17-how-github-copilot-is-getting-better-at-understanding-your-code/
7. GitHub Copilot Keep Relevant Files Open Pinning files prevents accidental closures and ensures Copilot has access to the most relevant context. Examples: • Type definition files (.d.ts files) used in TypeScript projects • The code being tested when writing test code, or vice-versa
8. GitHub Copilot Names Matter When it comes to code completion, the names of your symbols like variables, functions, and classes are crucial hints for GitHub Copilot. Use consistent naming conventions and avoid using different names for the same concept. Also, be sure to take advantage of Copilot’s name suggestion feature, which we’ll discuss later.
9. GitHub Copilot To Get Better Suggestions • Review Multiple Suggestions ◦ Copilot may offer several options, so take a look at them all. ◦ Open the command palette and type “GitHub Copilot: Open Completions Panel” • Write Comments in Natural Language ◦ Describe the code you want. ◦ Include examples if necessary. ◦ For instance, “A function that returns ‘xx’ when given input ‘yy’” • Start Writing Code Yourself ◦ The code you start writing also provides context for Copilot.
10. GitHub Copilot Excluding specific files In settings UI (repo, org, or enterprise), you can specify files to be excluded from GitHub Copilot. Files that are excluded will: - Lose access to code completion - No longer be used as context for code completion You can exclude files regardless of whether they exist in a GitHub repo. https://docs.github.com/en/copilot/managing-copilot/managing-github-copilot-in-your-organization/setting-policies-for-copilot-in-your-organization/excluding-content-from-github-copilot
11. Chat Mastering Slack Commands, Agents, and Context Variables
12. Chat Chat with Copilot while referencing the context of your editor. Answers coding questions Explains code Generates unit tests Suggests code fixes Improves readability Translates languages
13. GitHub Copilot
14. Chat Chat with Copilot while referencing the context of your editor. Answers coding questions Explains code Generates unit tests Suggests code fixes Improves readability Translates languages
15. GitHub Copilot What is Used as Context? [Premise] Generally, open files are candidates for context. However, there are exceptions (explained later). 1. When text is selected in the editor: 　　 → The selected text is used. 2. When nothing is selected: 　　 → The text displayed in the active editor is used. 3. Specified by context variables (explained later)
16. GitHub Copilot Context automatically added in Jupyter Notebook In inline chat within Jupyter Notebook, the kernel state (variables and available packages, etc.) is automatically added as context.
17. Context Variables Context variables are used to specify the context by including them in your prompts, starting with the “#” symbol. Example) #file:BookDatabaseImpl.java The entire specified file is used as the context.
18. GitHub Copilot Key Context Variables #selection The currently selected text in the active editor. #file A specific file (a VS Code file selection UI will be displayed) #editor The currently displayed text in the active editor. #terminalLastCommand The result of the last command executed in the active terminal. #terminalSelection The currently selected text in the active terminal.
19. GitHub Copilot Example of Using Context Variables In the VS Code terminal, after displaying the diff with “git diff”, execute the following prompt: Please review the code from the following perspectives and point out any areas that need to be fixed: • Can the code be written more concisely? • Could this code cause compile or runtime errors? • Have any security bugs been introduced? #terminalLastCommand
20. GitHub Copilot
21. Specifying Context through GUI Clicking 📎 icon in the chat input allows you to specify the context from the following options: - Editor Selection - Terminal Selection - Entire Codebase - Specific Symbol - Specific File
22. Prompt examples https://docs.github.com/en/copil ot/example-prompts-for-github- copilot-chat
23. Custom Instructions (preview) You can predefine instructions in a file for code that will be generated in chat. While chat generates code by referencing files used as context, this feature can be used when you want to provide explicit instructions.
24. GitHub Copilot
25. Custom Instructions (experimental) Custom instructions for test generation can be specified as a separate configuration.
26. Slash Commands Commands that start with “/” in the chat. Shortcuts for common asks to Copilot. In the example, /explain is used to request an explanation of the code.
27. GitHub Copilot Key Slash Commands /explain Explains the selected code. /tests Generates unit tests for the selected code. /doc Generates documentation comments for the selected code (inline chat only). /fix Fixes problems in the selected code. /new Generates a template for the specified workspace.
28. Agents By including agents that start with “@” you can specify where to gather context from. Example) @workspace This part specifies the agent. In this example, even unopened files can be included in the context.
29. GitHub Copilot Key Agents @workspace Chat about the entire workspace. @terminal Chat about the terminal. @vscode Chat about VS Code.
30. Adopting code suggested in Chat 　　Apply using LLM to match code in the editor 　　Insert at the editor’s cursor position 　　Copy to clipboard
31. Model selection Currently you can choose from the following 5 models Note: This refers to the model used for chat functionality.
32. Copilot Edits (preview) A feature that allows you to specify a group of files you want to modify, then describe the desired changes in natural language, and Copilot will make changes across those files accordingly.
33. Editor Integration
34. Inline Chat Chat not only in the chat pane, but also directly within the editor. Code suggestions are inserted directly into the editor.
35. Inline Chat Example) Suggesting code fixes within the editor.
36. Inline Chat Example) Use /doc in inline chat to suggest a docstring.
37. Terminal Inline Chat Example) Listing the top 5 largest files in the src directory.
38. Code Fix Suggestions Copilot suggestions appear in the Quick Fix menu for errors highlighted in the editor (red underlines). Selecting “Fix using Copilot” applies the suggested fix.
39. Code Fix Suggestions Copilot suggestions appear in the Quick Fix menu for errors highlighted in the editor (red underlines). Selecting “Fix using Copilot” applies the suggested fix.
40. Renaming Symbols Executing “Rename Symbol” from the command palette suggests appropriate names based on the surrounding context.
41. Commit Message Suggestions Suggest a commit message that describes the current changes. References: - The last 10 commits in the repository. - The last 10 commits by the committer.
42. Code Review You can select areas you want reviewed, or receive a code review from Copilot on your current changes. Review comments will be displayed in the editor, and where possible, change suggestions will also be provided. You can choose to adopt these suggested changes.
43. GitHub Copilot
44. Code Review Review perspectives can also be specified as custom instructions.
45. Thank you