Skip to main content

VSCode

VSCode is a lightweight development editor that can be equipped with plugins to enhance productivity. We use VSCode as our primary editor for any code development because it is so versatile and has a large number of plugins available.

Version Control

If you forgot all of the git commands, there is no need to worry. VSCode has built-in control for git with a friendly user interface. You can access this by clicking on the Source Control icon in the left sidebar, or by pressing Ctrl + Shift + G - G. This will show you all of the changes you have made to your code, and allow you to stage, commit, and push your changes to the remote repository.

Most of the complex git commands are hidden in a sub menu that you can access by clicking on the three dots in the top right corner of the Source Control panel. This will show you options to create branches, merge branches, and more. The typical workflow process should be doable fully in the GUI panel, by staging the files you want to commit with the + button, writing a commit message in the input box at the top, and then clicking on the checkmark to commit your changes. You can then push your changes to the remote repository by clicking on the Sync Changes menu and selecting. Sync Changes will both pull and push changes to the remote repository.

Avoid Sync Changes

Be careful when using the Sync Changes button, as it will pull changes from the remote repository and merge them with your local changes. If there are any conflicts, you will need to resolve them before you can push your changes.

It is recommended you avoid the Sync Changes button because it can preform something you are not expecting. It is best practice to explicitly select the Push or Pull option from the submenu.

You can see what branch you are currently on in the bottom left corner of the window. You can also switch branches by clicking on the branch name and selecting a different branch from the list. If you want to create a new branch, you can do so by clicking on the + button next to the branch name and entering a name for the new branch.

WPILib Extension

The WPILib extension for VSCode is a must-have for FRC development. It should be installed by default when you follow the WPILib setup instructions. This extension makes it easier to build and deploy robot code, as well as providing helpful features like code completion, syntax highlighting, and debugging support. All of the commands for building and deploying code are available in the Command Palette, which you can access by pressing Ctrl + Shift + P. You can then type in the command you want to run, such as WPILib: Build Robot Code or WPILib: Deploy Robot Code, and it will run the command for you.

Keyboard Shortcuts

Some of the more common commands will have keyboard shortcuts assigned to them. You can also create your own shortcuts for commands that don't. Feel free to customize your keybindings to make your workflow more efficient.

Console

VSCode has a built-in terminal that will give you outputs of commands run through the WPILib extension. You can also use for git commands if you are more comfortable with the command line. You don't need to have it open when editing (it does take up a good amount of screen real estate), but it is useful to have open when you are running commands or building code.

Troubleshooting

When building or deploying code make sure to watch the console for any errors that occur. The compiler or deploy tool typically give you a good idea what went wrong and how to fix it.

Cole's Tech Tips

  • Multi Cursor Editing/Selection:
    • You can add multiple cursors to your editor by holding Alt and clicking in the places you want to add cursors. This allows you to edit multiple lines of code at once.
    • You can also highlight a segment of code and press Ctrl + D to select the next instance of that code. This will allow you to edit all instances of that code at once. You can keep pressing Ctrl + D to select more instances of the code.
  • Jump to Definition:
    • You can jump to the definition of a function or variable by holding Ctrl and clicking on it. This will take you to the line of code where it is defined.
  • GitLens Extension:
    • The GitLens extension is a great tool for visualizing the history of your code. It shows you who made changes to a file, when they were made, and what the changes were. You can install it from the Extensions Marketplace in VSCode.
    • Once installed, you can hover over a line of code to see who last modified it and when. This concept is called "blame" and can be very useful for understanding the history of your code.