Your first Space app

This tutorial will teach you everything you need to know to build your first app for Deta’s personal cloud: “Space”.

To get a brief overview of what a Space app is, take a look at the Anatomy of a Space app guide or read the Personal Cloud 101.

Prerequisites

The first thing to do is to create a Deta account if you haven’t already. You can signup in seconds, it’s completely free!

In this tutorial, we will launch a Space app built with Svelte. Deta Space supports any frontend framework alongside backend APIs built with Node, Python, Go, Rust or other custom binaries. We will only use Svelte for illustration purposes, but you can use any framework of your choice for this guide.

We will start by creating our Svelte app using the official instructions found on Svelte.dev:

npm create vite@latest my-space-app -- --template svelte

Afterwards, let’s make sure to go into the directory of our new Svelte app:

cd my-space-app

Now we are ready to continue with the Space specific steps.

Installing the CLI

In this tutorial, we will use the Space CLI to create a new project on Space and then release it as a Space app.

To install the Space CLI on MacOS, open a Terminal session and enter:

curl -fsSL https://get.deta.dev/space-cli.sh | sh

This will download the binary which contains the CLI code. It will try to export the space command to your path. If it does not succeed, follow the directions output by the install script to export space to your path.

Once you have successfully installed the Space CLI, you’ll need to log in to Space.

The Space CLI authenticates itself with ‘Access Tokens’. You can create an access token under Settings in your Space. Just type ‘settings’ in Teletype to open them.

After you have generated a new key you can add it to the CLI using space login. It will prompt you for the key and then store it safely.

From a terminal type:

space login

After you’ve entered the key the Space CLI is ready to be used!

Creating a project

A ”project” allows you to start building an app, experiment with different Space features, test if your app works in a Space environment and finally release it to the public so others can get their own copies in their own personal clouds.

Let’s create a new project inside our local directory with the following command:

space new

The CLI will ask you to name your project, we will call ours “awesome-app”. Then it will try to detect which framework or language you are using and show you what’s found. In our case it should correctly identify our Svelte app with the following message, prompting you to confirm:

⚙️ No Spacefile found, trying to auto-detect configuration ...
👇 Deta detected the following configuration:

Micros:   
name: frontend
 L src: .
 L engine: svelte

? Do you want to bootstrap "awesome-app" with this configuration? (y/n)

After confirming it will create a new project in Builder (a Space App for building and releasing Space Apps) and generate a Spacefile in your local directory:

v: 0
micros:
  - name: frontend
    src: .
    engine: svelte

For now, it’s enough to say that your Spacefile contains the configuration of your app which is used by Space to understand what your app looks like and how to run it.

The CLI also created a hidden .space directory locally which contains information necessary to work with your project in Builder. This file should not be included in your version control and was automatically added to your .gitignore, if you have initialized a Git repository.

After you’ve created a project you can view and manage it in Builder. Builder is available on your Space Canvas.

Pushing to Space

Now that we have created our project, we can push our local changes to a live Space environment.

Let’s use another CLI command to do this:

space push

space push will package and upload all the necessary files to create a new ”revision”. A revision is a complete package of your app at a single point in time. New Revisions are created with each push. You can view this new revision by opening your project inside Builder. It will be shown on the “Develop” tab.

Creating a release

The last step is to create a ”release” out of our revision. A release makes your app installable to others.

Let’s use one final CLI command:

space release

That’s it, you can now share the release link with anyone you want and they will be able to install their own copy of your app in their Space.

Welcome to the Detaverse! 🚀