Supabase
Gyakorlati példák
Next.js login, egyszerű CRUD (todo) és avatar feltöltés minták Supabase-szel.
Gyakorlati példák
Next.js login (client)
"use client"
import { useState } from "react"
import { useRouter } from "next/navigation"
import { createClient } from "@/utils/supabase/client"
export default function LoginPage() {
const supabase = createClient()
const router = useRouter()
const [email, setEmail] = useState("")
const [password, setPassword] = useState("")
const [error, setError] = useState<string | null>(null)
const handleLogin = async () => {
setError(null)
const { error } = await supabase.auth.signInWithPassword({ email, password })
if (error) setError(error.message)
else {
router.push("/dashboard")
router.refresh()
}
}
return null
}Todo CRUD minta
await supabase.from("todos").select("*").order("created_at", { ascending: true })
await supabase.from("todos").insert({ task })
await supabase.from("todos").update({ is_done: true }).eq("id", id)
await supabase.from("todos").delete().eq("id", id)Avatar feltöltés (Storage)
await supabase.storage.from("avatars").upload(path, file, { upsert: true })
const { data } = supabase.storage.from("avatars").getPublicUrl(path)
await supabase.from("profiles").update({ avatar_url: data.publicUrl }).eq("id", userId)Rövid összefoglaló
- Auth: signIn + redirect.
- CRUD: from/select/insert/update/delete.
- Storage: upload + public URL + DB update.