VS Code for the web
The activity bar holds all the tools for managing your developer experience. The web editor will always contain the standard VS Code tools, namely the File explorer, Search, Source Control, Run and Debug and the Extension marketplace.
The web editor also comes with a CodeSandbox Devtool extension which provides access to all the unique Code Sandbox features.
In the Terminal panel, you can see all the running tasks, private terminals, and shared terminals (shared terminals are managed by CodeSandbox).
While the layout is entirely customizable, the standard layout opens previews, and support tools like documentation and setup tools in the right editor panel.
Tasks, Terminals and Previews
Preview ports, Tasks and shared terminals are controlled through the devtool extension in the sidebar.
Tasks
Tasks set in the tasks.json file will be listed in the Devtool extension. Here you can see all the tasks, run, stop or restart the tasks.
Previews
Tasks that spin up previews will be accessible in a port listed under Previews
You can also see the list of ports in the terminal panel under Ports
Terminals
There are three types of terminals:
-
Native terminal: This is managed by VS Code when you open a terminal. It is a private terminal to you that others don’t see.
-
Tasks: These are run by Pitcher, an internal CodeSandbox service. The output of a task is streamed to a terminal window and displayed as a VS Code task so it is easily distinguishable from a terminal.
-
Shared terminal: In the sidebar, you can open a shared terminal. This terminal is managed by Pitcher, allowing others to see it.
