NextJs基础-动态博客（一）

（第一节动态博客实现流程）

从数据库中提取数据

要知道，我们想通过实现一个动态博客，意味着要把博客的内容存放到数据库中，在了解这些之前我想过两种方式：

通过node js的fs模块将本地写的md文件直接上传到服务器，再通过静态渲染的方式进行渲染，数据库只记录文件地址，而不记录文章内容。

通过富文本编辑器，将内容编辑好了直接上传到服务器中，之后渲染从数据库获取的数据。

这两种方式都可以实现，第一种更偏向于博客是可展示的文章存储器，你可以用更友好的编辑器在本地编辑，博客的作用更多的在于分享，缺点也很明显，不方便修改。所以我选择的是第二种。

第二种其实更好理解，把富文本编辑器当作一个输入框，目前markdown的富文本编辑器也很多，我使用的是vditor也是一个所见即所得的编辑器，自定义的配置很多，但如果你只是想做一些简单的编辑功能，它也能做到开箱即用。（我在想，如果怕麻烦，直接用一个文本域，在本地Typora编辑好，复制过去也同样能实现）

当你编辑好，在配上一下作者、分类的信息，就可以上传到数据库当中了。

数据库我选择的是SQLite它是一个超小型轻量级的数据库，对于博客或者小型项目无论是SQL或者NoSQL，其实并不需要在技术选型上纠结，你没有海量的数据，也没有巨大的访问量，决定项目是否能做成的因素更多的是它是否好上手。

数据库的小科普

如果你对数据库不太了解，允许我在这插一嘴，这并不是对各种数据库的介绍，但是能帮助你理解接下来我们要做的事情。

前端在没有系统学习数据库可能会觉得非常困难，第一是种类较多，第二，它有独立的操作语言。

对于理解来说，你可以把数据库当作一个图书馆，利用它的编号，方便你随时拿去数据（到图书馆的时候是不是只要看到书号就能知道书的位置）。

我们这里不探讨关系数据库和非关系数据库的区别，只能说各有优势，非关系数据库以Mongodb为例，文档型的它不拘于固定的表结构，易于扩展，通常以键值对的形式出现，前端开发者也好理解，好上手。缺点也有，数据以单个呈现，不能够很好的连接起来。

关系型数据库，常见的关系型数据库都可以用SQL语句控制数据库，是个一劳永逸的事（不过好多，我懒不太想学），我个人认为关系型数据库更好理解，他就像一个excel，由表头，行、列组成。

那么，如果想用数据库，你需要做什么呢？

这里推荐一个超级好用 ORM Prisma

Prisma

先说优点，不用记SQL语句就可以直接操作数据库。看看官网是怎么介绍它的。

使用关系数据库是应用程序开发的主要瓶颈。调试 SQL 查询或复杂的 ORM 对象通常会消耗数小时的开发时间。

Prisma通过提供一个干净且类型安全的API来提交返回普通的旧JavaScript对象的数据库查询，从而使开发人员可以轻松地推理他们的数据库查询。

三步带你安装

```
npm install prisma --save-dev
```
在项目的根目录中创建 .env 文件，该文件用于定义环境变量（例如数据库连接）

在prisma/schema.prisma中

generator client {

  provider = "prisma-client-js"

}

datasource db {

  provider = "sqlite"

  url      = env("DATABASE_URL")

}

这里的DATABASE_URL是你需要在evn（全局环境变量）中配置的。

这里的你需要创建一个.env的文件在src的同级目录下

# Environment variables declared in this file are automatically made available to Prisma.
# See the documentation for more detail: https://pris.ly/d/prisma-schema#accessing-environment-variables-from-the-schema

# Prisma supports the native connection string format for PostgreSQL, MySQL, SQLite, SQL Server, MongoDB and CockroachDB.
# See the documentation for all the connection string options: https://pris.ly/d/connection-strings

DATABASE_URL="file:./dev.db"

下一章对数据库增删改查