在 Next 13.0 專案使用 Prisma 操作 MySQL 資料庫

Next
, , , , , ,

建立專案

建立專案。

1
2
npx create-next-app@latest
cd prisma-next-example

安裝 Prisma 套件。

1
npm install prisma

使用 prisma 指令初始化。

1
npx prisma init

修改 .env 檔。

1
DATABASE_URL=mysql://root:root@localhost:3306/example

修改 .gitignore 檔。

1
.env

模型

修改 schema.prisma 檔。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
// This is your Prisma schema file,
// learn more about it in the docs: https://pris.ly/d/prisma-schema

generator client {
  provider = "prisma-client-js"
}

datasource db {
  provider = "mysql"
  url      = env("DATABASE_URL")
}

model Post {
  id        Int     @id @default(autoincrement())
  title     String
  content   String?
  published Boolean @default(false)
  author    User    @relation(fields: [authorId], references: [id])
  authorId  Int
  @@map("posts")
}

執行資料表遷移。

1
npx prisma migrate dev --name init

路由

新增 app/api/posts/route.js 檔。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
import { PrismaClient } from '@prisma/client'

const prisma = new PrismaClient()

export async function GET() {
  const posts = await prisma.post.findMany()

  const res = {
    data: posts,
  };

  return Response.json(res)
}

export async function POST() {
  const post = await prisma.post.create({
    data: {
      title: 'Test',
      content: 'Hello',
    },
  })

  const res = {
    data: post,
  };

  return Response.json(res)
}

查詢記錄。

1
2
curl --request GET \
  --url http://localhost:3000/api/posts \

新增記錄。

1
2
curl --request POST \
  --url http://localhost:3000/api/posts

程式碼

參考資料