Editors

Productivity is key when working in an editor. For this reason, we have embedded our CodeSandbox features within the powerful and well loved VS Code. There are two editor versions to choose from - web and desktop. All Sandboxes open in the web editor by default. However, you can select your preferred editor when you open a new VM Sandbox or import a repo.

Web Permalink for this section

The web editor is a customized version of VS Code for the web (opens in a new tab). This hybrid editor provides the familiarity and comfort of VS Code without leaving CodeSandbox. All CodeSandbox DevTools, such as previews, tasks, and shared terminals, are nested under the “CodeSandbox DevTools” panel on the left sidebar. From there, you can manage all these DevTools when needed, but most of these actions will still be performed automatically. For example, if your project has a task configured that runs the dev server on VM startup, it will automatically open the preview for you when you open the project.

Desktop Permalink for this section

VS Code Desktop offers the local VS Code experience with your own configurations and shortcuts whilst remaining connected to the CodeSandbox development environment.

Install the CodeSandbox VS Code extension and open any branch or VM Sandbox directly in your VS Code editor.

Install VS Code Extension (opens in a new tab)

Which editor is right for you? Permalink for this section

Each editor brings its own benefits and drawbacks. Depending on the configuration you desire or the requirements of your project, you may find that one editor satisfies your needs more than the other.

[Getting started with VS Code Desktop](/content/docs/learn/editors/overview# "Getting started with VS Code Desktop"/index.html) [Web interface](/content/docs/learn/editors/web-interface "Web interface"/index.html)