基于 React + Redux/Mobx 搞定复杂项目状态管理|无密分享 react.js

基于 React + Redux/Mobx 搞定复杂项目状态管理|无密分享
超清原画完整无密包括所有视频课件以及源码
点击下崽：网盘链接
基于Node.js的ORM框架 Prisma的上手运用
Node.js作为我们前端的一项技术，大多数时间是作为一个Javascript的运转环境而存在。但是其优秀的异步操作以及非阻塞式的程序运转方式，也让Node.js可以同时并发处置数千个衔接。前端工程师能够用很低的学习本钱来运用它完成常用的效劳端代码。
ORM
ORM:对象关系映射（Object Relational Mapping）是一种程序设计技术。简单来说ORM能够将我们的底层数据库的各种操作停止一定的封装，我们就能够经过愈加熟习的开发言语来书写对应的数据库命令，ORM则能够将这些数据库操作命令转换为对应的SQL语句。
Prisma
下一代 Node.js、TypeScript、Go 的数据库 ORM
Prisma是一个开源的数据库工具链项目，协助开发人员更快地构建应用程序并减少错误，支持PostgreSQL、MySQL、MongoDB、SQL Server和SQLite。
假如想要理解一门技术的用法，那么我们则需求经过实践的上手运用它来停止一点点的开发。
首先我们需求初始化一个项目
mkdir prisma-demo # 创立一个目录
cd prisma-demo # 经过命令行来进入该项目目录
npm init -y # 将项目停止初始化
{
"name": "prisma-demo",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {

"test": "echo "Error: no test specified" && exit 1"

},
"keywords": [],
"author": "",
"license": "ISC"
}
复制代码
然后我们将本次所需求运用的prisma停止装置一下
npm install prisma -D # 装置prisma
复制代码
装置完成后，我们能够经过npx prisma init -h命令来查看prisma相关的命令协助信息
Setup a new Prisma project
?
Usage
?
$ prisma init [options]
Options
?

-h, --helpDisplay this help message

--datasource-provider Define the datasource provider to use: PostgreSQL, MySQL, SQLite, SQL Server or MongoDB (Preview)

--urlDefine a custom datasource url

?
Examples
?
Setup a new Prisma project with PostgreSQL (default)
默许衔接的数据库为PostgreSQL的数据库 $ prisma init
初始化prisma Setup a new Prisma project and specify MySQL as the datasource provider to use
$ prisma init --datasource-provider mysql
能够经过该命令来定义衔接的数据库类型 Setup a new Prisma project and specify the url that will be used
$ prisma init --url mysql://user:password@localhost:3306/mydb
复制代码
在此处我们经过运用prisma init --datasource-provider sqlite来定义默许的数据库为SQLite
SQLite是一个文件数据库，自给自足的、无效劳器的、零配置的、事务性的 SQL 数据库引擎，在运用过程中较为便当。
npx prisma init --datasource-provider sqlite # 配置默许数据库为sqlite
复制代码
来到我们的代码界面
// prisma -> schema.prisma
// 本文件为数据库模型的配置文件一切数据库模型的配置都在此文件
generator client {
provider = "prisma-client-js"
}
?
// 数据源
datasource db {
provider = "sqlite"
// 数据库
url = env("DATABASE_URL")
// 数据库的衔接地址
}
// 假如需求在VScode中高亮显现代码提示则需求装置名为 Prisma 的语法插件
复制代码
创立数据模型
// 用户的数据模型
model user {
id String @id @unique @default(uuid())
// 用户ID 不能反复默许为UUID
userName String @unique @map("user_name")
// 用户名不能反复 @map表示为字段定义别名
password String @default("")
phone Int? @unique
// 手机号
nickName String? @default("一个不愿意透漏姓名的大佬") @map("nickName")
// 昵称
address String? @default("")
// 地址
gender String? @default("")
// 性别
createAt DateTime @default(now()) @map("create_at")
// 创立时间
updateAt DateTime @updatedAt @map("update_at")
// 更新时间
autograph String @default("")
// 个性签名
@@map("users")
// 给数据表停止命名
}
?
// 文件模型
model post {
id String @id @unique @default(uuid())
// 树立表的关联关系
authorId String @default("") @map("author_id")
// 作者ID 关联用户的ID
@@map("posts")
}
?
复制代码
数据模型新建终了后，我们回到我们的命令行中，经过运用npx prisma db push能够在当前文件下直接生成数据库

