前端可以学习的 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 依赖

• 插件

• 展示

五、进入命令行

六、创建 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  {
  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();
  });

小结