JSON / Database / SQL：資料不是只有畫面上的文字

Learning outcomes

• 能區分 JSON text、JavaScript object、database row。
• 能解釋 table/row/column 的基本模型。
• 能讀最基本 SELECT/INSERT/UPDATE/DELETE。
• 能說明 database constraint 和 frontend validation 的責任差異。

1. JSON 是資料格式，不是 Database

{
  "id": 1,
  "title": "JavaScript",
  "score": 92
}

這是一段 JSON text 的例子。Client 收到後可能 parse 成 language runtime value；它本身不是一張 table。

2. Database Table

courses

id | title       | score
---+-------------+------
1  | JavaScript  | 92
2  | C++         | 78

Table 用 rows 表示 records，用 columns 表示欄位。Schema 還能定義 type、constraint、relation。

3. SQL 是操作 relational data 的語言

SELECT id, title, score
FROM courses
WHERE score >= 60
ORDER BY score DESC;

SQL 不只是「找資料」；它也能建立/修改 schema、控制 transaction、permissions 等。

4. CRUD

INSERT INTO courses
  (title, score)
VALUES
  ('JavaScript', 92);

UPDATE courses
SET score = 95
WHERE id = 1;

DELETE FROM courses
WHERE id = 1;

WHERE 是 operation scope；少了條件可能影響大量 rows。

5. Constraint 是資料層 invariant

score INTEGER
CHECK (
  score BETWEEN 0 AND 100
)

Frontend 也可限制 0–100，但 user 可以繞過 UI。Database constraint 能在持久化層再守一次資料合法性。

Project checkpoint：Request Journey Map v11

Browser
  ↓ GET /api/courses
Server
  ↓ SQL SELECT
Database
  ↓ rows
Server runtime values
  ↓ JSON serialization
HTTP response
  ↓
Browser parses JSON
  ↓
UI state/render

Debug evidence：API 回錯資料

1. DB 裡 row 本身是否正確？
2. SQL filter 是否正確？
3. Server mapping/serialization 是否正確？
4. Client parse/render 是否錯？