When selecting a technology stack for a new project, developers often need substantial time to evaluate various options. The process from initiation to achieving a stable codebase can be daunting, especially for projects requiring rapid development. With Supabase, zen8labs’ team has managed to expedite this process while providing scalability and stability for our projects. 

Overview of Supabase

What is Supabase?

Supabase has been developed as an open-source alternative to Firebase, a product from Google. Both aim to provide a comprehensive backend as a service (BaaS) solution for users ranging from developers to those without programming knowledge. Supabase supports backend architecture (including PostgreSQL database, file storage, edge functions, etc.) and SDKs for frontend integration.

Key features of Supabase

There are some features of Supabase that we should mention now to help you understand better:

• SQL Support: This is a significant difference between Supabase and Firebase. While Firebase is excellent, it does not support SQL, which many projects require. Supabase comes with pre-configured Postgres, ready for scaling.
• User-friendly interface: From a developer’s perspective, Supabase is very friendly, offering a simple UI with necessary configurations and database templates. Supabase also automatically generates corresponding APIs in REST/GraphQL form

• Automatic user authentication integration: Supabase supports automatic user authentication integration, avoiding the tedious task of re-integrating this in similar projects. Similar to Firebase, Supabase can listen to real-time changes in the database.

Supabase vs Firebase 

Supabase and Firebase both offer developers simplified backend setups, allowing them to create and manage databases through a browser-based interface. They prioritize a strong developer experience by providing client-side libraries, which make database interactions easier without requiring much manual configuration. Additionally, both platforms feature real-time capabilities, authentication services, and data storage options, making them ideal for applications that demand fast and reliable backend interactions. 

Despite their similarities, Supabase and Firebase have several important differences that set them apart, particularly in database structure, pricing models, performance, and the open-source nature of Supabase. Firebase is a document-based database, while Supabase utilizes PostgreSQL, a relational database system, giving Supabase an advantage in structured data management and making it more suitable for complex queries. Unlike Firebase, which is a proprietary Google product, Supabase is open source, allowing users to self-host or modify the service, whereas Firebase can lead to vendor lock-in. The pricing models also differ: Firebase charges based on the number of operations (reads, writes, and deletes), which can result in unpredictable costs, while Supabase charges based on storage without extra fees for API requests or user numbers. Performance-wise, Supabase has demonstrated higher efficiency in handling more reads and writes per second than Firebase. 

Getting started with Supabase

In the following steps, I will go through some of the steps that you can take to help you to succeed with Supabase. Let’s get started!

Project initialization and default features

• You can self-host Supabase with Docker or simply sign up for an account with Supabase and start with the free tier (supporting 2 projects).

• In the project interface, you can easily create a new table.

• Each project is automatically integrated with an auth schema for easy user authentication.
• Supabase provides RLS (Row Level Security) setup capabilities, defining specific policies to manage data access rights.
• Similar to that of Firebase. Supabase supports triggers and functions, essential tools for pushing and updating data into the database.
• Supabase also automatically generates documentation for your data.

Edge Function

• Introduction to Edge Functions: Edge functions are nothing new and have been applied in various infrastructures/applications (e.g., Vercel Edge Functions, AWS Lambda). Essentially, edge functions allow for processing without server dependency, facilitating integration with various services and supporting automatic scaling.
• Supabase Edge Function: Supabase’s edge functions are developed on Deno, a JS Runtime Environment. They natively support TS and WASM, aiming for global distribution with low latency.

console.log(`Function "telegram-bot" up and running!`) 
 
import { Bot, webhookCallback } from 'https://deno.land/x/grammy@v1.8.3/mod.ts' 
 
const bot = new Bot(Deno.env.get('TELEGRAM_BOT_TOKEN') || '') 
 
bot.command('start', (ctx) => ctx.reply('Welcome! Up and running.')) 
 
bot.command('ping', (ctx) => ctx.reply(`Pong! ${new Date()} ${Date.now()}`)) 
 
const handleUpdate = webhookCallback(bot, 'std/http') 
 
Deno.serve(async (req) => { 
  try { 
    const url = new URL(req.url) 
    if (url.searchParams.get('secret') !== Deno.env.get('FUNCTION_SECRET')) { 
      return new Response('not allowed', { status: 405 }) 
    } 
 
    return await handleUpdate(req) 
  } catch (err) { 
    console.error(err) 
  } 
})

SDK Integration

• Supabase supports integration with multiple languages and both RESTful API and GraphQL.

• Here, we will demo with JavaScript. You can install the Supabase integration library:

npm install @supabase/supabase-js

• Then, you can initialize a client object to work with all the functions provided by Supabase:

import { createClient } from '@supabase/supabase-js'  
const supabase = createClient('https://zen8labs.supabase.co', 'public-anon-key')

• With Supabase SDK, you are supported with many great tools to work directly with the database:

const { data, error } = await supabase  
 .from('zen8labs')  
 .select('department')

{  
 "data": [  
 {  
 "id": 1,  
 "name": "Delivery"  
 },  
 {  
 "id": 2,  
 "name": "Marketing"  
 },  
 {  
 "id": 3,  
 "name": "Partnership"  
 }  
 ],  
 "status": 200,  
 "statusText": "OK"  
}

• Activating an Edge Function is very straightforward:

const { data, error } = await supabase.functions.invoke('hello',
{             body: { foo: 'bar' }  
})

• Creating a new Bucket data with Supabase:

const { data, error } = await supabase  
 .storage  
 .createBucket('avatars', { 
 public: false,  
 allowedMimeTypes: ['image/png'],  
 fileSizeLimit: 1024  
 })

• Signing in with Supabase Client:

const { data, error } = await supabase.auth.signInWithPasswor   
email: 'example@zen8labs.com',  
password: 'hello-supabase',  
})

Conclusion

Supabase is set to transform backend development with all the excellent tools it provides. It is certain that more projects will prioritize Supabase for a fast, secure, and scalable development framework. Hopefully, this introduction can give you the head start to succeed in all things Supabase. If you want to stay updated and learn more about technology like Supabase, follow zen8labs for more insightful articles and updates.

Hieu Le, Software Engineer