Aprenda tudo sobre Supabase, a alternativa open-source ao Firebase, desde os conceitos básicos até práticas avançadas de produção.
Supabase é uma plataforma open-source que oferece uma alternativa poderosa ao Firebase, baseada em PostgreSQL e com funcionalidades completas para desenvolvimento de aplicações modernas.
100% código aberto
Banco de dados relacional
Atualizações em tempo real
Plano gratuito generoso
Entenda os componentes essenciais da plataforma Supabase
Banco de dados relacional completo com suporte a JSON, funções, triggers e muito mais.
Sistema de autenticação completo com suporte a email/senha, provedores sociais e autenticação por magic link.
Armazenamento de arquivos com controle de acesso baseado em políticas de segurança.
Atualizações em tempo real usando WebSockets e canais de broadcast do PostgreSQL.
Funções serverless baseadas em Deno para lógica de negócio e integrações.
Controle de acesso granular no nível de linha com políticas de segurança do PostgreSQL.
Criação de projeto e configuração inicial
Acesse supabase.com, crie uma conta e inicie um novo projeto.
// Instalação do cliente JavaScript
npm install @supabase/supabase-js
// Configuração inicial
import { createClient } from '@supabase/supabase-js'
const supabase = createClient(
process.env.SUPABASE_URL,
process.env.SUPABASE_ANON_KEY
)SUPABASE_URL - URL do seu projetoSUPABASE_ANON_KEY - Chave de acesso anônimoSUPABASE_SERVICE_ROLE_KEY - Chave de serviço (use com cuidado)POSTGRES_PASSWORD - Senha do banco de dadosCriando tabelas e definindo políticas de segurança
-- Criando uma tabela de usuários
create table profiles (
id uuid references auth.users not null,
updated_at timestamp with time zone,
username text unique,
avatar_url text,
website text,
primary key (id)
);
-- Habilitando RLS (Row Level Security)
alter table profiles enable row level security;
-- Política de leitura: qualquer usuário autenticado pode ler
create policy "Public profiles are viewable by everyone."
on profiles for select
using ( true );
-- Política de atualização: apenas o próprio usuário pode atualizar
create policy "Users can update own profile."
on profiles for update
using ( auth.uid() = id );Crie tabelas diretamente no editor SQL
Habilite segurança no nível de linha
Defina chaves estrangeiras e relacionamentos
Implementando autenticação segura em sua aplicação
Implementação de login com email e senha.
// Login
const { data, error } = await supabase.auth.signInWithPassword({
email: 'user@example.com',
password: 'password'
})
// Registro
const { data, error } = await supabase.auth.signUp({
email: 'user@example.com',
password: 'password',
options: {
data: {
username: 'john_doe'
}
}
})
// Verificar sessão atual
const { data: { session } } = await supabase.auth.getSession()Implementando atualizações em tempo real com Supabase
// Escutando mudanças em tempo real
const channel = supabase
.channel('custom-all-channel')
.on(
'postgres_changes',
{ event: '*', schema: 'public', table: 'messages' },
(payload) => {
console.log('Mudança recebida!', payload)
// Atualizar UI com nova mensagem
}
)
.subscribe()
// Enviando uma mensagem
const { data, error } = await supabase
.from('messages')
.insert({ content: 'Olá mundo!', user_id: userId })
// Parar de escutar
supabase.removeChannel(channel)Sempre remova os canais quando não forem mais necessários para evitar vazamentos de memória e conexões desnecessárias.
Upload e gerenciamento de arquivos com Supabase Storage
Implementação de upload de arquivos com progresso.
// Upload de arquivo
const { data, error } = await supabase.storage
.from('avatars')
.upload(`public/${file.name}`, file)
// Download de arquivo
const { data, error } = await supabase.storage
.from('avatars')
.download('public/avatar1.png')
// Listar arquivos
const { data, error } = await supabase.storage
.from('avatars')
.list('public/')public - Acesso públicoauthenticated - Apenas usuários autenticadosprivate - Apenas administradoresCriando lógica de negócio com Supabase Functions
// hello-world.ts
import { serve } from "https://deno.land/std@0.168.0/http/server.ts"
serve(async (_req) => {
return new Response(JSON.stringify({ hello: "world" }), {
headers: { "Content-Type": "application/json" },
status: 200,
})
})
// Chamando a função do frontend
const response = await fetch(
`${SUPABASE_URL}/functions/v1/hello-world`,
{
headers: {
Authorization: `Bearer ${session.access_token}`
}
}
)
const data = await response.json()Protegendo sua aplicação Supabase
Use apenas no backend, nunca no frontend.
Nunca confie apenas na lógica do frontend para segurança.
Defina políticas específicas para cada operação (SELECT, INSERT, UPDATE, DELETE).
Use constraints e triggers do PostgreSQL para validação.
Utilize os logs do Supabase para identificar atividades suspeitas.
Teste sempre suas políticas de RLS com diferentes usuários para garantir que estão funcionando corretamente.
Estratégias e melhores práticas para ambientes de produção
Crie um projeto separado para produção com configurações otimizadas.
# Variáveis de ambiente de produção
VITE_SUPABASE_URL=https://seu-projeto.supabase.co
VITE_SUPABASE_ANON_KEY=your-anon-key
NODE_ENV=productionConfigure backups automáticos e testes de restauração regulares.
# Backup manual
pg_dump -h db.supabase.co -U postgres -d postgres > backup.sql
# Restauração
psql -h db.supabase.co -U postgres -d postgres < backup.sqlImplemente monitoramento de performance e logs.
# Métricas importantes
- Latência de queries
- Taxa de erros
- Uso de conexões
- Consumo de storagePlaneje a escalabilidade conforme o crescimento da sua aplicação.
# Estratégias de escalabilidade
- Particionamento de tabelas
- Índices otimizados
- Cache de queries
- Read replicasExplore funcionalidades avançadas do Supabase
Funções serverless executadas na borda da rede para menor latência.
Crie branches do seu banco de dados para desenvolvimento e testes.
Busca semântica usando embeddings e similaridade de vetores.
Suporte a dados geoespaciais com extensão PostGIS.