Check out a free preview of the full Visual Studio Code Can Do That? course

The "Editor Tour & Basic Key Commands" Lesson is part of the full, Visual Studio Code Can Do That? course featured in this preview video. Here's what you'd learn in this lesson:

Burke tours the editor panels, status bar, and explorer, and gives an overview of the basic keyboard commands necessary to move around the editor.

Preview
Close

Transcript from the "Editor Tour & Basic Key Commands" Lesson

[00:00:00]
>> Burke Holland: I wanna talk about some terminology before we get started, because I'm gonna throw around a lot of terminology today, and it can be a little confusing. So let's just start with the parts of the editor. On the left hand side here we have something called the activity bar.

[00:00:15]
The activity bar opens the side bar. This is called the side bar. And these different buttons here, put different things in the sidebar. The four main ones are the file explorer, the search, the source control, the debug, there's five and the extensions. Down here below that any extensions that you install That have activity bar buttons will be installed here.

[00:00:44]
So sometimes when you install an extension like Docker, it puts a whole Docker view over here on the side. So we have the activity bar and we've got the sidebar. Up at the top here we have the tabs and the editor space. So this is the main editor space or where you write your code.

[00:01:00]
And then down here at the bottom. This is called the status bar. And you can click on these items down here, and some of them have different menus and will pop those menus up when you click on them. The last thing you need to know is that we have an item, called the panel.

[00:01:16]
And the panel is this thing right here that is at the bottom that contains problems, output, debug console, but most importantly, the terminal. So our essential keyboard shortcuts for working inside of this space are command or Ctrl+B, to expand and collapse the sidebar which you're gonna do a lot.

[00:01:36]
Another one is the command palette which is Command or Control Shift P, and that opens this thing right here. Another one is the file switcher, which is just command P, which allows you to switch between files. And then another one is the terminal or the panel if you want to show the terminal it's control, On both machines back tick will show and hide the terminal.

[00:02:02]
You can also use command J which shows and hides the bottom but, if you wanna get directly to the terminal you wanna use the back tick control Bactec. So those are the main VS code, keyboard shortcuts that you need to know. And I'm gonna go ahead and open our first exercise here.

[00:02:21]
Let's let's go to exercise one. Actually, let's open you know when I'm gonna open the whole thing in insiders. So Insiders, just like regular VS Code, has a path command that you can put in, and that will open us up here.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now