Visual Studio Code adopts a common user interface and layout of an explorer on the left, showing all of the files and folders you have access to, and an editor on the right, showing the content of the files you opened.
Visual Studio Code has a simple and intuitive layout that maximizes the editor's space while leaving ample room to browse and access the full context of your folder or project. The UI is divided into five areas:
Each time you start VS Code, it opens up in the same state as when you last closed it. The folder, layout, and opened files are preserved.
You can open as many editors as you like side by side vertically and horizontally. If you already have one editor open, there are multiple ways of opening another editor to the side of the existing one.
Altclick on a file in the Explorer.
Ctrl+\to split the active editor into two.
Ctrl+Enter) from the Explorer context menu.
Cmd+Enter) in the Quick Open (
Ctrl+P) file list.
The editor has a navigation bar above its contents called Breadcrumbs. It shows the current location and allows you to quickly navigate between folders, files, and symbols.
The Explorer is used to browse, open, and manage all of the files and folders in your project. Visual Studio Code is file and folder-based. You can get started immediately by opening a file or folder in VS Code. The contents of the folder are shown in the Explorer.
In Explorer, you can create, delete, and rename, move files and folders with drag and drop.
The Activity Bar on the left lets you quickly switch between Views. You can also reorder Views by dragging and dropping them on the Activity Bar or remove a View entirely (right-click Hide from Activity Bar).
VS Code is equally accessible from the keyboard. The most important key combination to know is
Ctrl+Shift+P, which brings up the Command Palette.