DEV Community 👩‍💻👨‍💻

Cover image for Getting Started with the Next Sandbox
Saul Costa for Next Tech

Posted on • Updated on • Originally published at next.tech

Getting Started with the Next Sandbox

I’m excited to announce the release of Next Tech’s newest product: Next Sandbox!

The Next Sandbox provides access to real-world computing environments in 2 seconds directly from your browser. Rather than installing the programming language or software you want to use on your computer, you can just click a button and access that language or software right away using a browser-based development tool.

We built Sandbox to solve two key problems we experienced ourselves as developers almost every day:

  1. Installing software is haaaaaaard. Even experienced developers can struggle with this and it’s something that can get in the way of trying out new ideas. It’s nice to have something work out of the box so you can focus on innovating.
  2. When you DO install software on your computer yourself — especially if you just want to test it — it can quickly clutter your environment. Maybe you want to try the newest version of Java, but installing it on your computer could cause issues with your current version.

The Next Sandbox addresses these issues by shifting the burden of installing software off of you and onto us. But that’s okay, we’ve been doing this for years! The Next Sandbox is based on the same infrastructure and interface that powers our product for teaching and learning tech skills, which is used by leading educational companies all around the world. In fact, the CS50 program at Harvard actually built their own sandbox atop our infrastructure!

Here’s what a sandbox for the Python programming language looks like when you first launch it:‌

img

In this getting started guide we’ll cover how to launch your first sandbox and some of the exciting things you can do with it.

Let’s dive right in!

First things first

To start, I recommend using this link to sign up for Next Tech if you haven’t already:

nt.dev?ref=ce315f8c

Next Tech uses minute-based pricing, where you pay 1 cent per minute you spend on the page with a sandbox open. You typically get $10 in free credits when you sign up (that’s 1,000 minutes of coding!), but if you use that link, you’ll get $15!

The account for that referral link also receives $5 each time a referred user activates their account. If you sign up with that link, you’ll be entered to win access said account, as we’ll be randomly selecting a referred user to win once the account value hits $250!

If you have any questions about our pricing, please don’t hesitate to comment directly on this post.

Okay, back to it. Once you’ve created a Next Tech account, you have two options for launching a sandbox:

  1. Use a nt.dev URL, like nt.dev/python. This will instantly get you into a fresh Python sandbox.
  2. Use the launchpad to select the environment you’d like. This page contains a number of details about each environment.

Initially your sandbox will display a directory tree viewer, code editor, and terminal. To add some code, just click the + icon or the ... next to your working directory, then New File:

img

You’ll be shown an overlay like this:

img

Go ahead and create a file named main.py. Don't worry about the tabs at the bottom yet — we'll cover those soon!

Or — if you want to get fancy — you can type touch main.py in your terminal. The Linux touch command will create a new file with the specified name.

Once you’ve created a file, it will be saved to your working directory (shown in the file tree as ~/workspace, the absolute path for which is /home/nt-user/workspace). So the full path for this file is /home/nt-user/workspace/main.py.

You can put any Python code you’d like here, but in case you don’t have some handy, here’s a quick calculator to get you started:

def add(x, y):
    return x + y

def subtract(x, y):
    return x - y

def multiply(x, y):
    return x * y

def divide(x, y):
    return x / y

if __name__ == '__main__':
    x = int(input('Please enter a number: '))
    y = int(input('Please enter another number: '))
    print(add(x, y))
    print(subtract(x, y))
    print(multiply(x, y))
    print(divide(x, y))

You can run this file from the terminal however you’d like, for example, python3 main.py. You'll be shown the output of the program, for example:

workspace $ python3 main.py
Please enter a number: 123
Please enter another number: 456
579
-333
56088
0.26973684210526316

‌The terminal connects you to an actual computing environment. Go ahead, give ls -l / a try in the terminal, where you'll see a full operating system directory structure! You also have full admin access (sudo), so you can alter any part of the filesystem you'd like.

You can read about more ways to use a sandbox here!

Other computing environments

There are sandboxes for a multitude of other environments, including:

  • Common programming languages like Java, C++, Swift, and C#
  • Web development technologies like HTML, CSS, JavaScript, Ruby on Rails, and PHP
  • Data science frameworks for Python and R
  • Databases like PostgreSQL and MySQL
  • Specialty languages like Elm, Haskell, Golang, and Rust‌

You can find a complete list of the environments here.

Each sandbox comes with certain programs preinstalled. If you launched the Python sandbox, you can run ipython in the terminal to jump into that nifty piece of software. You can also install new software, for example:

sudo apt install -y gnome-calculator

Each sandbox is given access to 256MB of free disk space and can use up to 2GB of RAM. It also has access to up to 4 CPU’s worth of processing power.

Tab-based interface

After you’ve run the above command, open a Desktop tab by clicking the +and selecting Desktop, then run gnome-calculator in the terminal . You'll see this:

img

This is a real calculator running in your sandbox!

Pretty slick, right?

You probably noticed by now that there are a multitude of other tabs you can select from. Here’s a quick list of the others:

  • Terminal tabs give you access to a new terminal, which makes it easy to run multiple programs or commands concurrently.
  • Browser tabs load a web browser you can use to connect to web accessible services running in your sandbox.
  • Jupyter tabs loads an actual Jupyter Notebook for you to work in, which is great for data science or machine learning.
  • Skulpt is a JavaScript implementation of some of the basic features of Python, oftentimes used with the turtle and processing Python libraries.

Sharing your work

You’ve probably already seen the Share button at the top right of the page! If you send a share URL to someone, they’ll get a copy of your sandbox as it stands when they click the URL. Note that you will not be billed for their usage.

Here’s my share URL for the project I used to take the screenshots for this post:

next.tech/projects/0295f1cee35f/share

If you click that, you’ll be taken straight to a Python sandbox with the calculator code in it. Note that it won’t have the gnome-calculator installed because (currently) sandboxes do not persist newly installed software, so you'll have to install that yourself if you'd like to try it.

There are a number of other pre-made sandboxes ready for launch here!

Downloading your work

The files you create (and the tabs) are saved automatically as you work in your sandbox. However, sometimes you may want to save them to your local machine, for example if you’ve tested a proof-of-concept and now want to continue to work on it as part of your normal development process.

To do this, just click the settings gear in the bottom left of the page, then choose Download.

Summary

Whew, that was a lot to cover! Let’s recap. Above, we explored:

  1. Launching a computing environment for Python in a few seconds (especially if you used the nt.dev URL)
  2. Writing a basic calculator in Python
  3. The various interface elements available to you in a sandbox
  4. Installing software in a sandbox (the gnome-calculator)
  5. Opening an actual desktop environment and using that software
  6. Downloading your work for use in your local development environment

This has been just a quick guide to get you started. If you’d like, you can explore the rest of the Sandbox documentation here to learn more about what you can do in a sandbox!

If you have any feedback you’d like to share, please don’t hesitate respond to this post. We’d love to hear from you!

Top comments (0)

Take a look at this:

Settings

Go to your customization settings to nudge your home feed to show content more relevant to your developer experience level. 🛠