AI 编程基础

为什么需要数据库

localStorage 可以存少量数据，但它有几个致命问题：

数据只在当前浏览器
别人看不到你的数据
换台电脑就没了

数据库解决这些问题——数据存在服务器上，随时访问。

关系型数据库基础

表（Table）

就像一个 Excel 表格：

-- 用户表
┌────┬──────────┬───────────────┐
│ id │ username │ email         │
├────┼──────────┼───────────────┤
│ 1  │ caesar   │ c@ai.com      │
│ 2  │ ai_jack  │ ai@jack.com   │
└────┴──────────┴───────────────┘

-- 文章表
┌────┬──────────────────┬─────────┐
│ id │ title            │ user_id │
├────┼──────────────────┼─────────┤
│ 1  │ AI编程入门        │ 1       │
│ 2  │ Vite项目搭建      │ 1       │
└────┴──────────────────┴─────────┘

user_id 把文章和作者关联起来——这就是关系。

SQL 快速入门

SQL 是操作数据库的语言。你不需要手写，AI 会帮你。但你需要能看懂。

查询

SELECT * FROM users;                          -- 查所有用户
SELECT * FROM users WHERE id = 1;              -- 查 id=1 的用户
SELECT * FROM articles ORDER BY created_at DESC; -- 按时间倒序

插入

INSERT INTO users (username, email) VALUES ('jack', 'j@ai.com');

更新

UPDATE users SET email = 'new@ai.com' WHERE id = 1;

删除

DELETE FROM users WHERE id = 1;

Supabase：一站式的后端服务

Supabase 是 Google Firebase 的开源替代品，提供：

PostgreSQL 数据库
用户认证
文件存储
实时订阅
自动生成 API

为什么推荐 Supabase

传统方式	Supabase
自己搭服务器	开箱即用
手写 API	自动生成 REST API
配置数据库	可视化管理
实现认证	内置认证系统
部署运维	全托管

Supabase 快速上手

1. 注册

打开 https://supabase.com → 注册 → 创建项目

2. 创建表

在 Supabase 面板中，点击 “Table Editor” → “Create Table”：

表名：todos
字段：id (自动), task (text), done (boolean), created_at (自动)

3. 连接前端

安装 Supabase 客户端：

npm install @supabase/supabase-js

在前端代码中：

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

const supabase = createClient(
  'YOUR_SUPABASE_URL',
  'YOUR_SUPABASE_ANON_KEY'
);

// 获取数据
const { data } = await supabase.from('todos').select('*');

// 插入数据
await supabase.from('todos').insert({ task: '学 AI 编程', done: false });

让 AI 帮你写 SQL

“帮我在 Supabase 中创建三个表：users、articles、comments。写出建表的 SQL 语句。”

→ AI 会生成完整的 SQL。

小结

SQL = 数据库操作语言，主要就是查、增、改、删
Supabase = 一站式后端，有数据库 + 认证 + API
用 AI 写 SQL = 说出需求，AI 写语句

下一篇我们正式开始全栈实战，前端+后端+数据库串联起来。