Using Frontastic sandboxes in the Frontastic studio

You can use Sandboxes in the Developer area to create and manage your sandboxes in the Frontastic studioFrontastic studio - The interface you use to manage, build, and edit all areas of your project and commerce sites. Previously known as `backstage`..

Once open, you'll see any sandboxes you've already created first, followed by the sandboxes that've been created by others in your project (by default this is collapsed).

Use the search to look for a particular sandbox (it's based on the name of the sandbox).

For how to work with sandboxes, see the Frontastic sandboxes article.

Creating a sandbox

To create a sandbox, follow the steps below.

  1. Click the blue add icon
  1. Input a Label (must only contain lowercase letters, numbers, and dashes)
  1. Input the Branch which has the desired backend features you want to work on (it'll default to your master branch if left empty)

📘

The Add public DNS option is automatically selected. You can't disable this.

  1. Select a region where you want the sandbox to be hosted
  1. Click Create

Your sandbox will then be brought up. This will take less than 10 minutes.

Halting a sandbox

Once you've finished working, you can Halt or Destroy your sandbox using the corresponding buttons:

If you halt your sandbox, you can bring it up again when you want to by clicking the Bring up button:

👍

Tip

You should regularly destroy your sandbox and then create a new one. It's actually a good idea to destroy the sandbox when you finish work and create a new one the next day to avoid issues.

Public sandbox

All sandboxes are created with public DNS enabled. This allows you to access the projects running on the sandbox directly from any web browser without the need for local developer tooling, such as Frontastic CLI. This can be useful to:

  • Show a certain feature (which only exists in a branch) to non-technical users
  • Work with code that strictly requires HTTPS connection (such as payment extensions)
  • Preview a certain production build without deploying it to your staging environment
  • Run automated tests towards a certain state of your code

Once a sandbox is running, you can click the See public URLs button to access the list of URLs for your sandbox.

You can then click the open icon to open the URL. Or the copy icon to copy the URL for you to share with your team.

Sandbox statuses

There are 5 statuses a sandbox can have:

  • Transient — the sandbox is being brought up, you can't use for development it yet
  • Running — everything is working normally and you can use this sandbox for your development
  • Halted — someone has pressed the Halt button, you can only use this sandbox if you press the Bring up button
  • Debuggable — the sandbox has errored and you can't use this sandbox for development, but you can use it to find out why it errored
  • Errored — the sandbox has fatally errored and you can't use this sandbox at all

For both the Debuggable and Errored states, you'll see a bug icon like the below:

If you click this icon, you'll open the logs where you can look into the components that failed to initialize. The failed components should already be expanded, or you can use the + icon to expand a component section and look into the issues.

Sandbox notifications

We recommend destroying your sandbox once you've finished work for the day. And then bring up a new one the next day. This is because out-of-date sandboxes can cause a lot of issues. Because of this, you'll see a warning notification when your sandbox is more than 3 days old:

You can continue working on this sandbox if you want to, but if you run into any errors, you should destroy the sandbox and create a new one to see if the issue still occurs.


Did this page help you?