node_modules
prisma
- dev.db
  -schema.prisma
.env
app.js
?
复制代码
我们生成的文件数据库正常状况下无法翻开，需求装置VScode中另外的插件 SQLite即可正常的翻开我们的文件数据库
除了以上装置插件的办法以外，我们也能够在项目目录中运用npx prisma studio 命令来翻开prisma内置的效劳器在阅读器端查看我们的数据库以及数据表
数据库的操作
接下来则是数据库的相关操作

在根目录创立db.js文件,并且停止相应内容的引入
import { PrismaClient } from '@prisma/client'
// 引入 prismaClient
const db = new PrismaClient();
?
db.$connect().catch((err) => console.error(err));
// 停止数据库的衔接
?
export default db
复制代码
创立控制器
// userController.js
import prisma from "../utils/db";
// 引入数据库的衔接效劳
async function createUser() {
// 创立用户
try {

await prisma.user.create({ // 调用prisma的创立功用 data: { userName:'test', password:'test', nickName:'一个不愿意透漏姓名的大佬' }, });

} catch (err) {

// 异常捕获 console.log(err);

}
}
// 调用创立用户的办法
createUser()
复制代码
经过在命令行中执行node userController.js本文件即可创立一个用户名为test 密码为test的用户
接下来我们能够经过prisma的查找语句来停止查询用户数据
async function findUsers(userName){
const findUser = await prisma.user.findMany({

where:userName

})
console.log(findUser)
}
findUsers('test')
/*
# node userController.js

[ { id:'xxxxxxxx', userName:'test', password:'test', nickName:'一个不愿透漏姓名的大佬', createAt:2022-03-11T04:05:43.175Z, updateAt:2022-03-11T04:05:43.175Z } ]

*/
复制代码
除了这些以外我们在数据库操作中经常会有多表关联的状况，那么我们就需求在数据模型中停止相应的配置
model user {
id String @id @unique @default(uuid())
......
// 个性签名
// @@map为数据表定义名字

post post[]
// 生成两个表的关联关系
@@map("users")
}
?
?
model post {
id String @id @unique @default(uuid())
// 树立表的关联关系
author user @relation(fields: [authorId], references: [id])
// fields 表示当前模型中的字段 references表示需求关联的模型中的字段
authorId String @default("") @map("author_id")
// 作者ID 关联用户的ID
.....
@@map("posts")
}
复制代码
更新完数据库相关的数据模型后则需求重重生成数据库以及数据表

npx prisma db push
复制代码
然后我们根据上方创立用户的操作，添加一个创立文章的办法
async function createPost(){

const user = await prisma.user.findFirst(); // 查找第一个用户

await prisma.post.create({
// 调用创立文章内容的办法

data:{ title:'xxx', desc:'xxx', authorId:user.id //填写进去相应的数据 }

})
}
createPost()
// node createPost.js 执行该文件以及办法
复制代码
生成文章后我们能够再添加一个查找文章的办法
async function findPost(){
const post = await prisma.post.findMany({

where:{}

})
console.log(post)
/*

[ { id:'xxx', title:'xxx', desc:'', content:'', ... }, { id:'xxx', title:'xxxx', desc:'xxx', content:'xxxx', ... } ]

*/
}
findPost()
复制代码
以上为创立文章以及查找文章，假如我们需求查找文章并且需求晓得关联数据则能够经过如下办法
async function findPost(){
const post = await prisma.post.findMany({

// where为限制条件 where:{},

include:{
author: true
}
})
console.log(post)
/*
[

{ id:'xxx', title:'xxx', desc:'', content:'', ...
author:{
id:'xxx',
userName:'xxx',
password:'xxxx',
...
}

},

]
*/