VSCode
The most important tool for any programmer is a good code editor. While you could write code in any text-based editor (TextEdit, Notepad, etc.), you’ll be lacking some key features that code editors provide including:
- Syntax highlighting - Highlights different elements of code (keywords, variables, comments) in different colors to improve readability and understanding.
- Autocompletion - Provides suggestions for code as you type, helping to speed up coding and reduce typing errors.
- Formatting - Automatically formats code according to predefined styles or user-configured settings, ensuring consistency and readability across the codebase.
- Error Checking - Provides real-time feedback on syntax errors, potential bugs, and code quality issues, helping to catch and fix errors early in the development process.
- Etc... Code editors are packed with useful features.
In this course, we’ll start with the general purpose code editor VSCode (Visual Studio Code). This editor is popular, free, cross-platform and highly customizable via extensions. Later in the semester, we’ll also work with RStudio - a code editor optimized for working with R.
Download and install
To get started, download VSCode from https://code.visualstudio.com.
Once downloaded, run the installer and follow the instructions provided.
Themes
Color themes can be installed via Extensions, accessible from the activity bar on the left.
If you want your interface to look like what is shown in the videos, the theme I use is luxcium.pop-n-lock-theme-vscode. Feel free to use whatever theme you like.
Working with files
The file explorer (accessible from the activity bar on the left) is used to open project directories where you can navigate and work with your project files.
Settings
To access Settings in VSCode, click the cog icon on the bottom left then choose Settings.
VSCode has a lot of settings available, so take advantage of the search bar up top when looking for something.
For this course, you should adjust the following three settings:
Setting 1 - Auto Save
Set Auto Save to onFocusChange. This will make it so your files are automatically saved whenever you switch contexts (e.g. file tabs, or out of VSCode into another window).
Setting 2 - Format on Save
Enable Format on Save, so that VSCode’s auto-formatter is regularly run on your code files keeping them tidy.
Setting 3 - Mouse Wheel Zoom
Enable Editor: Mouse Wheel Zoom, which will allow you to adjust the editor pane’s font size by holding down cmd (Mac) or ctrl (Windows) and scrolling your mouse at the same time.
Extensions - Live Share
There are many extensions that can be added to VSCode to extend its base functionality.
One extension we will utilize in this course is Live Share, which makes it easy to share your current code session with a collaborator (e.g. classmate or instructor).
Click the block icon from the activity bar on the left to access Extensions.
Search for Live Share and click Install on the info page.
Once installed, you will see the Live Share icon in your activity bar on the left.
Within the Live Share options, you can choose Share (Read/Write) to begin code sharing. This will copy a link you can share with classmates/instructors that will give them access to your code session.
During class, the quickest way you can share this URL with others is to go to psy1903.com/share where you can paste the URL. Your instructor/classmate can then visit the same URL and copy that URL to access your shared code session.