前端可以学习的 sqlite 数据库入门

一、为什么前端要学习 sqlite 数据库?

因为 sqlite 自给自足：

• 不需要后端配合服务器
• 自己本地就能自给自足
• 能作为嵌入式数据库

本文适合没有数据库基础的同学阅读，适合入门 sqlite

二、简介

SQLite 是一个使用C语言编写的库，它实现了一个小型、快速、自包含、高可靠性、功能齐全的SQL数据库引擎。SQLite 是全球最广泛使用的数据库引擎。SQLite 已内置在所有移动手机和大多数计算机中，并捆绑在无数其他人们每天使用的应用程序中。

三、安装 sqlite

3.1）mac/linux

// linux
sudo apt-get install sqlite3
sudo yum install sqlite
sudo pacman -S sqlite
// mac
brew install sqlite

3.2）windows

本文以 windows 为例, 讲解 sqlite 安装过程

3.3）下载

SQLite Download Page

当前版本 sqlite 需要下载两个内容：

• 带有 dll 后缀的文件
• 带有 tool 文件

目前版本中， dll 中没有可执行文件，需要将 tool 一起下载，下载之后解压到一个不会常变动的文件夹中。

3.4）添加环境变量

在有了需要文件之后（包含 exe 可执行文件），需要将目录手动添加到环境变量中。

• 在 window 中搜索环境变量
• 进入 系统属性
• 进入环境变量
• 找到系统变量，并进入
• 在系统变量中找到 Path
• 编辑系统变量中的环境变量
• 添加环境变量（之前文件夹）
• 安装完成

3.5）测试

进入终端，输入 sqlite3 命令

sqlite3

SQLite version 3.43.1 2023-09-11 12:01:27
Enter ".help" for usage hints.
Connected to a transient in-memory database.
Use ".open FILENAME" to reopen on a persistent database.
sqlite>

如果有上面的正常输出，表示 sqlite3 已经正常的安装闭关配置成功

四、VScode 中添加 sqlite 依赖

• 插件

• 展示

五、进入命令行

命令	描述
.schema	显示指定表格的结构
.open	打开或创建数据库文件
.databases	列出已附加数据库的名称和文件
.dump	将数据库内容渲染为SQL
.quit	退出SQLite命令行
.tables	查看所有表格
.header	打开或关闭显示标题行
.mode	设置输出模式（例如，列格式或HTML输出）
.width	设置列的最小宽度以进行列输出

六、创建 sqlite 数据库

cd your dir
touch test.db

七、表操作

• 创建表的 sql 语法

CREATE TABLE database_name.table_name(
   column1 datatype  PRIMARY KEY(one or more columns),
   column2 datatype,
   column3 datatype,
   .....
   columnN datatype,
);

• 删除表

DROP TABLE TABLE_NAME;

• 查看表

.tables

八、插入数据

• 插入语法

INSERT INTO TABLE_NAME [(column1, column2, column3,...columnN)]  
VALUES (value1, value2, value3,...valueN);

• 实例

CREATE TABLE COMPANY(
   ID INT PRIMARY KEY     NOT NULL,
   NAME           TEXT    NOT NULL,
   AGE            INT     NOT NULL,
   ADDRESS        CHAR(50),
   SALARY         REAL
);

INSERT INTO COMPANY (ID,NAME,AGE,ADDRESS,SALARY)
VALUES (1, 'Paul', 32, 'California', 20000.00 );

九、删除数据

• 删除语法

DELETE FROM table_name WHERE condition;

• 实例

# 删除所有数据
DELETE FROM employees;

# 条件删除
DELETE FROM employees WHERE salary < 5000;

十、选择数据

• 语法

SELECT column1, column2, columnN FROM table_name;

• 实例

SELECT * FROM COMPANY;
SELECT ID, NAME, SALARY FROM COMPANY;
SELECT tbl_name FROM sqlite_master WHERE type = 'table';
SELECT sql FROM sqlite_master WHERE type = 'table' AND tbl_name = 'COMPANY';

十一、与 Node.js 进行对接

cd your dir
pnpm init
npm i sqlite3

11.1) 指定内存和磁盘

类型	说明	代码示例
内存数据库	完全存储在RAM中，不在磁盘上创建文件	const db = new sqlite3.Database(':memory:');
磁盘数据库	在磁盘上创建数据库文件，数据持久化保存	const db = new sqlite3.Database('mydatabase.db');

11.2) 示例

const sqlite3 = require('sqlite3').verbose();
const db = new sqlite3.Database('mydatabase.db');

// 创建users表格
db.serialize(() => {
  db.run("CREATE TABLE IF NOT EXISTS users (id INTEGER PRIMARY KEY, name TEXT, email TEXT)");

  // 插入新用户
  const insertStmt = db.prepare("INSERT INTO users (name, email) VALUES (?, ?)");
  insertStmt.run("Alice", "alice@example.com");
  insertStmt.run("Bob", "bob@example.com");
  insertStmt.finalize();

  // 查询用户
  db.each("SELECT id, name, email FROM users", (err, row) => {
    console.log(`${row.id}: ${row.name} (${row.email})`);
  });

  // 更新用户信息
  const updateStmt = db.prepare("UPDATE users SET email = ? WHERE name = ?");
  updateStmt.run("newemail@example.com", "Alice");
  updateStmt.finalize();

  // 查询更新后的用户信息
  db.each("SELECT id, name, email FROM users WHERE name = 'Alice'", (err, row) => {
    console.log(`Updated ${row.id}: ${row.name} (${row.email})`);
  });

  // 删除用户
  db.run("DELETE FROM users WHERE name = 'Bob'");

  // 查询剩余的用户
  db.each("SELECT id, name, email FROM users", (err, row) => {
    console.log(`Remaining ${row.id}: ${row.name} (${row.email})`);
  });
});

// 关闭数据库连接
db.close((err) => {
  if (err) {
    return console.error(err.message);
  }
  console.log('Closed the database connection.');
});

十二、Prisma 中使用 sqlite

12.1) 进入项目

pnpm install prisma -D

12.2) 初始化 primsa

npx prisma init --datasource-provider sqlite

12.3) 修改 schema 文件

datasource db { provider = "sqlite" url = "file:./dev.db"}

12.4) 初始化迁移

npx prisma migrate dev --name init

12.5) 示例

model User {
  id    Int      @id @default(autoincrement())
  name  String
  email String   @unique
}

12.6) 在 node.js 中进行增删改查

const { PrismaClient } = require('@prisma/client');
const prisma = new PrismaClient();

async function main() {
  // 创建新用户
  const newUser = await prisma.user.create({
    data: {
      name: 'Alice',
      email: 'alice@example.com',
    },
  });

  console.log('Created user:', newUser);

  // 查询所有用户
  const users = await prisma.user.findMany();
  console.log('All users:', users);

  // 更新用户信息
  const updatedUser = await prisma.user.update({
    where: { id: newUser.id },
    data: { email: 'newemail@example.com' },
  });

  console.log('Updated user:', updatedUser);

  // 删除用户
  const deletedUser = await prisma.user.delete({
    where: { id: newUser.id },
  });

  console.log('Deleted user:', deletedUser);
}

main()
  .catch((error) => {
    throw error;
  })
  .finally(async () => {
    await prisma.$disconnect();
  });

小结