nextjs와 prisma를 사용해서 프로젝트 세팅하기

ORM이란?

prisma는 대표적인 ORM 중 하나이다. 최근에 버전이 7로 올랐고, 같이 사용하는 nextjs도 버전이 16으로 올랐기 때문에 프로젝트를 세팅하는 방법도 약간 변경되었다. 해당 부분을 정리하기 전에 우선 ORM에 대한 정의를 짚어보고 가려 한다.
ORM은 Object Relational Mapping의 앞 글자들만 딴 글자이다. 사용하는 언어의 객체와 데이터베이스의 테이블 및 쿼리를 연결해줬다고 생각하면 된다.

SELECT * FROM USERS

prisma.users.findMany()

위와 같이 쿼리를 직접 쓰지 않고 사용하는 언어의 객체를 통해서 데이터를 가지고 올 수 있는 것이다. 복잡하지 않은 쿼리의 경우 쉽게 사용할 수 있고 같은 관계형 DB에 종속되지 않고도 ORM을 통해서 쉽게 접근할 수 있다. 물론 직접 쿼리를 입력할 수 있는 기능들도 제공해주는 경우가 많아서 장점이 많다고 할 수 있다.

Nextjs프로젝트에 prisma 세팅하기

대표적인 prisma를 nextjs 16 버전에 세팅해보겠다. 우선 필요한 라이브러리들을 설치하자.

npm i prisma @prisma/client @prisma/adapter-pg dotenv

공식문서를 보면 prisma는 devDependency에 추가하면 된다고 하지만 나의 경우는 개인 서버에 db도 같이 올리고 migration용 도커 이미지도 만들예정이라 프로덕션으로 설치했다.
위와 같이 설치하면 package.json파일에 종속성들이 다 추가된 것을 확인할 수 있을 것이다.(prisma 관련 종속성들의 버전은 모두 7 이상이어야 한다)

# package.json

"dependencies": {
    "@prisma/adapter-pg": "^7.2.0",
    "@prisma/client": "^7.2.0",
    "dotenv": "^17.2.3",  
    "prisma": "^7.2.0",
  },

나의 경우는 설치 버전이 위와 같다.

npx prisma init --output ../app/generated/prisma

위의 명령어를 실행하면 prisma에서 prisma/schema.prisma, prisma.config.ts, .env를 만들어준다. 이전 버전과 다르게 7 버전 부터는 prisma.config.ts가 추가되었다. 이제부터는 여기에 설정을 추가해주면 된다.
이제 DB를 만들어주자. 로컬에 DB를 설치해도 되고 prisma에서 제공해주는 postgres를 사용해도 된다. DB를 생성후엔 .env에 DATABASE_URL 값을 변경해준다.
이전버전들과 같이 prisma/schema.prisma에 model을 정의해주면 된다.

# prisma/schema.prisma

model User {
  id       String @id @default(uuid())
  username String
}

위 처럼 모델을 작성했거나 변경했으면 migration을 생성해줘야 한다.

npx prisma migrate dev --name init

위의 명령어를 실행하면 prisma/migrations 폴더가 생성되고 그 안에 migration 폴더들이 들어간다. 문서에 적힌대로 첫 마이그레이션은 init이라는 이름으로 했는데 이름의 경우 자신에 맞게 수정하면 된다.

npx prisma generate

그리고 prisma generate 명령어를 실행해주면 내가 정의한 모델들을 기반으로 클라이언트에서 활용할 수 있도록 타입과 코드를 생성해준다.
이제 prisma client를 생성해보자.

import { PrismaPg } from "@prisma/adapter-pg";

import { PrismaClient } from "../app/generated/prisma/client";

const globalForPrisma = global as unknown as {
  prisma: PrismaClient;
};

const adapter = new PrismaPg({
  connectionString: process.env.DATABASE_URL,
});

const prisma =
  globalForPrisma.prisma ||
  new PrismaClient({
    adapter,
  });

if (process.env.NODE_ENV !== "production") globalForPrisma.prisma = prisma;

export { prisma };

prisma client를 생성하고 난 후엔 코드 상에서 아래처럼 사용할 수 있다.

const user = await prisma.user.findFirst();

prisma에서는 crud를 편하게 확인할 수 있게 studio라는 GUI를 제공해주는데 아래 명령어로 실행할 수 있다.

npx prisma studio

해당 명령어를 입력하고 studio를 실행한 뒤 간단하게 값을 입력하고 확인할 수 있다.