← Go back

Browser SDK & more

August 30, 2023

Changelog

Browser SDK

For developers, much of the power of the personal cloud is the auth model.

In Space you can build a personal app for yourself, and you can see it run for just about anyone in the world with an internet connection. No need to consider sign-in, sign-up, users, or data separation. The power of auth on the personal cloud is… not thinking about auth. Because it just works.

However, when building a personal app, you need to create an entire backend, writing APIs that routed user requests in the browser and back to the data in Deta Base or Deta Drive. That means a whole lot of drudgery and clients having to go through a backend Micro to store and retrieve data. It also adds latency to user actions as they waited on a backend Micro to respond (cough cough, cold starts).

From today, not only can you forget about auth, but you can forget about entire backends. With the new Deta Browser SDK you can now use Base or Drive straight from your browser.

Read on to discover how you can start living backend free with the Deta Browser SDK.

Deta Browser SDK

To get started using Deta Base or Drive in the browser install the latest Deta JavaScript SDK from npm (or yarn):

Terminal window
npm install deta@latest

Or import it into your app from Space’s CDN:

const deta = await import("https://cdn.deta.space/js/[email protected]/deta.mjs");

The SDK will auto-detect if it is running in Space and on the browser, where you can start reading and writing data:

const base = deta.Base('my-base');
const drive = deta.Drive('my-drive');


await base.putMany(['a', 'b', 'c', 'd']);
await drive.put('a', {data: 'data'});
await drive.put('b', {data: 'data'});
await drive.put('c', {data: 'data'});
await drive.put('d', {data: 'data'});


console.log(await base.fetch());
console.log(await drive.list());

On Space, it will just work. No need for keys or a backend, just low-latency personal applications. Check out this repo for an example app that uses the new SDK on the client.

Deta Team member and author of PingBack, Maxu, had this to say after getting his hands on an early release:

“Some ppl. try to avoid writing API routes and use React & Next.JS server components. I avoid both with the Browser SDK. Instant 10x.”

Checkout this tutorial from Deta CEO, Mustafa, using the Browser SDK to build a full app in a stingle HTML file:



A few notes:

  • The Browser SDK supports all the same methods and features as the existing SDK
  • The Browser SDK will not work on public Micros or Public Routes
  • The SDK will continue to work on a backend (it auto-detects if it is in a browser)

More Fun Things

Base Sort Order

After persistent requests and hacky hacks, we’re pleased to share that you can now sort your Base items by ascending or descending key order. Simply pass a desc value to any Fetch call (docs).

With Python:

db = deta.Base("random-base")


db.fetch(desc=True)

With JavaScript:

const db= deta.Base('random-base');


db.fetch({desc: true})

This works in the browser with the new SDK ;)

If you check the key column in any Base UI view, you’ll also notice a toggle that gives you the same ability.

Python SDK: Async Base

We now have support asynchronous interactions with Deta Base in the Python SDK. See the “Python (async)” tab in the docs for more.

from deta import Deta


deta = Deta() #instantiate with a Data Key, or env DETA_PROJECT_KEY


db = deta.AsyncBase("my_db")


await db.put({"name": "alex", "age": 77, "key": "one"})


await db.put({"name": "alex", "age": 23}, "alex23", expire_in=300)


# close db session
await db.close()

Even More Fixes

  • Removed detalib from the JS SDK, which was causing a lot of errors: more
  • Pushed an error message fix in JS SDK: more
  • Fixed wrong exit code in the CLI: more
  • Fixed build failures when a top level directory conflicts with .spaceignore: more
  • Added a default Serve field to the Spacefile generated for static micros: more
  • Fixed a bug where the build pipeline fails to zip static micros