Supabase pro vibecodery: Backend bez kodu -- kompletni cesky pruvodce [2026]

Chces do sve aplikace pridat prihlasovani uzivatelu, databazi nebo realtime notifikace? S Supabase to zvladnes bez jedineho radku backendoveho kodu. Supabase je open-source alternativa k Firebase, ktera ti da plnohodnotny PostgreSQL backend s jednoduchym API.

Co je Supabase a proc ho vibecoderi milujou

Supabase je Backend-as-a-Service (BaaS) postaveny na PostgreSQL. Na rozdil od Firebase, ktery pouziva NoSQL databazi, Supabase ti dava plnohodnotny relacni databazovy system — se vsemi vyhodami SQL dotazu, joinu a integritnimi omezenimi.

Proc je Supabase idealni pro vibecoding?

• Okamzite API: Vytvoris tabulku a Supabase automaticky vygeneruje REST a GraphQL API. Zadne psani endpointu.
• Autentizace zadarmo: Email/heslo, magic links, OAuth (Google, GitHub, Discord) — vsechno out of the box.
• Realtime subscriptions: Zmeny v databazi se okamzite propagujou do frontendu. Idealni pro chaty, notifikace nebo live dashboardy.
• Row Level Security: Bezpecnostni pravidla primo v databazi. Nemusis resit middleware.
• Integrace s Lovable: Lovable ma nativni Supabase integraci — propojis jednim klikem.

Krok 1: Zaloz si projekt na Supabase

Jdi na supabase.com a vytvor si ucet (GitHub login je nejrychlejsi). Potom klikni na "New Project".

Vyplnis:

• Nazev projektu: napr. "moje-app"
• Heslo k databazi: Vygeneruj silne heslo a ULOZ SI HO (pozdeji ho budes potrebovat)
• Region: Vyber nejblizsi — pro CZ/SK je to Frankfurt (eu-central-1)

Po vytvoreni projektu (trva ~2 minuty) dostanes pristupove udaje:

• Project URL: https://xxxxx.supabase.co
• Anon Key: Verejny klic pro klientske volani
• Service Role Key: Tajny klic pro serverove operace (NIKDY nedavej do frontendu!)

Krok 2: Vytvor prvni tabulku

V Supabase dashboardu jdi do "Table Editor" a klikni "Create a new table". Pro priklad si vytvorime jednoduchou todo aplikaci:

Tabulka: todos

• id (uuid, primary key, default: gen_random_uuid())
• created_at (timestamptz, default: now())
• title (text, not null)
• is_completed (boolean, default: false)
• user_id (uuid, foreign key na auth.users)

Po ulozeni tabulky mas okamzite k dispozici REST API endpoint. Supabase automaticky vygeneroval CRUD operace.

Krok 3: Pripoj Supabase k aplikaci

S Lovable (nejjednodussi cesta)

Pokud buildis v Lovable, propojeni je jednoduche:

1. V Lovable projektu klikni na "Supabase" ikonku v sidebaru
2. Klikni "Connect to Supabase"
3. Autorizuj pristup
4. Hotovo — Lovable automaticky nainstaluje @supabase/supabase-js a vytvori konfiguracni soubor

Rucne (pro Cursor, Bolt.new, vlastni projekty)

Nainstaluj Supabase klienta:

npm install @supabase/supabase-js

Vytvor konfiguracni soubor:

import { createClient } from '@supabase/supabase-js'

const supabaseUrl = import.meta.env.VITE_SUPABASE_URL
const supabaseAnonKey = import.meta.env.VITE_SUPABASE_ANON_KEY

export const supabase = createClient(supabaseUrl, supabaseAnonKey)

Krok 4: CRUD operace — cteni a zapis dat

Supabase klient ma intuitivni API. Tady jsou zakladni operace:

Nacteni vsech zaznamu:

const { data: todos, error } = await supabase
  .from('todos')
  .select('*')
  .order('created_at', { ascending: false })

Pridani noveho zaznamu:

const { data, error } = await supabase
  .from('todos')
  .insert({ title: 'Naucit se Supabase', user_id: user.id })
  .select()

Aktualizace zaznamu:

const { data, error } = await supabase
  .from('todos')
  .update({ is_completed: true })
  .eq('id', todoId)
  .select()

