Next.js 与 React 全栈开发：整合 TypeScript、Redux 和 Ant Design

在上一集，我们编写完毕导航页面，并且非常的美观，但是我们发现编写网站是存静态的，在现代的网站当中一般都是动静结合，也就是说部分数据是从数据库读取的，部分静态数据是写在网页上面的，因此这章讲述如何搭建一个数据库。

搭建数据库（PostgreSQL）

在这里我们使用容器的方法进行数据库搭建，这样的好处在于我们能快速的完整搭建，而不需要了解搭建的细节。

先判断服务器是否安装docker 容器，如果没安装需要安装，使用命令docker ps 判断是否安装成功，如果成功则如下图所示。

如果未安装成功则使用命令 apt install docker.io 安装（Ubuntu服务器），其他服务器则使用其他命令，如 yum install docker.io

安装容器成功之后，我们要使用Docker Compose进行容器管理，在当前目录下创建一个文件夹PostgreSQL_Compose用于存储Compose 配置文件，然后创建一个docker-compose.yml配置文件，并编辑以下内容保存。

version: '3.8'
services:
  db:
    image: postgres:13
    container_name: nextjs_dbs
    restart: always
    environment:
      POSTGRES_DB: nextjsdbs
      POSTGRES_USER: postgres
      POSTGRES_PASSWORD: 12345678
    ports:
      - "5432:5432"
    volumes:
      - ./data:/var/lib/postgresql/data

Docker Compose 配置文件解析

这个 Docker Compose 配置文件设置了一个 PostgreSQL 数据库服务。以下是各部分的详细说明：

version: '3.8': 指定使用的 Docker Compose 文件格式版本。
services: 定义服务。
- db: 服务名称。
  - image: postgres:13: 使用 PostgreSQL 13 版本的官方 Docker 镜像。
  - container_name: nextjs_dbs: 指定运行容器的名称为 nextjs_dbs。
  - restart: always: 设置容器总是重启，确保服务持续运行。
  - environment: 设置环境变量。
    - POSTGRES_DB: nextjsdbs: 初始数据库名。
    - POSTGRES_USER: postgres: 数据库用户名。
    - POSTGRES_PASSWORD: 12345678: 数据库密码。
  - ports: 端口映射。
    - "5432:5432": 将容器内的 5432 端口映射到主机的 5432 端口。
  - volumes: 数据卷配置。
    - ./data:/var/lib/postgresql/data: 将主机上的 ./data 目录挂载到容器内的 PostgreSQL 数据目录，用于持久化存储数据。
      这个配置文件设置了一个基本的 PostgreSQL 数据库环境，适合用于开发和测试 Next.js 应用程序。

容器使用方法

使用docker-compose up -d 运行容器，如果没有命令则需要使用apt install docker-compose 进行安装，下图为正在加载容器。

使用 docker-compose logs -f 命令查看容器的日志信息

使用 docker ps 命令查看容器的运行状态

如果你想看更多内容或者能够看到技术更新的内容，请百度搜索：曲速引擎 warp drive csdn 在首页找到我的地址访问即可，一线更新内容将会在我的个人博客上面更新，谢谢大家。

更详细内容查看

独立博客 https://www.dataeast.cn/
CSDN博客 https://blog.csdn.net/siberiaWarpDrive
B站视频空间 https://space.bilibili.com/25871614?spm_id_from=333.1007.0.0
关注 “曲速引擎 Warp Drive” 微信公众号