VS Code comes with a simple and intuitive layout that maximizes the space provided for the editor while leaving ample room to browse and access the full context of your folder or project. Like many other code editors, VS 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 have opened. Configure IntelliSense for cross-compilingĪt its heart, Visual Studio Code is a code editor.You can learn more by reviewing the Status Bar extension sample. Status Bar Items can show text and icons and run commands on click events. Status Bar ItemĮxtensions can create custom StatusBarItem that display in the Status Bar. Read more about Webview in the Webview guide. They display next to text editors in the Editor Group areas. Webviews are highly customizable views built with HTML/CSS/JavaScript. With the contributes.views Contribution Point, you can add new Views that display in any of the View Containers. With the contributes.viewsContainers Contribution Point, you can add new Views Containers that display next to the five built-in Views Containers. Status Bar: The VSCodeVim extension adds a Status Bar Item in the Status Bar.Editor Group: The built-in Markdown extension adds a Webview next to other editors in the Editor Group.Side Bar: The built-in NPM extension adds a Tree View to the Explorer View.Activity Bar: The Azure App Service extension adds a View Container.VS Code provides various APIs that allow you to add your own components to the Workbench. 'Workbench' refers to the overall Visual Studio Code UI that encompasses the following UI components:

Visual studio code icon bar