Supabase-Js on BenzHub

Supabase 型別生成與進階用法 | Supabase 完整教學

Wed, 07 Oct 2026 00:00:00 +0000

上一篇我們把 supabase-js 的 CRUD 讀寫玩熟了，但那些查詢的 data 型別其實還很鬆散。這一篇要補上最後一塊拼圖——型別安全：用 Supabase CLI 的 supabase gen types typescript 從資料庫 schema 生成 Database 型別，搭配 createClient<Database> 注入 client，讓每一次 select、insert、update 都有完整的 TypeScript 推導與 IntelliSense。你還會學到 Tables / TablesInsert 等 helper、用 QueryData 推導複雜關聯查詢、overrideTypes 覆寫，以及 abortSignal、csv、explain 等進階選項與 service_role 客戶端。

supabase-js CRUD 查詢與寫入 | Supabase 完整教學

Tue, 06 Oct 2026 00:00:00 +0000

上一篇我們認識了 supabase-js 這個統一 client，也知道 supabase.from() 是資料庫子模組的入口。這一篇就把最常用的一塊——CRUD（Create、Read、Update、Delete）——徹底玩熟。你會學到用 insert 新增（單筆與多筆批次）、select 查詢、update 搭配 filter 修改、upsert 靠 onConflict 做「有就更新、沒有就新增」、delete 刪除，並且看懂貫穿全部操作的 { data, error } 錯誤處理模式、為什麼 v2 寫入預設不回傳資料、以及 .single() 與 .maybeSingle() 的差別。

supabase-js 客戶端入門 | Supabase 完整教學

Mon, 05 Oct 2026 00:00:00 +0000

前面十五篇，我們一路用 SQL、curl 與裸的 .from()／.rpc() 認識了 Supabase 的資料庫與 REST API。但真正在寫應用時，你不會手刻 HTTP 請求——你會用官方的 supabase-js 客戶端。這一篇帶你正式認識這個 SDK：怎麼 npm install @supabase/supabase-js、怎麼用 createClient(url, anonKey) 建立一個 client、這個 client 底下 from／auth／storage／realtime／functions 五大子模組各管什麼，以及最關鍵的兩個實務問題——瀏覽器該用哪把金鑰、伺服器該用哪把，還有為什麼整個 App 只該建立一個 client（單例模式）。