You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
@@ -20,23 +20,18 @@ import { Callout } from 'nextra-theme-docs'
20
20
about the
21
21
[difference between Sandboxes and Devboxes](/learn/devboxes/overview#difference-between-devboxes--sandboxes).
22
22
23
-
## What operating systems and devices are supported?
23
+
## What operating systems and devices are supported?
24
24
25
-
CodeSandbox is designed for Desktop/Laptop operating systems, browsers and display resolutions.
25
+
CodeSandbox is designed for Desktop/Laptop operating systems, browsers and display resolutions.
26
26
27
-
For those who may like to code on the move, we offer an [iOS app](https://codesandbox.io/codesandbox-for-ios) for iPhone and iPad.
27
+
For those who may like to code on the move, we offer an [iOS app](https://codesandbox.io/codesandbox-for-ios) for iPhone and iPad.
28
28
29
29
Our editor may work on other operating systems and mobile devices. While we will take onboard feedback from users on these platforms, we do not officially support them or recommend them for the optimum CodeSandbox experience.
30
30
31
-
## How do I make a sandbox private?
31
+
## How can I make a sandbox private?
32
32
33
33
There are several ways to set a sandbox as private. One universal way (that works both for sandboxes and devboxes) is to right-click a sandbox from the dashboard and select _Make sandbox private_.
34
34
35
-
<Callout>
36
-
A [Pro subscription](https://codesandbox.io/pricing) is required to
37
-
make sandboxes private or unlisted.
38
-
</Callout>
39
-
40
35
You can also change the privacy settings from the editor. How you do it will depend on whether you're using a sandbox or a devbox, as shown below.
41
36
42
37
### Make a browser sandbox private
@@ -75,7 +70,7 @@ recommend using a [Devbox](/learn/devboxes/overview).
75
70
76
71
Yes, we have instructions [here](https://codesandbox.io/docs/learn/environment/vm#configuring-nodejs-version) that tell you how to change the Node version. All recent server sandboxes run in a Devbox.
77
72
78
-
## How do I change the editor's theme?
73
+
## How can I change the editor's theme?
79
74
80
75
To change the [theme of a Devbox](https://codesandbox.io/docs/learn/editors/web/themes), click on the CodeSandbox logo at the top left, then go to Settings > User Preferences, and select a theme from the Themes dropdown. You can also do it from the [command palette](https://codesandbox.io/docs/learn/repositories/commandpalette).
81
76
@@ -113,7 +108,7 @@ Yes, you can use any database that has a Docker image available with a Devbox. S
113
108
114
109
No, you don't need to install Docker on your local machine. CodeSandbox has [built-in support for Docker](https://codesandbox.io/blog/introducing-docker-support-in-codesandbox), so you can use it directly in the online development environment.
115
110
116
-
### How do I access the database once it's running in a Docker container?
111
+
### How can I access the database once it's running in a Docker container?
117
112
118
113
You can access the database using the appropriate driver for your language or framework. Typically, you'll need to provide the hostname, port number, username, and password to connect to the database. If you want to connect locally to the database, you can use our VSCode integration to open the Devbox inside VSCode, and then forward the port of the database to localhost.
119
114
@@ -129,14 +124,14 @@ Yes, you can use Docker Compose in CodeSandbox to orchestrate multiple container
129
124
130
125
Yes, it's safe to use a database in CodeSandbox with Docker support, as long as you follow best practices for security and keep your database credentials private. Docker provides a secure and isolated environment for running containers, so your database is protected from external threats. We also prevent any connections to your Devbox without sign in if your Devbox is private.
131
126
132
-
### How do I troubleshoot issues with my database in CodeSandbox with Docker support?
127
+
### How can I troubleshoot issues with my database in CodeSandbox with Docker support?
133
128
134
129
If you're having issues with your database, you can check the logs of the container to see if there are any error messages. You can also run commands like `docker ps` and `docker logs` in the terminal to get more information about the container. Additionally, you can ask for help on the CodeSandbox community forums or consult the documentation of the specific database you're using.
135
130
136
-
## How do I change the font used in a browser sandbox?
131
+
## How can I change the font used in a browser sandbox?
137
132
138
-
Ensure the font you want to use has been installed on your computer,
139
-
then put the name of it first in the comma-separated list under 'Editor: Font Family' from
133
+
Ensure the font you want to use has been installed on your computer,
134
+
then put the name of it first in the comma-separated list under 'Editor: Font Family' from
140
135
File > Preferences > Settings in the editor.
141
136
142
137
<Callout>
@@ -159,14 +154,6 @@ Yes. While our Repositories only have built-in push and sync capabilities for Gi
159
154
160
155
To do that, use our terminal to `git remote add` the remote repository and then add your credentials for it. You can also add the authentication details to the CodeSandbox microVM using [environment variables](https://codesandbox.io/docs/learn/environment/secrets).
161
156
162
-
## How do I cancel my Pro or Patron plan?
163
-
164
-
For Pro users, once you've logged in, you can downgrade your plan on the
165
-
[Settings page](https://codesandbox.io/dashboard/settings) once you've selected your Pro workspace.
166
-
167
-
If you're on one of our legacy Patron plans you can cancel
168
-
your subscription on the [Patron page](https://codesandbox.io/patron).
169
-
170
157
</WrapContent>
171
158
<WrapContent>
172
159
## What to do about that recurring trust modal?
@@ -201,6 +188,7 @@ If you have additional questions or need support, please use the community [Disc
201
188
<WrapContent>
202
189
203
190
### What is the current state of CodeSandbox for iOS?
191
+
204
192
CodeSandbox for iOS support and maintenance is currently suspended.
205
193
206
194
CodeSandbox is currently unable to update the iOS experience at the rate required to keep up with the changes happening on the web editor. As a result, we have decided to discontinue support for the iOS app until we are able to provide an experience on par with the web editor. This does not remove the app from your device or prevent you from opening it if you already have it installed.
@@ -246,6 +234,154 @@ The application uses a Node.js port that hasn’t been upgraded to Node.js 14 as
246
234
### Why can't I make any changes to my project?
247
235
248
236
You likely have a protected branch selected (i.e. `main`). Forking a branch will create a new one where you can make changes.
237
+
238
+
</WrapContent>
239
+
240
+
<WrapContent>
241
+
242
+
## I can't log in to my account - what should I do?
243
+
244
+
If you're having trouble logging in, fill out our [Support form](https://codesandbox.io/support) by picking "Account Management" and "Login Issues". This will ensure we prioritize your request.
245
+
246
+
## How can I update my account's name and username?
247
+
248
+
You can edit your name or username from your [Dashboard](https://codesandbox.io/dashboard/):
249
+
250
+
1. Click your avatar at the top right.
251
+
2. Click "User settings".
252
+
3. Click "Edit" under "Account details".
253
+
4. Make the necessary changes and click "Save".
254
+
255
+
## How can I add team members to my workspace?
256
+
257
+
To add a new member to your workspace:
258
+
259
+
1. Click the "[Invite members](https://codesandbox.io/t/overview)" link shown at the left sidebar of your [Dashboard](https://codesandbox.io/dashboard/).
260
+
2. Input the username or email you wish to add in the input box.
261
+
3. Select the user role.
262
+
4. Click "Add member".
263
+
264
+
The user will receive an email invitation and in-app notification asking them to confirm.
265
+
266
+
## How can I leave or delete a workspace?
267
+
268
+
You can leave or delete a workspace from the "Overview" tab of your [Workspace Settings](https://codesandbox.io/t/overview), by clicking on "Leave workspace", or "Delete workspace", respectively.
269
+
270
+
There are some cases where leaving a workspace is not permitted.
271
+
1. You are the only workspace member with admin rights: Every workspace requires at least one admin member. Before you can leave the workspace, you must assign a new admin.
272
+
273
+
2. You are trying to leave the only workspace connected to your account: Every account must be associated with at least one workspace. If you want to leave the only workspace connected to your account, you may create a new workspace and then leave the workspace you want to be disassociated with. Alternatively, deleting your account will remove you from any workspaces that you are a member of.
274
+
275
+
## How can I change my account's email address?
276
+
277
+
Updating an account's email address requires us first to validate account ownership.
278
+
279
+
To validate your identity and request the email update, follow these steps:
280
+
281
+
1. Log in to your existing CodeSandbox account. From the Dashboard, click your avatar at the top right, then "User settings", and note the username and email you see right next to your avatar in that new modal.
282
+
283
+
2. Fill out our [Support form](https://codesandbox.io/support) by picking "Account Management" and "Change Email Address". In the text field, share the account's username and current email address.
284
+
285
+
3. Send another email to [email protected] from your new email address while referencing your intention to update the account's email address (feel free to include your current account's email address in CC).
286
+
287
+
These will be enough to verify your identity and allow us to update the email address.
288
+
289
+
## How can I unsubscribe from your mailing lists?
290
+
291
+
Every email we send includes an "Unsubscribe" link on its footer that allows you to unsubscribe from our communications. However, you can also globally unsubscribe from your [Dashboard](https://codesandbox.io/dashboard/):
292
+
293
+
1. Click your avatar at the top right.
294
+
2. Click "User settings".
295
+
3. Click "Notifications"
296
+
4. Turn off "Send me occasional news and product updates via email".
297
+
298
+
## What happens if I delete my account?
299
+
300
+
When you delete your CodeSandbox account, all your workspaces and any Sandboxes, Devboxes or repositories of which you are the author will be removed.
301
+
302
+
## How can I delete my account?
303
+
304
+
<Callout>
305
+
If you have an active Pro subscription, make sure you [cancel it](/faq?tab=pro-subscription) before you delete your CodeSandbox account.
306
+
</Callout>
307
+
308
+
You can delete your account from your [Dashboard](https://codesandbox.io/dashboard/):
309
+
310
+
1. Click your avatar at the top right.
311
+
2. Click "User settings".
312
+
3. Click "Request account deletion".
313
+
314
+
## How can I exercise my right to be forgotten?
315
+
316
+
Fill out our [Support form](https://codesandbox.io/support) by picking "Account Management" and "Data Deletion Request". In the text field, share the account's username and current email address, so we have proof of your ownership.
317
+
318
+
</WrapContent>
319
+
320
+
<WrapContent>
321
+
322
+
## How can I edit my billing information?
323
+
324
+
You can edit your billing information from the "Overview" tab of your [Workspace Settings](https://codesandbox.io/t/overview) by clicking on "Edit billing information", under "CodeSandbox Pro".
325
+
326
+
## How can I add or update a billing contact?
327
+
328
+
Workspace admins can assign a "Billing Manager" role to a workspace member. This role is cumulative with any other permission levels. Billing Managers will receive communications about billing and be able to manage the subscription.
329
+
330
+
An admin can assign a Billing Manager from the "Overview" tab of your [Workspace Settings](https://codesandbox.io/t/overview):
331
+
332
+
1. In the "Workspace members" list, click the `...` shown at the right of the corresponding username.
333
+
2. Click "Manage membership".
334
+
3. Tick the "Billing Manager" checkbox and save.
335
+
336
+
## I'm having problems with my payment - how should I proceed?
337
+
338
+
First, check if the payment method associated with your subscription has expired or is facing any issues.
339
+
340
+
You can check or edit your payment methods from the "Overview" tab of your [Workspace Settings](https://codesandbox.io/t/overview) by clicking on "Edit billing information", under "CodeSandbox Pro".
341
+
342
+
If everything seems to be in order but you're still having issues with the payment, fill out our [Support form](https://codesandbox.io/support) by picking "Pro Subscriptions" and "Payment Problems". This will ensure we prioritize your request.
343
+
344
+
## Can I change my subscription?
345
+
346
+
Yes, you can upgrade or downgrade your plan at any time from the settings page.
347
+
348
+
349
+
## How can I add more credits?
350
+
351
+
You can add more credits from the "Plan & Billing" tab of your [Workspace Settings](https://codesandbox.io/t/billing):
352
+
353
+
1. Click "Manage addons", under "Plan".
354
+
2. Select the VM credit package(s) you'd like to purchase.
355
+
3. Click "Next" and then "Confirm changes".
356
+
357
+
## Can I keep my legacy per-user Pro plan?
358
+
359
+
Absolutely! You can choose to keep your legacy Pro plan until further notice. In case we require any change to your subscription in the future, rest assured that we will give you two months’ notice so you can accommodate the changes. If you wish to upgrade, follow the steps shown in our [upgrade flow](https://codesandbox.io/upgrade).
360
+
361
+
## How can I view my invoices?
362
+
363
+
All your invoices will be automatically sent to the email address associated with your subscription. If, for some reason, you do not have access to those emails, you can request these invoices manually:
364
+
365
+
1. Fill out our [Support form](https://codesandbox.io/support) by picking "Pro Subscriptions" and "More Information".
366
+
2. In the text field, provide details about the subscription and additional information that serves as proof of your association to it (transaction ID, last four digits of credit card, date and amount of the last charge).
367
+
3. Submit the request.
368
+
369
+
Our Support team will analyze the request and get back to you.
370
+
371
+
## What happens if I cancel my Pro subscription?
372
+
373
+
When you cancel your CodeSandbox Pro subscription, it will be marked for cancellation at the end of your current billing period. This means you can keep using your Pro benefits until that date, after which the Pro subscription will not be renewed.
374
+
375
+
## How can I cancel my Pro subscription?
376
+
377
+
You can cancel your Pro subscription from the "Overview" tab of your [Workspace Settings](https://codesandbox.io/t/overview), by clicking on "Cancel Subscription", under "CodeSandbox Pro".
378
+
379
+
## How can I get a refund?
380
+
381
+
As specified in our [Terms of Service](https://codesandbox.io/legal/terms), we typically do not offer refunds. However, users in the EU or Turkey can [request](https://codesandbox.io/support) a refund within 14 days of their initial purchase.
382
+
383
+
Please note that the refund option is no longer available if you've used up to 50 credits after your Pro subscription or add-on.
description: Introduction to a customized version of VS Code for the web with built-in CodeSandbox features.
4
+
---
5
+
6
+
import { Callout } from'nextra-theme-docs'
7
+
8
+
# VS Code for the web
9
+
10
+
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.
11
+
12
+
The web editor looks and functions like VS Code for the web, with a few built-in CodeSandbox tools.
13
+
14
+

15
+
16
+
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.
17
+
18
+
The web editor also comes with a CodeSandbox Devtool extension which provides access to all the unique Code Sandbox features (more on that later).
19
+
20
+
In the Terminal panel, you can see all the running tasks, private terminals, and shared terminals (managed by CodeSandbox).
21
+
22
+
While the layout is entirely customizable, the standard layout opens previews, and support tools like documentation and setup tools in the right editor panel.
23
+
24
+
## Things to know when switching over
25
+
26
+
All CodeSandbox DevTools, such as previews, tasks, and shared terminals, are now 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, just like before. 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.
27
+
28
+
## Tasks, Terminals and Previews
29
+
30
+
Preview ports, Tasks and shared terminals are controlled through the devtool extension in the sidebar.
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.
37
+
38
+
**Previews**
39
+
40
+
Tasks that spin up previews will be accessible in a port listed under `Previews`
41
+
42
+
You can also see the list of ports in the terminal panel under `Ports`
43
+
44
+

45
+
46
+
**Terminals**
47
+
48
+
There are three types of terminals:
49
+
50
+
1. 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.
51
+
52
+
2. 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.
53
+
54
+

55
+
56
+
3. Shared terminal: In the sidebar, you can open a shared terminal. This terminal is managed by Pitcher, allowing others to see it.
0 commit comments