Smazani zaznamu:

const { error } = await supabase
  .from('todos')
  .delete()
  .eq('id', todoId)

Vsimnete si vzoru: kazda operace vraci { data, error }. Vzdy kontrolujte error — Supabase nikdy nehaze vyjimky.

Krok 5: Autentizace uzivatelu

Supabase ma kompletni auth system zabudovany. Nejbeznejsi metody:

Email + heslo:

// Registrace
const { data, error } = await supabase.auth.signUp({
  email: 'uzivatel@email.cz',
  password: 'silne-heslo-123'
})

// Prihlaseni
const { data, error } = await supabase.auth.signInWithPassword({
  email: 'uzivatel@email.cz',
  password: 'silne-heslo-123'
})

OAuth (Google, GitHub):

const { data, error } = await supabase.auth.signInWithOAuth({
  provider: 'google'
})

Magic Link (prihlaseni bez hesla):

const { data, error } = await supabase.auth.signInWithOtp({
  email: 'uzivatel@email.cz'
})

Krok 6: Row Level Security — ochrana dat

Row Level Security (RLS) je supabase superschopnost. Definujes pravidla primo v databazi — kdo muze cist, zapisovat, mazat ktere radky.

Nejdriv zapni RLS na tabulce (v Table Editor klikni "Enable RLS"). Potom pridej policies:

Uzivatel vidi jen sve zaznamy:

CREATE POLICY "Users can view own todos"
ON todos FOR SELECT
USING (auth.uid() = user_id);

Uzivatel muze vytvorit zaznam jen pro sebe:

CREATE POLICY "Users can create own todos"
ON todos FOR INSERT
WITH CHECK (auth.uid() = user_id);

Krok 7: Realtime subscriptions

Chces, aby se zmeny v databazi okamzite projevily u vsech pripojenych klientu? Supabase Realtime to umi:

const channel = supabase
  .channel('todos-changes')
  .on('postgres_changes',
    { event: '*', schema: 'public', table: 'todos' },
    (payload) => { console.log('Zmena:', payload) }
  )
  .subscribe()

Realtime musis zapnout pro tabulku v dashboardu: Database > Replication > zapni tabulku.

Krok 8: Storage — soubory a obrazky

Supabase ma i file storage. Vytvor bucket v dashboardu (Storage > New Bucket) a pouzij:

Upload souboru:

const { data, error } = await supabase.storage
  .from('avatars')
  .upload(userId + '/profile.jpg', file)

Ziskani verejne URL:

const { data } = supabase.storage
  .from('avatars')
  .getPublicUrl(userId + '/profile.jpg')

Edge Functions — serverova logika

Potrebujes serverovou logiku (webhook, zpracovani platby, volani externiho API)? Supabase Edge Functions jsou serverless funkce bezici na Deno. Deployujes pres Supabase CLI: supabase functions deploy moje-funkce.

Prakticke pouziti: Stripe webhooky, posilani emailu, AI API volani (OpenAI, Anthropic), CRON joby.

Cenove plany Supabase (2026)

Free tier je stedry — 500 MB databaze a 50K mesicnich aktivnich uzivatelu zvladne vetsinu MVP.

5 nejcastejsich chyb s Supabase

1. Zapomenuty RLS: Data jsou verejne citatelna. VZDYCKY zapnete RLS na tabulkach s uzivatelskymi daty.
2. Service key ve frontendu: Service Role Key pouzivejte POUZE na serveru. Ve frontendu pouzivejte Anon Key.
3. Chybejici error handling: Supabase nevyhazuje vyjimky — vraci { data, error }. Pokud nekontrolujete error, tichy fail vas prekvapi.
4. Pauzovany free projekt: Po 7 dnech neaktivity se free projekt pausne. Navstivte dashboard pro restart.
5. Spatne typy: Pouzivejte supabase gen types typescript — usetri hodiny debugovani.

Supabase vs alternativy

Pro vibecodery je Supabase nejlepsi volba diky kombinaci databaze + auth + realtime + storage v jednom nastroji s nativni Lovable integraci.

Zdroje a dalsi cteni

Podivej se take na nas Lovable navod pro zacatecniky, Vercel deployment pruvodce nebo srovnani vibecoding nastroju.