Quick Start Guide

Build a fully functional app with authentication, database, storage, and real-time features in under 10 minutes.

This guide assumes you have Node.js installed and basic JavaScript knowledge. No backend experience needed.

Step 1: Create a Project

First, you need a ZendBX project. Think of it as your backend workspace—it includes your database, authentication system, and all APIs.

1. Go to ZenDBX signup
2. Click Sign Up (or Log In if you have an account)
3. Click New Project
4. Give your project a name (e.g., "My First App")
5. Click Create Project

Get Your API Keys

After creating your project, you need three pieces of information:

1. In your project dashboard, click Settings (⚙️ icon)
2. Navigate to API Keys
3. Copy these values:

• •
  Project URL (e.g., https://api.zendbx.in)
• •
  Anon Key (a long JWT token - safe for browsers)
• •
  Project Slug (your project's readable name, like "my-first-app")

Step 2: Install the SDK

The ZendBX SDK is a JavaScript/TypeScript library that makes it easy to interact with your backend.

npm install @zendbx/sdk

This works with npm, yarn, pnpm, or bun. The SDK is compatible with React, Next.js, Vue, Svelte, Node.js, and any modern JavaScript environment.

Step 3: Configure Environment Variables

Store your API keys in environment variables. This keeps them secure and makes it easy to switch between development and production.

Create a .env.local file in your project root:

ZENDBX_URL=https://api.zendbx.in
ZENDBX_ANON_KEY=your-anon-key
ZENDBX_PROJECT_SLUG=my-project

Step 4: Initialize the Client

Create a file to initialize your ZendBX client. This creates the connection to your backend.

import { createClient } from '@zendbx/sdk';

export const db = createClient({
  apiUrl: process.env.ZENDBX_URL!,
  anonKey: process.env.ZENDBX_ANON_KEY!,
  projectSlug: process.env.ZENDBX_PROJECT_SLUG!,
});

Step 5: Add Authentication

Let's create a user account. ZendBX handles password hashing, JWT tokens, and session management automatically.

const { data, error } = await db.auth.signUp({
  email: 'user@example.com',
  password: 'supersecret',
});

if (error) console.error(error.message);
else console.log('User created:', data.user);

The user is created in the auth.users table. Their password is automatically hashed with bcrypt, and a JWT token is returned for authentication.

Step 6: Create a Table and Insert Data

Before inserting data, you need to create a table. Go to your project dashboard → Database → SQL Editor and run:

CREATE TABLE todos (
  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
  user_id UUID REFERENCES auth.users(id),
  title TEXT NOT NULL,
  done BOOLEAN DEFAULT false,
  created_at TIMESTAMPTZ DEFAULT NOW()
);

Now insert data using the SDK:

const { data, error } = await db.from('todos').insert({
  title: 'Learn ZendBX',
  done: false,
});

Behind the scenes, this sends a POST request to /p/your-slug/v1/rest/todos with your data. The API was generated automatically when you created the table.

Step 7: Query Data with Filters

Fetch your data with powerful filtering, sorting, and pagination—all built into the SDK.

const { data: todos, error } = await db
  .from('todos')
  .select('id, title, done')
  .eq('done', false)
  .order('created_at', { ascending: false })
  .limit(20);

Step 8: Upload Files to Storage

ZendBX includes built-in file storage. First, create a bucket in your dashboard: Storage → Buckets → New Bucket.

const bucket = db.storage.bucket('avatars');
const { data, error } = await bucket.upload(file, 'user-123.png');

Step 9: Real-Time Subscriptions

Listen to database changes in real-time. Perfect for building chat apps, live dashboards, or collaborative tools.

const sub = db.realtime
  .from('todos')
  .on('INSERT', (payload) => {
    console.log('New todo:', payload.new);
  })
  .subscribe();

// Clean up:
sub.unsubscribe();