前端進階
-認識 PostgreSQL 與 Supabase - 基本觀念與使用教學
this.web
什麼是 PostgreSQL？
PostgreSQL 是一個免費、開源的資料庫系統，也是現在最熱門的資料庫。
PostgreSQL 強大的地方在於，除了足夠穩定、內建各種豐富的資料類型像是 JSONB、陣列以外，也支援各種複雜的運算和函數處理。
更厲害的是他可以設定 Row Level Security (RLS)，讓我們可以妥善的管理每個資料的權限，不必擔心被惡意攻擊。
前端工程師要會 PostgreSQL 嗎？
不一定，但我很推薦你去了解資料庫和 PostgreSQL。我認為有以下好處：
- 更好地理解 API 與後端資料流：如果你理解資料庫和資料格式，在串 API 時也會注意到更多細節，跟後端工程師的溝通也會更順暢
- 排錯能力更強：當遇到錯誤時，可以更全面的思考可能發生的原因，也許有時候是後端回傳的資料有問題，或是資料庫的運算邏輯出錯。
- 做小型專案或個人作品：有時候團隊不見得有後端幫忙，又或者你有什麼 Side Project 想法，這時如果有基本的資料庫技能，就可以快速上手。
- 成為更高階的工程師：如果你想繼續往上爬，成為架構決策者或是想了解系統設計，資料庫是很重要的一個環節。
使用 Supabase 快速開始練習 PostgreSQL
前端工程師要怎麼練習 PostgreSQL 呢？最簡單的方式就是直接用 Supabase 開一個免費的專案。
Supabase 是一個以 PostgreSQL 為主的服務平台，你可以直接在 Supabase 開一個專案後直接使用 PostgreSQL。
除了 PostgreSQL 以外，Supabase 也提供其他強大的服務，像是使用者系統（Auth）、檔案儲存（Storage）、RESTful 與 GraphQL API、以及視覺化 Dashboard 等功能。
讓我們前端工程師在使用 PostgreSQL 上更輕鬆，不需要自己額外架資料庫，不需要後端知識也能打造一個完整的應用。
如何使用 Supabase?
先到 supabase 的官網，接著可以直接使用 GitHub 登入。
登入之後就可以到後台建立 Organization（組織），可以看到我已經建立一個叫做 ThisWeb 的組織。
建立組織的方式也很簡單，打上名稱、類型和服務方案就好，以練習來說，免費的方案已經非常足夠了！
然後它會要我們創建 Project，Project 就是專案，就是你的 PostgreSQL 資料庫了！每個組織可以有多個專案，換句話說，每個組織可以創建多個 PostgreSQL 資料庫。
接著打上名稱、密碼選擇地區就可以創建了。密碼要記得哦！之後連線會需要用到密碼，如果忘記了之後也能在後台重新設定密碼。
創建好後就可以開始使用 Supabase 了，Supabase 好用的地方在於他提供兩種操作方式：
- 視覺化的工具直接操作資料庫
- 直接使用 SQL 操作資料庫
視覺化工具操作資料庫
如果你是完全的 SQL 新手，對於 SQL 的語法還很不熟悉，那你可以使用視覺化的工具來創建 table。比如以下的圖片就是我創建了一個 user 表格。
使用 SQL 操作資料庫
如果你想練習 SQL，或是你很熟悉 SQL。
可以直接使用 Supabase 提供的 SQL Editor 來操作資料庫，這樣要請 AI 輸入或是自己練習都非常方便，比如下方圖片我就用 SQL 的方式建立了一個 users table：
如何連接 Supabase？
我們可以使用 supabase.js 這個函式庫
先安裝套件：
npm install @supabase/supabase-js接著建立 supabase client，在 Supabase 的專案頁面就可以看到資料庫的 url 和 anon-key，接著就能夠使用啦！
只要設定好 Row Level Security (RLS)，將操作資料的權限保護起來，那這裡的 anon-key 放在前端是沒關係的。
import { createClient } from '@supabase/supabase-js'
// Create a single supabase client for interacting with your database
const supabase = createClient('<https://xyzcompany.supabase.co>', 'publishable-or-anon-key')
const { data, error } = await supabase
.from('users')
.select('*')
為什麼要選擇 PostgreSQL？
這麼多資料庫，為什麼我建議選擇 PostgreSQL 呢？可以簡單分成幾點：
- 主流趨勢：根據 Stack Overflow 開發者調查，PostgreSQL 已連續成為最受歡迎的資料庫之一，使用率也超越 MySQL，代表社群與生態資源非常充足。
- 功能完整：內建 JSONB、全文檢索、地理資料 PostGIS 等強大功能，能同時兼顧傳統關聯式與現代非關聯式的應用需求。
- 高一致性與可靠性：完全遵循 ACID 特性，交易與資料一致性保證比 MySQL 更嚴謹。
- 可擴充性強：支援自訂函數、資料型別與豐富的外掛，能應付多樣化需求。
- 與 Supabase 深度整合：Supabase 就是基於 PostgreSQL 打造，前端工程師幾乎零後端經驗就能直接使用和練習，非常方便。
簡單說一句話就是 PostgreSQL 太強大了，Supabase 又整合的非常好，不管是對端工程師，還是新創團隊，都非常容易上手。
總結
如果你現在是前端工程師想練習 Database 又不知道從哪裡開始。
PostgreSQL 和 Supabase 是一個很好的切入點，做個簡單的 Todo list 也能練習到基本的觀念，總之，直接去動手做吧！