Cloud IDE provides an environment that allows you to edit your code, while also allowing you to browse and discover the files in your directory or project.
By default, the user interface displays the Explorer view, but additional views are available. For more information about these views, see Using views to learn more about your environment.
Using the Explorer view
The default Explorer view enables you to get started with your project. From this view, you can perform the following tasks:
- Create, delete, and rename files and folders.
- Move files and folders with drag and drop.
- Explore all options with the context menu.
After opening a folder in the user interface, the contents of the folder are displayed in the Explorer view, which contains the following areas:
- Editor: Displays the file editing pane. You can open several editors, either vertically and horizontally.
- Sidebar: Displays different views, such as the Explorer view, to assist you while working on your project.
- Status Bar: Displays information about the opened project and the files you edit.
- Activity Bar: Enables you to switch between views. The activity bar also gives you additional context-specific indicators, such as the number of outgoing version control changes. For more information, see Activity Bar in the Explorer.
- Panels: Displays output or debugging information, errors and warnings, or an integrated terminal. You can move this panel to the right-hand side of the window for more space.
- Minimap: Displays a high-level graphical overview of your file’s structure. For more information, see Using the Minimap.
Tips for using the Explorer view
- To quickly search for a file by name and open it, use the following keyboard shortcuts (based on your operating system) to display the Quick Open search bar:
- macOS: Command+P
- Windows: Ctrl+P
- Linux: Ctrl+P
- To run a command-line tool in the context of the currently open folder, right-click (Windows/Linux) or Control-click (macOS) the file, and then click Open in Terminal.
- By default, hidden files and folders (such as
.git) are excluded from the Explorer view. You can configure your Cloud IDE to display these files by adding them to thefiles.excludesetting in the Files section of the preferences, as described in Settings and preferences.
The Explorer view preserves your folder selection, layout, and opened files. If you close your Cloud IDE on a machine and reopen it on the same machine, you can resume work without interruption. However, if you open it on a different machine, the IDE resets the Explorer view because the IDE does not preserve its settings across machines.
Cloud IDE displays open files as tabs at the top of the editor region. To learn more about tabbed headers, see Managing files by using tabs.
Activity Bar in the Explorer
The Activity Bar displays a vertical row of icons on the left-hand side of the user interface. You can navigate between views by clicking the view’s icon in the Activity Bar. You can rearrange the order of these icons by dragging them into your desired order. The currently selected view is indicated by a vertical bar.
Multi-selection in the Explorer
You can select more than one file in the Explorer view to perform actions (such as deleting, downloading, or copying) on several files or folders. To select files, use the information in the tab that’s based on your local operating system:
Outline view
The Outline view displays the symbol tree of the currently active editor in Cloud IDE. To display the Outline view, click the Outline view icon to the right of the Editor pane.
Side-by-side editing
You can open several editors simultaneously, and then arrange them horizontally or vertically, as needed. If you have already opened files for editing, you can drag the title of any existing tab to resize it, or reposition the tab to any side of the Editor region.
When working with more than one file, the Editor currently selected as active displays the content of its file. To open a file into a specific Editor, click anywhere inside the editor to select it, and then open a file.
Using the Minimap
The Minimap displays a high-level overview of your source code to the right of your Editor pane, helping you more easily navigate large files. You can click or drag the shaded area to jump to different sections of your file.
To customize your display settings, configure the following IDE settings for the Minimap option in the Text Editor section:
- To enable the minimap, select Enabled.
- To set the minimap location to the left of the Editor pane, set the value of Side to left.
Using indentation guides
You can configure Cloud IDE to display vertical lines as indentation guides to help ensure having consistent indentation levels in your code.
Use the following setting in the Editor section of the preferences to configure your guides, as described in Settings and preferences:
"editor.renderIndentGuides": true: Enables indent guides.